@charset "utf-8";
@import url('https://site-assets.fontawesome.com/releases/v5.15.4/css/all.css');

/* Common */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
html{ height:100%;}
body{height:100%;font-size:12px;word-wrap:break-word;-webkit-text-size-adjust:none;}
body,select,input,button,textarea,pre,code{font-family:'나눔고딕',NanumGothic,'맑은 고딕','Malgun Gothic','Nanum Gothic','돋움',Dotum,AppleGothic,helvetica,sans-serif;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,form,fieldset,p,button{margin:0;padding:0}
img,form,fieldset,iframe,object,embed,video,audio{max-width:100%;border:0;vertical-align:middle;}
h1,h2,h3,h4,h5,h6,p,ul,ol,dl,menu,blockquote,form,fieldset,pre{margin-top:1.333em;margin-bottom:1em;}
select,input,button,textarea{font-size:1em;vertical-align:middle;}
label,button,input[type=submit],input[type=reset],input[type=button],input[type=image],input[type=radio],input[type=checkbox]{cursor:pointer;overflow:visible;}
pre{white-space:pre-wrap;}
table{border-collapse:collapse;border-spacing:0;}
blockquote,q{quotes:none;}
blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;}
hr{display:none;}
a{text-decoration:none;}
a:link,a:visited{color:#333;cursor:pointer;}
a:link:hover,a:link:active,a:link:focus,
a:visited:hover,a:visited:active,a:visited:focus{color:#09c;text-decoration:underline;}
i,em,cite,dfn,var,address{font-style:normal;}
small,sub,sup{font-size:.88em}
acronym,abbr{cursor:help}
.sr-only {width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0,0,0,0);border: 0;}
.text-center {text-align:center;}
.text-left {text-align:left;}
.text-right {text-align:right;}

#container {width:100%;max-width:900px;margin:0 auto}
.background{
	position: relative;
	width: 100%;
	margin: 0 auto;
	background-color:#fff000;
}
.background img{
	position: relative;
	z-index:1;
	width: 100%
}
.download-wrap{position: absolute; width:100%; bottom:20%; z-index:2}
.download{padding:0 13%; letter-spacing: -.035em;}
.download .loop{float:left; width:50%}
.download .loop a{letter-spacing: -.01em;text-decoration:none;border-radius:50px;transition-timing-function: ease-in-out;transition-property: color, background-color;transition-duration: .25s;display:block;width:94%; height:66px; color:#fff; text-align:center; font-weight: bold; font-size:19px; line-height:68px; margin:0 auto; background-color:#38ba09}
.download .loop:last-child a{color:#000; background-color:#fff}
.download .loop a i{margin-right:8px}
.download .text-wrap{clear: both; color:#fff; font-size: 20px; text-align:center; margin-bottom:8%}

@media screen and (max-width:991px) {
	.download .loop a{border-radius:45px; height:62px; font-size:14px; line-height:64px}
	.download .text-wrap{font-size: 17px}
}
@media screen and (max-width:767px) {
	.download-wrap{bottom:18%}
	.download{padding:0 2%;}
	.download .loop a{border-radius:40px; height:60px; font-size:13.5px; line-height:62px}
	.download .loop a i{margin-right:3px}
	.download .text-wrap{font-size: 16px}
}
@media screen and (max-width:575px) {
	.download-wrap{bottom:16%}
	.download{padding:0 1%;}
	.download .loop a{border-radius:35px; height:54px; font-size:13px; line-height:56px}
	.download .text-wrap{font-size: 15px}
}
@media screen and (max-width:375px) {
	.download-wrap{bottom:14%}
	.download .loop a{border-radius:30px; height:50px; font-size:12.5px; line-height:54px}
	.download .text-wrap{font-size: 14px}
}