@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
@font-face { font-family: 'GmarketSansBold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); font-weight: normal; font-style: normal; }


body { padding-top:80px;}

#wrapper { width: 100%; height: 100%; position: relative; margin: 0 auto; }

/*header 시작*/
header { position:fixed; top: 0; left: 0; width: 100%; height: 80px; margin:0 auto; z-index: 100; background:#fff; border-bottom: 1px solid rgba(0,0,0,0.05); }
header .inner-wrap { display:block; width: 1080px; height:100%; margin:0 auto; }
header .logo { float:left; width: 148px; height: 32px; text-indent:-9999px; background:url(../../images/landing/logo_header.png) no-repeat 0 0; background-size:contain; margin-top: 28px;}
header .logo a { display:block; width:100%; height:100%;}
header .gnb { float:right; margin-top:26px;}
header .gnb li { float:left; margin-left:40px;}
header .gnb li:first-child { margin-left:0!important;}
header .gnb li a { transition:all 0.5s; font-size:17px; color:#161616; font-weight:bold; }
header .gnb li a:hover { color:#51BDFF; }
/*header 끝*/


/*section 메인 시작*/
.section-main { overflow:hidden; position:relative; width:100%; margin:0 auto; background:url(../../images/landing/bg_main.png) no-repeat 0 0; height: 780px; background-size:cover; }
.section-main .inner-wrap { position:relative; display:block; width:1080px; height:100%; margin:0 auto; padding: 262px 0;}
.section-main .inner-wrap .illust {z-index:0; position:absolute; right:-200px; bottom:0; width: 680px; height: 680px;background:url(../../images/landing/main_illust.png) no-repeat 0 0; background-size:contain; }
.section-main .inner-wrap .text { z-index:1; position:relative; display:inline-block; width:100%; height:auto;}
.section-main .inner-wrap .text p { font-size:24px; margin-bottom:24px; color: #292929; margin: 20px 0 0; }
.section-main .inner-wrap .text h4 { display:inline-block; font-size:50px; font-weight: bold; line-height:1.1; color: #292929; }
.section-main .inner-wrap .text h4 span {display:inline-block; font-size:50px; font-weight: bold; color:#60c21e;}
.section-main .inner-wrap .text .btn { display: inline-block; margin-top:40px; width:200px; height:60px; text-align:center; margin-right: 6px; }
.section-main .inner-wrap .text .btn a { border-radius: 4px; border: solid 1px #161616; background-color: #161616; transition:all 0.5s; border:1px solid #161616; border-radius:4px; position:relative; display:inline-block; width:100%; height:100%; font-size:18px; line-height:58px; font-weight:400; color:#fff; }
.section-main .inner-wrap .text .btn a:hover { background:#161616; color:#fff; }
.section-main .inner-wrap .text .btn.google a:before { content:''; display: inline-block; vertical-align: middle; margin: -2px 8px 0 0; width:32px; height:32px; background:url(../../images/landing/icon_google.png) no-repeat 0 0; background-size:contain; }
.section-main .inner-wrap .text .btn.apple a:before { content:''; display: inline-block; vertical-align: middle; margin: -2px 8px 0 0; width:32px; height:32px; background:url(../../images/landing/icon_apple.png) no-repeat 0 0; background-size:contain; }
/*section 메인 끝*/


/*section 1 시작*/
.section-1 { position:relative; width:100%; margin:0 auto; background:#fff url(../../images/landing/bg_section-1.png) no-repeat 0 0; background-size:cover; height:337px; }
.section-1 .inner-wrap { position:relative; display:block; width:1080px; height:100%; margin:0 auto; }
.section-1 .inner-wrap .illust {z-index:0; position:absolute; left:-120px; bottom:0; width:540px; height:540px; background:url(../../images/landing/bg_1.png) no-repeat 0 0; background-size:contain; }
.section-1 .inner-wrap .text {position:absolute; top:50%; margin-top:-80px; left:100px; width:100%; height:auto; z-index:1; display:block; text-align:center; }
.section-1 .inner-wrap .text h4 { display:inline-block; font-size: 50px; font-weight: bold; color:#fff; line-height: 1.48;
 letter-spacing: -1.5px; margin-bottom:16px; }
.section-1 .inner-wrap .text p { font-size: 22px; font-weight: normal; line-height: 1.55; letter-spacing: -0.66px; text-align: center; color: #ffffff; }
/*section 1 끝*/

/*section 2 시작*/
.section-2 { position:relative; width:100%; margin:0 auto; background:#fff; height:580px; }
.section-2 .inner-wrap { position:relative; display:block; width:1080px; height:100%; margin:0 auto; }
.section-2 .inner-wrap .illust {z-index:0; position:absolute; right:-120px; bottom:0; width:540px; height:540px; background:url(../../images/landing/bg_2.png) no-repeat 0 0; background-size:contain; }
.section-2 .inner-wrap .text {position:absolute; top:50%; margin-top:-58px; left:0; width:720px; height:auto; z-index:1; display:block; text-align:left;}
.section-2 .inner-wrap .text h5 { font-size: 28px; font-weight: bold; line-height: 1.93; letter-spacing: -0.84px; text-align: left; color: #292929; margin: 0 0 4px; }
.section-2 .inner-wrap .text h4 { display:inline-block; font-size: 36px; font-weight: bold; line-height: 1.39; letter-spacing: -1.08px; text-align: left; color: #292929; margin-bottom: 24px; }
.section-2 .inner-wrap .text h4 span { color: #60c21e; font-size: 36px; font-weight: bold; }
.section-2 .inner-wrap .text p { font-size: 18px; font-weight: normal; line-height: 1.5; letter-spacing: -0.54px; text-align: left; color: #565656;}
/*section 2 끝*/

/*section 3 시작*/
.section-3 { position:relative; width:100%; margin:0 auto; background-color: #f6ffef; height:580px; }
.section-3 .inner-wrap { position:relative; display:block; width:1080px; height:100%; margin:0 auto; }
.section-3 .inner-wrap .illust {z-index:0; position:absolute; left:-120px; bottom:0; width:540px; height:540px; background:url(../../images/landing/bg_3.png) no-repeat 0 0; background-size:contain; }
.section-3 .inner-wrap .text {position:absolute; top:50%; margin-top:-74px; right:0; width:720px; height:auto; z-index:1; display:block; text-align: right; }
.section-3 .inner-wrap .text h4 { display:inline-block; font-size: 36px; font-weight: bold; line-height: 1.39; letter-spacing: -1.08px; text-align: right; color: #292929; margin-bottom: 24px; }
.section-3 .inner-wrap .text h4 span { color: #60c21e; font-size: 36px; font-weight: bold; }
.section-3 .inner-wrap .text p { font-size: 18px; font-weight: normal; line-height: 1.5; letter-spacing: -0.54px; text-align: right; color: #565656; }
/*section 3 끝*/

/*section 4 시작*/
.section-4 { position:relative; width:100%; margin:0 auto; background:#ggg; height:580px; }
.section-4 .inner-wrap { position:relative; display:block; width:1080px; height:100%; margin:0 auto; }
.section-4 .inner-wrap .illust {z-index:0; position:absolute; right:-120px; bottom:0; width:540px; height:540px; background:url(../../images/landing/bg_4.png) no-repeat 0 0; background-size:contain; }
.section-4 .inner-wrap .text {position:absolute; top:50%; margin-top:-80px; left:0; width:720px; height:auto; z-index:1; display:block; text-align:left;}
.section-4 .inner-wrap .text h4 { display:inline-block; font-size: 36px; font-weight: bold; line-height: 1.39; letter-spacing: -1.08px; text-align: left; color: #292929; margin-bottom: 24px;}
.section-4 .inner-wrap .text h4 span { color: #60c21e; font-size: 36px; font-weight: bold; }
.section-4 .inner-wrap .text p { font-size: 18px; font-weight: normal; line-height: 1.5; letter-spacing: -0.54px; text-align: left; color: #565656; }
/*section 4 끝*/

/*section 5 시작*/
.section-5 { position:relative; width:100%; margin:0 auto; background: #f6ffef url(../../images/landing/section-5_bg.png) no-repeat 0 bottom; background-size:contain; height:580px; }
.section-5 .inner-wrap { position:relative; display:block; width:1080px; height:100%; margin:0 auto; }
.section-5 .inner-wrap .illust {z-index:0; position:absolute; left:-120px; bottom:0; width:540px; height:540px; background:url(../../images/landing/bg_5.png) no-repeat 0 0; background-size:contain; }
.section-5 .inner-wrap .text {position:absolute; top:50%; margin-top:-74px; right:0; width:720px; height:auto; z-index:1; display:block; text-align: right; }
.section-5 .inner-wrap .text h4 { display:inline-block; font-size: 36px; font-weight: bold; line-height: 1.39; letter-spacing: -1.08px; text-align: right; color: #292929; margin-bottom: 24px; }
.section-5 .inner-wrap .text h4 span { color: #60c21e; font-size: 36px; font-weight: bold; }
.section-5 .inner-wrap .text p { font-size: 18px; font-weight: normal; line-height: 1.5; letter-spacing: -0.54px; text-align: right; color: #565656; }

/*section 6 시작*/
.section-6 { position:relative; width:100%; margin:0 auto; background:#fff; height:580px; }
.section-6 .inner-wrap { position:relative; display:block; width:1080px; height:100%; margin:0 auto; }
.section-6 .inner-wrap .illust {z-index:0; position:absolute; right:-120px; bottom:0; width:540px; height:540px; background:url(../../images/landing/bg_6.png) no-repeat 0 0; background-size:contain; }
.section-6 .inner-wrap .text {position:absolute; top:50%; margin-top:-80px; left:0; width:720px; height:auto; z-index:1; display:block; text-align:left;}
.section-6 .inner-wrap .text h4 { display:inline-block; font-size: 36px; font-weight: bold; line-height: 1.39; letter-spacing: -1.08px; text-align: left; color: #292929; margin-bottom: 24px;}
.section-6 .inner-wrap .text h4 span { color: #60c21e; font-size: 36px; font-weight: bold; }
.section-6 .inner-wrap .text p { font-size: 18px; font-weight: normal; line-height: 1.5; letter-spacing: -0.54px; text-align: left; color: #565656; }
.section-6 .inner-wrap .text .btn a.line-green { display: inline-block; width: 200px; height: 60px; margin: 40px 8px 107px 0; padding: 17px 0 16px ; border-radius: 4px; border: solid 1px #60c21e; background-color: #ffffff; font-size: 18px; font-weight: normal; letter-spacing: -0.54px; text-align: center; color: #60c21e; }
.section-6 .inner-wrap .text .btn a.green { display: inline-block; width: 200px; height: 60px; margin: 40px 172px 107px 0; padding: 17px 0 16px; border-radius: 4px; border: solid 1px #60c21e; background-color: #60c21e; font-size: 18px; font-weight: normal; letter-spacing: -0.54px; text-align: center; color: #ffffff; }
/*section 6 끝*/

/*section 7 시작*/
.section-7 { overflow:hidden; position:relative; width:100%; margin:0 auto; background:url(../../images/landing/section-7_bg.png) no-repeat 0 0; height: 320px; background-size:cover; }
.section-7 .inner-wrap { position:relative; display:block; width:1080px; height:100%; margin:0 auto; padding: 70px 0;}
.section-7 .inner-wrap .text { z-index:1; position:relative; display:inline-block; width:100%; height:auto; text-align: center;}
.section-7 .inner-wrap .text p { font-size:22px; margin-bottom:2px; color: #fff; line-height: 1.5; letter-spacing: -0.66px; }
.section-7 .inner-wrap .text h4 { display: block; font-size:36px; font-weight: bold; line-height: 1.5; letter-spacing: -1.08px; color: #fff; }
.section-7 .inner-wrap .text .btn { display: inline-block; margin-top:32px; width:200px; height:60px; text-align:center; margin-right: 6px; }
.section-7 .inner-wrap .text .btn a { border-radius: 4px; background-color: #fff; transition:all 0.5s; border:1px solid #fff; border-radius:4px; position:relative; display:inline-block; width:100%; height:100%; font-size:18px; line-height:58px; font-weight:400; color:#161616; }
.section-7 .inner-wrap .text .btn.google a:before { content:''; display: inline-block; vertical-align: middle; margin: -2px 8px 0 0; width:32px; height:32px; background:url(../../images/landing/icon_google.png) no-repeat 0 0; background-size:contain; }
.section-7 .inner-wrap .text .btn.apple a:before { content:''; display: inline-block; vertical-align: middle; margin: -2px 8px 0 0; width:32px; height:32px; background:url(../../images/landing/icon_apple2.png) no-repeat 0 0; background-size:contain; }
/**section 7 끝*/

/*footer 시작*/
footer { position:relative; width:100%; margin:0 auto; color:#fff; }
footer .inner-wrap { margin:0 auto; width:1080px; padding:60px 0 80px; display:block; height:auto;}
footer .inner-wrap .text-1 { }
footer .inner-wrap .text-1 h4 { font-size: 16px; font-weight: bold; line-height: 1.5; letter-spacing: -0.48px; text-align: left; color: #565656; }
footer .inner-wrap .text-1 p { font-size: 14px; font-weight: normal; line-height: 1.86; letter-spacing: -0.42px; text-align: left; color: #868686; margin-top:16px;}
footer .inner-wrap .text-1 p span { color:#868686; margin-right:16px;}
footer .inner-wrap .copyright { font-size: 13px; font-weight: normal; line-height: 1.46; letter-spacing: normal; text-align: left; color: #b6b6b6; margin: 32px 0 0; }
/*footer 끝*/




@media screen and (max-width: 767px) {
	body { padding-top: 40px; }

	header { width: 100%; height: 40px; overflow: hidden; }
	header .inner-wrap { display:block; width:100%; height:100%; margin:0 auto; padding: 0 16px; }
	header .logo { width: 93px; height: 20px; margin: 10px 0 0; }
	header .gnb { width: 235px; margin: 6px 0 0;  padding-left: 16px; }
	header .gnb li { margin-left: 8px; }
	header .gnb li a { font-size: 11px;  letter-spacing: -1px; }

	.section-main {overflow:hidden; position:relative; width:100%; margin:0 auto; background:url(../../images/landing/bg_main.png) no-repeat 0 0; background-size: 240%; height: 760px; }
	.section-main .inner-wrap { position:relative; display:block; width: 100%; height:100%; margin:0 auto; padding: 109px 0 0; }
	.section-main .inner-wrap .text { text-align: center; }
	.section-main .inner-wrap .text h4 { font-size: 25px; font-weight: bold; line-height:1.1; color: #292929; }
	.section-main .inner-wrap .text h4 span { font-size:25px; font-weight: bold; color:#60c21e;}
	.section-main .inner-wrap .text p { font-size: 12px; margin: 8px 0 0; }
	.section-main .inner-wrap .text .btn { display: inline-block; margin-top: 16px; width: 126px; height: 48px; text-align:center; margin-right: 6px; }
	.section-main .inner-wrap .text .btn a { font-size: 13px; line-height: 48px; }
	.section-main .inner-wrap .text .btn.google a:before { margin: -2px 8px 0 0; width: 24px; height: 24px; }
	.section-main .inner-wrap .text .btn.apple a:before { margin: -2px 8px 0 0; width: 24px; height: 24px; }
	.section-main .inner-wrap .illust {z-index:0; position:absolute; right: -60px; bottom:0; width: 480px; height: 480px; background:url(../../images/landing/main_illust.png) no-repeat 0 0; background-size:contain; }

	.section-1 { background:#fff url(../../images/landing/bg_section-1.png) no-repeat 0 0; background-size: 240%; height: 160px; }
	.section-1 .inner-wrap { width: 100%; }
	.section-1 .inner-wrap .text { position:static; }
	.section-1 .inner-wrap .text h4 { font-size: 20px; margin: 32px 0 0; }
	.section-1 .inner-wrap .text p { margin-top: 16px; font-size: 12px; }

	.section-2 { height: 670px; }
	.section-2 .inner-wrap { width: 100%; }
	.section-2 .inner-wrap .illust {z-index:0; position:absolute; right: -60px; bottom:0; width: 480px; height:480px; background:url(../../images/landing/bg_2.png) no-repeat 0 0; background-size:contain; }
	.section-2 .inner-wrap .text { position: absolute; top: 0; margin-top: 0; width: 100%; text-align: left; padding: 32px; }
	.section-2 .inner-wrap .text h5 { font-size: 16px; margin: 0 0 4px; }
	.section-2 .inner-wrap .text h4 { font-size: 20px; margin-bottom: 12px; }
	.section-2 .inner-wrap .text h4 span { font-size: 18px; }
	.section-2 .inner-wrap .text p { font-size: 12px; }
	.section-2 .inner-wrap .text p br { display: none !important; }

	.section-3 { height: 620px; }
	.section-3 .inner-wrap { width: 100%; }
	.section-3 .inner-wrap .illust {z-index:0; position:absolute; left: -60px; bottom:0; width: 480px; height:480px; background:url(../../images/landing/bg_3.png) no-repeat 0 0; background-size:contain; }
	.section-3 .inner-wrap .text { position: absolute; top: 0; margin-top: 0; width: 100%; padding: 40px 32px 40px 0; text-align: right; }
	.section-3 .inner-wrap .text h4 { font-size: 17px; margin-bottom: 16px; }
	.section-3 .inner-wrap .text h4 span { color: #60c21e; font-size: 17px; font-weight: bold; }
	.section-3 .inner-wrap .text p { font-size: 12px; text-align: right; color: #565656; }

	.section-4 { height: 620px; }
	.section-4 .inner-wrap { width: 100%; }
	.section-4 .inner-wrap .illust {z-index:0; position:absolute; right: -60px; bottom:0; width: 480px; height:480px; background:url(../../images/landing/bg_4.png) no-repeat 0 0; background-size:contain; }
	.section-4 .inner-wrap .text { position: absolute; top: 0; margin-top: 0; width: 100%; text-align: left; padding: 40px 0 32px 32px; }
	.section-4 .inner-wrap .text h5 { font-size: 16px; margin: 0 0 4px; }
	.section-4 .inner-wrap .text h4 { font-size: 20px; margin-bottom: 12px; }
	.section-4 .inner-wrap .text h4 span { font-size: 18px; }
	.section-4 .inner-wrap .text p { font-size: 12px; }
	.section-4 .inner-wrap .text p br { display: none !important; }

	.section-5 { height: 600px; }
	.section-5 .inner-wrap { width: 100%; }
	.section-5 .inner-wrap .illust {z-index:0; position:absolute; left: -60px; bottom:0; width: 480px; height:480px; background:url(../../images/landing/bg_5.png) no-repeat 0 0; background-size:contain; }
	.section-5 .inner-wrap .text { position: absolute; top: 0; margin-top: 0; width: 100%; padding: 40px 32px 40px 0; text-align: right; }
	.section-5 .inner-wrap .text h4 { font-size: 20px; margin-bottom: 16px; }
	.section-5 .inner-wrap .text h4 span { color: #60c21e; font-size: 20px; font-weight: bold; }
	.section-5 .inner-wrap .text p { font-size: 12px; text-align: right; color: #565656; }

	.section-6 { height: 720px; }
	.section-6 .inner-wrap { width: 100%; }
	.section-6 .inner-wrap .illust {z-index:0; position:absolute; right: -60px; bottom:0; width: 480px; height:480px; background:url(../../images/landing/bg_6.png) no-repeat 0 0; background-size:contain; }
	.section-6 .inner-wrap .text { position: absolute; top: 0; margin-top: 0; width: 100%; text-align: left; padding: 40px 24px 32px 32px; }
	.section-6 .inner-wrap .text h5 { font-size: 16px; margin: 0 0 4px; }
	.section-6 .inner-wrap .text h4 { font-size: 20px; margin-bottom: 12px; }
	.section-6 .inner-wrap .text h4 span { font-size: 18px; }
	.section-6 .inner-wrap .text p { font-size: 12px; }
	.section-6 .inner-wrap .text p br { display: none !important; }
	.section-6 .inner-wrap .text .btn { text-align: center; }
	.section-6 .inner-wrap .text .btn a.line-green { display: inline-block; width: 126px; height: 48px; line-height: 46px; margin: 24px 8px 0 0; border-radius: 4px; padding: 0; border: solid 1px #60c21e; background-color: #ffffff; font-size: 16px; font-weight: normal; letter-spacing: -0.54px; text-align: center; color: #60c21e; }
	.section-6 .inner-wrap .text .btn a.green { display: inline-block; width: 126px; height: 48px; line-height: 46px; margin: 24px 0 0; border-radius: 4px; padding: 0; border: solid 1px #60c21e; background-color: #60c21e; font-size: 16px; font-weight: normal; letter-spacing: -0.54px; text-align: center; color: #ffffff; }

	.section-7 { overflow:hidden; position:relative; width:100%; margin:0 auto; background:url(../../images/landing/section-7_bg.png) no-repeat 0 0; height: 300px; background-size:cover; }
	.section-7 .inner-wrap { position:relative; display:block; width:100%; height:100%; margin:0 auto; padding: 50px 0;}
	.section-7 .inner-wrap .text { z-index:1; position:relative; display:inline-block; width:100%; height:auto; text-align: center; padding: 0 16px; }
	.section-7 .inner-wrap .text p { font-size: 18px; margin-bottom: 8px; }
	.section-7 .inner-wrap .text h4 { font-size: 26px; }
	.section-7 .inner-wrap .text .btn { display: inline-block; margin-top:32px; width: 126px; height: 48px; text-align:center; margin-right: 6px; }
	.section-7 .inner-wrap .text .btn a { border-radius: 4px; background-color: #fff; transition:all 0.5s; border:1px solid #fff; border-radius:4px; position:relative; display:inline-block; width:100%; height:100%; font-size:12px; line-height: 46px; font-weight:400; color:#161616; }
	.section-7 .inner-wrap .text .btn.google a:before { content:''; display: inline-block; vertical-align: middle; margin: -2px 8px 0 0; width:32px; height:32px; background:url(../../images/landing/icon_google.png) no-repeat 0 0; background-size:contain; }
	.section-7 .inner-wrap .text .btn.apple a:before { content:''; display: inline-block; vertical-align: middle; margin: -2px 8px 0 0; width:32px; height:32px; background:url(../../images/landing/icon_apple2.png) no-repeat 0 0; background-size:contain; }

	footer .inner-wrap { margin:0 auto; width:100%; padding:40px 32px; display:block; height:auto;}
	footer .inner-wrap .text-1 h4 { font-size: 14px; }
	footer .inner-wrap .text-1 p { font-size: 12px; margin-top: 8px; }
	footer .inner-wrap .text-1 p span { color:#868686; margin-right: 8px;}
	footer .inner-wrap .copyright { font-size: 11px; margin: 24px 0 0; }
}





















