@charset "utf-8";

body,
input[type='text'],
input[type='password'],
input[type='file'],
select,
textarea,
button {font-family:sans-serif;}

body, form, fieldset, legend {margin: 0;padding: 0;border: 0 none;}

em, address {font-style: normal;}

hr {margin: 0;padding: 0;border: 0 none;}

.fcPoint {color: #2659af !important;} /* 파란색 */
.fcRed {color: #ed2024 !important;}

#skipNavi, #skipNavi dt, #skipNavi dd,
.hidden,
legend {position: relative;left: -10000px;top: -10000px;visibility: hidden;width: 0;height: 0;margin: 0;padding: 0;list-style:none;}


div.wrapper {color: #666;font-family: 'NotoSansKR Regular', sans-serif;}

/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.wrapper {min-width: 320px;font-size: 14px;line-height: 20px;}
.pcOnly {display: none !important;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.wrapper {min-width: 1020px;font-size: 20px;line-height: 30px;}
.mOnly {display: none !important;}
}


/* Header */
div#headerWrap {position: relative;}
div#headerWrap h1 {margin: 0;padding: 0;}
div#headerWrap h1 a,
div#headerWrap h1 img {display: block;}

ul#gnb, ul#gnb li, ul#gnb a {margin: 0;padding: 0;list-style:none;text-decoration: none;}
ul#gnb a {display: block;text-align: center;color: #4c4c4c;font-family: 'NotoSansKR Medium', sans-serif;}

/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div#headerWrap {height: 65px;}
div#headerWrap h1 {padding-right: 65px;}
div#headerWrap h1 a {padding: 21px 0 21px 20px;}
div#headerWrap h1 img {height: 23px;}

ul#gnb {display: none;z-index: 50;position: absolute;left: 0;top: 65px;width: 100%;padding: 0 15px;box-sizing:border-box;background-color: #fff;}
ul#gnb li {border-top: 1px solid #c2c2c2;}
ul#gnb a {padding: 10px 0;font-size: 14px;line-height: 20px;}

div.gnbView,
div.gnbClose {position: absolute;right: 0;top: 0;}
div.gnbView a,
div.gnbClose a {position: relative;display: block;width: 65px;height: 65px;}
div.gnbView img,
div.gnbClose img {display: block;width: 100%;}
div.gnbClose {display: none;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div#headerWrap {height: 110px;}
div#headerWrap h1 {position: absolute;left: 50%;top: 33px;margin-left: -500px;}

ul#gnb {width: 1000px;margin: 0 auto;padding: 31px 0;font-size: 0;line-height: 0;text-align: right;}
ul#gnb li {display: inline-block;vertical-align: top;padding-right: 120px;}
ul#gnb a {font-size: 24px;line-height: 48px;}

ul#gnb li:last-child {padding-right: 0;}
ul#gnb li:last-child a {width: 150px;border: 3px solid #ff3a4a;border-radius: 24px;color: #ff3a4a;line-height: 42px;}

div.gnbView,
div.gnbClose {display: none;}
}







/* ====== Footer ====== */
div#footerWrap {background-color: #eef3fc;}

/* 앱다운로드 정보 */
div#goDown p {margin: 0;padding: 0;list-style:none;text-decoration: none;}
div#goDown {text-align: center;}
div#goDown p {color: #212121;font-family: 'NotoSansKR Bold', sans-serif;}
div#goDown p span {display: block;color: #999;font-family: 'NotoSansKR Regular', sans-serif;}


/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div#footerWrap {padding: 40px 0 25px;}

div#goDown p {font-size: 16px;line-height: 20px;}
div#goDown p span {padding-top: 5px;font-size: 12px;line-height: 16px;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div#footerWrap {padding: 50px 0;}

div#goDown {padding-top: 40px;}
div#goDown p {font-size: 45px;line-height: 50px;}
div#goDown p span {padding-top: 20px;font-size: 22px;line-height: 24px;}
}

div.download, div.download ul, div.download li, div.download a {margin: 0;padding: 0;list-style:none;text-decoration: none;}
div.download .tit {background-position: center top;background-repeat: no-repeat;text-align: center;font-size: 0;line-height: 0;}
div.download li {display: inline-block;vertical-align: top;border-radius: 10px;box-shadow:0 0 16px rgba(204,207,223,.5);background-color: #fff;}
div.download a {display: block;font-size: 0;line-height: 0;background-position: center center;background-repeat: no-repeat;}

/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.download {margin-top: 20px;}
div.download .tit {height: 98px;background-image: url('../image/footer_pass_m.png');background-size: 77px;}
div.download li {margin: 0 6px;}
div.download a {width: 120px;height: 42px;background-image: url('../image/appStore_m.png');background-size: auto 42px;}
div.download li:first-child a {background-image: url('../image/googlePlay_m.png');}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.download {margin-top: 55px;}
div.download .tit {height: 290px;background-image: url('../image/footer_pass.png');}
div.download li {margin: 0 15px;}
div.download a {width: 316px;height: 112px;background-image: url('../image/appStore.png');}
div.download li:first-child a {background-image: url('../image/googlePlay.png');}
}




/* 약관동의 */
ul.policy, ul.policy li, ul.policy a {margin: 0;padding: 0;list-style:none;text-decoration: none;}
ul.policy {font-size: 0;line-height: 0;text-align: center;}
ul.policy li {position: relative;display: inline-block;vertical-align: top;}
ul.policy li:before {position: absolute;top: 50%;width: 1px;content: "";background-color: #666;transform:translateY(-50%);}
ul.policy a {color: #666;font-family: 'NotoSansKR Bold', sans-serif;}

ul.policy li:first-child {padding-left: 0;}
ul.policy li:first-child:before {display: none;}
ul.policy li:first-child a {font-family: 'NotoSansKR Regular', sans-serif;}

/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
ul.policy {padding: 30px 0 35px;}
ul.policy li {padding-left: 20px;margin-top: 4px;}
ul.policy li:before {left: 10px;height: 10px;}
ul.policy a {font-size: 12px;line-height: 14px;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
ul.policy {padding: 95px 0 85px;}
ul.policy li {padding-left: 90px;}
ul.policy li:before {left: 45px;height: 20px;}
ul.policy a {font-size: 28px;line-height: 30px;}
}


div.contact, div.contact a {margin: 0;padding: 0;text-decoration: none;}
div.contact {position: relative;display: inline-block;vertical-align: top;background-color: #fff;box-sizing:border-box;}
div.contact,
div.contact a {color: #212121;font-family: 'NotoSansKR Bold', sans-serif;}
div.contact .tit {position: absolute;left: 0;top: 50%;transform:translateY(-50%);text-align: center;}
div.contact span {display: block;color: #999;font-family: 'NotoSansKR Regular', sans-serif;}

/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.contact {width: 300px;padding: 10px 0 10px 120px;text-align: center;}
div.contact:before {position: absolute;left: 120px;top: 10px;width: 1px;height: calc(100% - 20px);content: "";background-color: #ababab;}
div.contact,
div.contact a {font-size: 14px;line-height: 20px;}
div.contact .tit {width: 120px;}
div.contact span {padding-top: 5px;font-size: 10px;line-height: 14px;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.contact {width: 715px;padding: 36px 0 36px 295px;text-align: center;}
div.contact:before {position: absolute;left: 295px;top: 25px;width: 2px;height: calc(100% - 50px);content: "";background-color: #ababab;}
div.contact,
div.contact a {font-size: 33px;line-height: 35px;}
div.contact .tit {width: 295px;}
div.contact span {padding-top: 11px;font-size: 22px;line-height: 24px;}
}







/* Footer */
div.footer, address, div.footer ul, div.footer li, div.footer p, div.footer a {margin: 0;padding: 0;list-style:none;text-decoration: none;font-style: normal;}
div.footer {text-align: center;font-size: 0;line-height: 0;font-family: 'NotoSansKR Light', sans-serif;}

div.footer,
div.footer a {color: #666;}
div.footer div.tit, div.footer ul, div.footer li {display: inline-block;vertical-align: top;}
div.footer div.tit {font-size: 0;line-height: 0;background-position: 0 0;background-repeat: no-repeat;}

/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.footer {margin: 24px auto 0;}
div.footer div.tit {width: 30px;height: 20px;background-image: url('../image/footer_logo_m.png');background-size: 20px;}
div.footer ul {width: 80%;max-width:428px;}
div.footer li,
div.footer p {font-size: 10px;line-height: 14px;}
div.footer li {display: inline-block;vertical-align: top;padding: 0 2px;}
div.footer p {padding-top: 5px;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.footer {margin: 0 auto;}
div#goDown + div.footer {margin-top: 80px;}
div.footer div.tit {width: 100px;height: 60px;background-image: url('../image/footer_logo.png');background-position: 0 4px;}
div.footer ul {width: 680px;}
div.footer li,
div.footer p {font-size: 16px;line-height: 20px;}
div.footer li {display: inline-block;vertical-align: top;padding: 0 2px;}
div.footer p {padding-top: 10px;}
}




/* 메인*/

div.main .bg {background-color: #eef3fc;}

div.animationArea .animation {opacity: 0;}

div.section01 {position: relative;background:#4f5f6f url('../image/mainBg.png') center bottom no-repeat;box-sizing:border-box;}
div.section01 div.txt {margin: 0;padding: 0;text-align: center;text-align: center;color: #fff;font-family: 'NotoSansKR Bold', sans-serif;}
div.section01 div.txt span {display: block;background-position: center top;background-repeat: no-repeat;}
div.section01 div.txt span:last-child {color: rgba(255,255,255,0);}


div.scrollDown {z-index: 40;position: absolute;left: 50%;transform:translateX(-50%);}
div.scrollDown a {display: block;font-size: 0;line-height: 0;animation-duration:2s;animation-name:flicker; animation-iteration-count: infinite;}
@keyframes flicker {
	0% {opacity:0.6;transform:translateY(-100%);}
	50% {opacity:1;transform:translateY(0);}
	100% {opacity:0.6;transform:translateY(-100%);}
}




/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.section01 {height: 400px;padding-top: 100px;background-size: auto 400px;}
div.section01 div.txt {font-size: 30px;line-height: 40px;}
div.section01 div.txt span:last-child {width: 100%;margin-top: 15px;height: 42px;background-image: url('../image/main_logo_m.png');background-size: auto 42px;}

div.scrollDown {bottom: 10px;width: 25px;}
div.scrollDown a {height: 10px;}
div.scrollDown img {display: block;height: 10px;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div#container.main {padding-bottom: 0;}

div.section01 {height: 970px;padding-top: 110px;}
div.section01 div.txt {font-size: 70px;line-height: 80px;}
div.section01 div.txt span:last-child {margin-top: 25px;height: 96px;background-image: url('../image/main_logo.png');}

div.scrollDown {bottom: 20px;width: 70px;}
div.scrollDown a {height: 29px;background-image: url('../image/scrollDown.png');}
div.scrollDown img {display: none;}
}


div.section02 {}
div.section02 > div {text-align: center;color: #212121;font-family: 'NotoSansKR Medium', sans-serif;}
div.section02 > div span {display: block;color: #ff3a4a;font-family: 'NotoSansKR Bold', sans-serif;}

div.passCon {position: relative;text-align: center;}
div.passCon div.tit {color: #ff3a4a;font-family: 'NotoSansKR Bold', sans-serif;}
div.passCon div.txt {color: #212121;font-family: 'NotoSansKR Medium', sans-serif;}
div.passCon div.txt span {display: block;font-family: 'NotoSansKR Bold', sans-serif;}


/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.section02 > div {padding: 18px 0;font-size: 16px;line-height: 25px;}

div.passCon {padding: 30px 0;}
div.passCon div.tit {padding-bottom: 10px;font-size: 17px;line-height: 25px;}
div.passCon div.txt {font-size: 14px;line-height: 20px;}
div.passCon div.txt span {font-size: 17px;line-height: 25px;}

div.passCon div.auth img {display: block;height: 60px;margin: 0 auto;}

div.passCon div.example img {display: block;width: 315px;margin: -20px auto 0;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.section02 > div {padding: 60px 0;font-size: 43px;line-height: 65px;}

div.passCon {display: table-cell;width: 2000px;height: 800px;vertical-align: middle;}
div.passCon div.tit,
div.passCon div.txt {display: inline-block;width: 1020px;box-sizing:border-box;}

div.passCon div.tit {padding-bottom: 20px;font-size: 45px;line-height: 50px;}
div.passCon div.txt {font-size: 35px;line-height: 40px;}
div.passCon div.txt span {font-size: 40px;line-height: 45px;}
div.passCon div.example {position: absolute;left: 50%;top: -30px;padding: 0 !important;}

div.passCon.left > div {padding-left: 426px;}
div.passCon.left div.example {margin-left:-625px;}

div.passCon.right > div {padding-right: 426px;}
}


div.section05 {}

/* 인증서 스텝 */
div.changeImg:before,
div.changeImg:after {display: block;content: "";opacity: 0;transition:opacity 1s;background-position: center top;background-repeat: no-repeat;}

div.changeImg.fade-in-up:before {opacity: 1;transition-delay:3s;background-image: url('../image/example_03_2.png');}
div.changeImg.fade-in-up:after {opacity: 1;transition-delay:4s;background-image: url('../image/example_03_3.png');}
/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.changeImg {position: relative;}

div.changeImg:before,
div.changeImg:after,
div.changeImg img {display: block;height: 428px;margin: -20px auto 0;}

div.changeImg.fade-in-up:before,
div.changeImg.fade-in-up:after {position: absolute;left:0;top: 0;width: 100%;background-size: auto 428px;margin-top: 0;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.changeImg {display: block;width: 631px;height: 860px;}

div.changeImg:before,
div.changeImg:after,
div.changeImg img {position: absolute;right: 60px;top: 0;}

div.changeImg:before,
div.changeImg:after {z-index: 10;width: 632px;height: 860px;}
}



div.section06 {}
/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.section06 .example img.qrcode {position: absolute;left: 50%;bottom: 165px;width: 90px;margin-left:100px;opacity: 0;transition:opacity 1s, margin-left 2s;transition-delay: 2.5s;}
div.section06 .example.fade-in-up img.qrcode {opacity: 1;margin-left:-45px;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.section06 {}
div.section06 .example img.qrcode {position: absolute;left: 600px;bottom: 320px;opacity: 0;transition:opacity 1s, left 1s;transition-delay: 2s;}
div.section06 .example.fade-in-up img.qrcode {opacity: 1;left: 202px;}
}


/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.section08 div.example img {width: 150px;margin: 10px auto 0;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.section08 div.example {top: 35px !important;width: 500px;margin-left: 0 !important;}
div.section08 div.example img {display: block;margin-top: 10px;}
}


/* 서브 레이아웃 */
.pageTit {margin: 0;padding: 0;font-weight: normal;color: #212121;font-family: 'NotoSansKR Medium', sans-serif;}

.toggleCon {display: none;}

ul.noBl, ul.noBl > li {margin: 0;padding: 0;list-style:none;}

/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
.pageTit {padding: 0 20px;font-size: 16px;line-height: 30px;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div#container {padding-bottom: 100px;}
.pageTit {width: 950px;margin: 0 auto;font-size: 30px;line-height: 100px;font-family: 'NotoSansKR Bold', sans-serif;}
}





/* 공지사항 */
div.bbs {}

ul.bbsTit, ul.bbsTit li,
div.bbs, div.bbs > div, div.bbs .trigger a {margin: 0;padding: 0;list-style:none;text-decoration: none;}

ul.bbsTit {position: relative;border-bottom: 1px solid #e1e1e1;}

ul.bbsTit li {text-align: center;	color: #999;font-family: 'NotoSansKR Medium', sans-serif;}
ul.bbsTit li:first-child, ul.bbsTit li:last-child,
div.bbs .trigger a:before, div.bbs .trigger span.info {position: absolute;top: 50%;transform:translateY(-50%);}
ul.bbsTit li:first-child,
div.bbs .trigger a:before {left: 0;}
ul.bbsTit li:last-child,
div.bbs .trigger span.info {right: 0;}

div.bbs {border-bottom: 1px solid #c2c2c2;}
div.bbs .trigger a {position: relative;display: block;font-family: 'NotoSansKR Medium', sans-serif;}
div.bbs .trigger span {display: block;}
div.bbs .trigger a:before, 
div.bbs .trigger span.info {color: #999;text-align: center;}
div.bbs .trigger a:before {content: attr(pub-num);}
div.bbs .trigger span.tit {color: #212121;}

div.bbs div.toggleCon {border-top: 1px solid #c2c2c2;background-color: #f2f2f2;color: #212121;font-family: 'NotoSansKR Regular', sans-serif;}

/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.bbs {padding: 0 20px 20px;}

ul.bbsTit,
div.bbs .trigger a {padding: 0 100px 0 50px;}

ul.bbsTit li,
div.bbs .trigger a {font-size: 14px;line-height: 40px;}

ul.bbsTit li:first-child,
div.bbs .trigger a:before {left: 0;width: 50px;}

ul.bbsTit li:last-child, 
div.bbs .trigger span.info {right: 0;width: 100px;}

div.bbs .trigger span.tit {padding: 10px 0;line-height: 20px;}

div.bbs div.toggleCon {padding: 15px 20px;font-size: 14px;line-height: 25px;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.bbs {width: 950px;margin: 0 auto;}

ul.bbsTit,
div.bbs .trigger a {padding: 0 140px 0 90px;}

ul.bbsTit li {font-size: 18px;line-height: 60px;}

ul.bbsTit li:first-child,
div.bbs .trigger a:before {left: 0;width: 90px;}
ul.bbsTit li:last-child, 
div.bbs .trigger span.info {right: 0;width: 140px;}

div.bbs .trigger a {font-size: 22px;line-height: 75px;}
div.bbs .trigger span.tit {padding: 20px 0;line-height: 35px;}
div.bbs .trigger.view span.tit {font-family: 'NotoSansKR Bold', sans-serif;}

div.bbs div.toggleCon {padding: 20px 20px 20px 90px;font-size: 22px;line-height: 35px;}
}



/* 이용약관 */
div.agreement {}

div.version, div.version dt, div.version dd, div.version ul, div.version li, div.version a {margin: 0;padding: 0;list-style:none;text-decoration: none;}
div.version {z-index: 50;position: relative;border: 1px solid #c2c2c2;}
div.version a {display: block;color: #666;font-family: 'NotoSansKR Regular', sans-serif;}

div.version .trigger a {display: block;position: relative;}
div.version .trigger a:after {position: absolute;top: 0;height: 100%;content: "";background: url('../image/toggle.png') center center no-repeat;}
div.version .trigger.view a:after {transform:rotate(180deg);}

div.version div.toggleCon {position: absolute;left: -1px;width: 100%;border: 1px solid #c2c2c2;background-color: #fff;}
div.version div.toggleCon a {text-align: center;}


/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.agreement {padding: 10px 20px 20px;}

div.agreement .pageTit {padding: 0 0 10px;}

div.version a {font-size: 12px;line-height: 20px;}
div.version .trigger a {padding: 10px 40px 10px 10px;}
div.version .trigger a:after {right: 10px;width: 20px;background-size: 13px;}

div.version div.toggleCon {padding-bottom: 15px;}
div.version li {padding-top: 15px;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.agreement {width: 1020px;margin: 0 auto;padding-bottom: 100px;}

div.agreement .pageTit {width: auto;}

div.version {display: inline-block;vertical-align: top;}
div.version a {font-size: 20px;line-height: 35px;}
div.version .trigger a {padding: 15px 70px 15px 20px;}
div.version .trigger a:after {right: 15px;width: 26px;}

div.version div.toggleCon {padding-bottom: 25px;}
div.version li {padding-top: 25px;}
}



div.rule {border-top: 1px solid #c2c2c2;}
div.rule h4,
dl.rule, dl.rule dl, dl.rule dt, dl.rule dd, 
dl.rule p, dl.rule a {font-weight: normal;margin: 0;padding: 0;list-style:none;text-decoration: none;}

dl.rule,
dl.rule a {color: #666;font-family: 'NotoSansKR Regular', sans-serif;}

div.rule h4:first-child,
dl.rule > dd > *:first-child,
dl.rule ul.noBl > li:first-child {margin-top: 0;}

dl.rule ul.noBl > li {margin-top: 5px;}

/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
div.rule {margin-top: 15px;padding-top: 15px;font-size: 12px;line-height: 25px;}
div.rule span {font-size: 12px;}
div.rule table {font-size: 12px;}
div.rule details {font-size: 12px;}

div.rule h4 {margin-top: 30px;}

dl.rule > dt {margin-top: 20px;}
dl.rule > dd > * {margin-top: 10px;}
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
div.rule {margin-top: 30px;padding-top: 35px;font-size: 20px;line-height: 30px;}
div.rule span {font-size: 14px;}
div.rule table {font-size: 14px;}
div.rule details {font-size: 14px;}

div.rule h4 {margin-top: 60px;}

dl.rule > dt {margin-top: 40px;}
dl.rule > dd > * {margin-top: 20px;}
}



/*  Mobile : ~ width:950px  */
@media (max-width: 950px) {
}

/*  PC : width:951px ~  */
@media (min-width: 951px) {
}

