@charset 'utf-8';

/* Common */
.layout {width:98%;margin:0 auto;position:relative}
.wrap {padding:100px 0}

.title-wrap {text-align:center;}
h3 {font-weight: 300;font-size: 2.5rem;line-height: 1.25;margin-bottom:2.188rem}
.text-style {font-size:1rem;color:#909090;font-weight:normal}
.security-text-style {font-size:16px;text-align:center;color:#f37022;padding:8px 0 0 0}
.security-qa-style {font-size:15px;line-height: 1.6;color:#f37022;}

.font-brown {color: #fff}
.font-black {color: #434446}
.fb {font-weight:bold}

.flex-box {display:-webkit-flex;display:flex;justify-content: center;align-items: center;}
    /* Common 미디어쿼리 */
    @media all and (max-width:1000px) {
        .layout {width:92.188%}
    }
    @media all and (max-width:640px) {
        .layout {width:93%}
        .wrap {padding:3.125rem 0}

        h3 {font-size:1.5rem;margin-bottom: 1.688rem}
        .text-style {width:80%;font-size:12px;margin:0 auto}
        .text-style strong {font-size: inherit;}
        .security-text-style {width:80%;font-size:12px;margin:0 auto}
        .security-text-style strong {font-size: inherit;}
    }

/* Header */
header {height:153px;text-align:center;}
header h1 {margin:1.875rem 0}
header h1 img {width:75px}

/* Menu */
nav {display:-webkit-flex;display:flex;justify-content: center}
nav ul {display:-webkit-flex;display:flex;justify-content: center;flex-wrap: nowrap;align-items: center;}
nav li {margin:0 2.188rem}
nav li a {font-size:0.875rem;color: #434446;font-weight: bold;}
.login-btn {width: 120px;height: 34px;color: #f37022;font-weight: bold;border-radius: 17px;background-color: #fcdbc8;}
    /* Menu 미디어쿼리 */
    @media all and (max-width:640px) {
        header {height:101px;display:none}
        nav {display:none}
        .header h1 {margin:30px 0 0 0}
        .header h1 img {width:75px}
        .header .login-btn {font-size:14px}
    }

/* Visual */
.visual {width:100%;background:center / cover url("/static/images/main-bg-e80553067e1455e634b40d1d08984b6c.png") no-repeat;height:758px;}
.visual .layout {height:100%;display:-webkit-flex;display:flex;justify-content: center;align-items: center;}
.visual .img-area {width:276px}
.visual .img-area img {width:114%}
.visual .txt-wrap {margin-right:9.42%}
.visual .txt-wrap h2 {color:#434446;font-size: 2.25rem;font-weight: bold;line-height: 1.39;}
.visual .txt-wrap p {margin-top: 13px;opacity: 0.9;color:#434446;}
.visual .btn-area {margin-top:5rem}
.visual .btn-area a {float:left;width:187px}
.visual .btn-area a img {width:100%}
.visual .btn-area a:first-child {margin-right:10px}
    /* Visual 미디어쿼리 */
    @media all and (max-width:1000px) {
        .visual .txt-wrap {margin-right:2.42%}
    }
    @media all and (max-width:715px) {
        .visual .btn-area a:first-of-type {margin-bottom:10px}
    }
    @media all and (max-width:640px) {
        .visual {height:549px;margin-top:101px}
        .visual .layout {flex-wrap: wrap;}
        .visual .txt-wrap {width:100%;margin-right:0%}
        .visual .txt-wrap h2 {font-size:1.5rem;line-height: 1.36}
        .visual .txt-wrap p {font-size:12px;}
        .visual .btn-area {display:none}
        .visual .img-area {width:100%; text-align:center}
        .visual .img-area img {width:180px}
    }

.skypeople {text-align:center; background-color:#f7f7f7; padding:50px 50px 50px 50px}
.skypeople .layout {display:-webkit-flex; display:flex; justify-content:center; align-items:center}
.skypeople .img-area {width:383px}
.skypeople .img-area img {width:100%}
.skypeople .img-area a {cursor:pointer}
	@media all and (max-width:767px) {
    	.skypeople {padding:0 2px 50px 2px}
    }
.section0 {text-align:center; background-color:#000518;}
.section0 .layout {display:-webkit-flex; display:flex; justify-content:center; align-items:center}
.section0 .img-area {width:700px}
.section0 .img-area img {width:100%}
	@media all and (max-width:360px) {
        .section0 .layout {flex-wrap: wrap}
        .section0 .img-area {width:100%; text-align:center}
        .section0 .img-area img {width:163px}
    }

/* Section1 */
.section1 {background-color:#f7f7f7; padding:100px 0 0 0}
.section1 .layout {max-width:942px}
.section1 .font-black{font-size: inherit;font-weight:inherit;}
.section1 .con-wrap {margin-top:4.375rem;justify-content: space-between;}
.section1 .con-wrap .list {border: solid 1px #cbb9ac; background-color: rgba(238, 229, 221, 0.2);position:relative;padding:1.5rem;height:315px;width:234px}
.section1 .con-wrap .list .icon {width:90px;position:absolute;right:1.5rem;bottom:1.5rem}
.section1 .con-wrap .list .icon img {width:100%}
.section1 .con-wrap h4 {font-size: 1.625rem;line-height: 1.15;color: #434446;font-weight:300;margin-bottom:10px}
.section1 .con-wrap h4 strong {font-size:inherit;font-weight:bold}
.section1 .con-wrap h4 span {font-size: inherit;font-weight: inherit;}
.section1 .con-wrap p {font-size:0.75rem;}
    /* Section1 미디어쿼리 */
    @media all and (max-width:1000px) {
    	.section1 {padding:3.125rem 0}
        .section1 .con-wrap .list {width:31.5%}
        .section1 .con-wrap h4 {font-size: 1.563rem;}
    }
    @media all and (max-width:640px) {
        .section1 .con-wrap {margin-top:2.188rem;flex-wrap: wrap;}
        .section1 .con-wrap .list {padding:1.5rem;height:132px;width:100%;margin-bottom:1.25rem}
        .section1 .con-wrap .list:last-of-type {margin-bottom:0}
        .section1 .con-wrap h4 br,
        .section1 .con-wrap h4 span {display:none}
        .section1 .con-wrap h4 {font-size: 1.375rem;margin-bottom: 5px;}
        .section1 .con-wrap .list .icon {bottom:1.2rem}
    }

/* Section2 */
.section2,
.section4 {background:#2a2a3e}
.section2 .layout {max-width:942px}
.section2 .flex-box {justify-content: space-between;flex-wrap: wrap;}
.section2 .list {margin-bottom:3.125rem}
.section2 .title-wrap {width:65%;height:270px;background-color:#F4ECE1;text-align:center;padding:1.875rem;position:relative}
.section2 .title-wrap .xyalign {width:100%}
.section2 .title-wrap * {color:#434446;}
.section2 .con-wrap-list {width:30%;background:#fff;padding:1.875rem;height:270px}
.section2 .con-wrap-list h4 {color:#f37022;font-size:1.5rem;font-weight: 300;position:relative;padding-bottom:1.875rem;margin-bottom:1.25rem}
.section2 .con-wrap-list h4 strong {font-size:inherit;color:inherit;font-weight:300}
.section2 .con-wrap-list h4::after {content:"";width:20px;height:3px;display:block;position:absolute;bottom:0;left:0;background-color: #f37022;}
.section2 .con-wrap-list dl {width:100%;display:inline-block}
.section2 .con-wrap-list dt {font-size:0.875rem}
.section2 .con-wrap-list dd {font-size: 0.75rem;line-height: 1.5;color: #909090;margin-bottom:1.563rem}
.section2 .con-wrap-list dd:last-of-type {margin-bottom:0}
    /* Section2 미디어쿼리 */
    @media all and (max-width:1000px) {
        .section2 .layout {max-width:595px}
        .section2 .title-wrap {width:100%}
        .section2 .list:last-of-type {margin-bottom:0rem}
        .section2 .con-wrap-list {width:47.04%;max-width:275px}
    }
    @media all and (max-width:640px) {
        .section2 .title-wrap {height:134px;margin-bottom:1.875rem}
        .section2 .title-wrap h3 {font-size:1.625rem;line-height: 1.92;margin-bottom: 0;}
        .section2 .con-wrap-list {width:48%;padding:1.125rem;height:167px;margin-bottom:0.9375rem}
        .section2 .con-wrap-list h4 {font-size:13px;padding-bottom:0.875rem;margin-bottom:12px}
        .section2 .con-wrap-list h4 strong {font-weight:bold}
        .section2 .con-wrap-list dt {font-size:12px}
        .section2 .con-wrap-list dd {font-size:11px;line-height: 1.35;margin-bottom:9px}

    }

/* Section3 */
.section3 .title-wrap {padding-bottom: 8.75rem}
.section3 .title-wrap h3 br {display:none}
.section3 .tab {position:absolute;top:170px;left:0;right:0;margin:0 auto}
.section3 .tab li {margin:0 1.875rem;cursor:pointer; font-size: 1.375rem;line-height: 2.27;-webkit-transition: .3s ease-in-out; transition: .3s ease-in-out;font-weight: 300;}
.section3 .tab li:hover,
.section3 .tab li.on {font-weight: bold;color: #f37022;}
.section3 .tab li.on::after {content:"";width:100%;height:3px;background:#f37022;display:block;border-radius: 100px;}
.section3 .tab_con {clear:both}
.section3 .tab_con .con {display:none;text-align:center}
.section3 .tab_con span {width:325px;display:block;text-align:center;margin:0 auto}
.section3 .tab_con span img {width:100%}
    /* Section3 미디어쿼리 */
    @media all and (max-width:757px) {
        .section3 .tab {top:220px}
    }
    @media all and (max-width:640px) {
        .section3 .title-wrap {height:234px;padding-bottom:5.813rem}
        .section3 .title-wrap h3 br {display:block}
        .section3 .tab {top:160px}
        .section3 .tab li {margin:0  0.625rem;font-size: 14px;}
        .section3 .tab_con .con img {width:192px;}

    }

/* Section4 */
.section4 .con-wrap {margin-top:3.75rem}
.section4 .layout {max-width:782px}
.section4 dl dt {position:relative;line-height: 1.63;font-weight:bold;padding-left:1.563rem;margin-bottom:12px;color:#fff;}
.section4 dl dt::before {content:"Q.";position:absolute;color:#f37022;font-weight: bold;font-size:1.125rem;left:0;top:-2px}
.section4 dl dd {font-size:0.9375rem; line-height:1.6; border-bottom:solid 1px rgba(194,194,194,0.5); padding-bottom:1.25rem; margin-bottom:1.25rem; color:#d4d4d4;}
.section4 dl dd:last-of-type {margin-bottom:0}
    /* Section4 미디어쿼리 */
    @media all and (max-width:640px) {
        .section4 .con-wrap {margin-top:2.625rem}
        .section4 dl dt {padding-left:1.263rem;line-height:1.56rem;margin-bottom:10px}
        .section4 dl dt,
        .section4 dl dt::before,
        .section4 dl dd {font-size:0.875rem}
        .section4 dl dt::before {top:-1px}
        .section4 dl dd {padding-bottom:0.75rem;margin-bottom:0.75rem}
    }

/*  약관 */
.policy .title {height:179px;background:#f7f7f7;display: flex;justify-content: center;align-items: center;}
.policy .con-wrap {padding:5.625rem 0}
.policy .sp2 {margin-top:5.625rem}
.policy .layout {max-width:942px}
.policy h1 {font-size: 2.5rem;text-align:center;color:#454c54;font-weight:bold}
.policy h2 {font-weight:bold;font-size: 1.5rem;margin-bottom:1.25rem;color:#454c54}
.policy h3 {font-size:1.25rem;font-weight:700;margin:3.125rem 0 1.25rem}
.policy h3:first-of-type {margin-top:4.563rem}
.privacy br {display:none}
.privacy ol,
.privacy ul,
.privacy p,
.policy .ml {padding-left:24px}
.policy p,
.policy th,
.policy td,
.policy li,
.policy a,
.policy dt,
.policy dd {line-height:normal;font-size:1.125rem;color:#454c54}
.policy li > ul,
.policy li > ol {margin-bottom:1rem}
.policy ol > li,
.policy ul > li {position:relative;margin-bottom:1.875rem}
.policy li > ul,
.policy li > ol {padding-left:1.25rem;margin-top:1.375rem}
.policy li > ul.line-list {margin-top:0}
.policy li > ul.line-list li {margin-bottom:0}
.policy .font-color li {color:#909090;margin-bottom:23px}
.policy .font-color p {color:#909090}
.policy .sp {margin-top:1.875rem !important}
.policy .mb0-list {margin-top:0; margin-bottom:0;padding-left:0}
.policy .mb0-list li,
.policy .mb0-list2 li {margin-bottom:0 !important}
.policy strong {font-weight:bold}

    /* 약관 미디어쿼리 */
    @media all and (max-width:640px) {
        .policy .title {height:130px}
        .policy .con-wrap {padding:3.125rem 0}
        .privacy br {display:block}
        .policy .sp2 {margin-top:3.125rem}
        .policy h3:first-of-type {margin-top:2.188rem}
        .policy .sp {margin-top:1.25rem !important}
        .policy h1 {font-size:1.375rem}
        .policy h2 {font-size:1.25rem;margin-bottom: 25px;}
        .policy h3 {font-size:1.125rem;margin:1.875rem 0 1.125rem}
        .privacy ol,
        .privacy ul,
        .privacy p,
        .policy .ml {padding-left:0.9375rem}
        .policy li > ul,
        .policy li > ol {padding-left:0.9375rem}
        .policy ol > li,
        .policy ul > li {margin-bottom:1.125rem}
        .policy .font-color li {margin-bottom:13px}
        .policy p,
        .policy th,
        .policy td,
        .policy li,
        .policy a,
        .policy dt,
        .policy dd {font-size:14px;}
        .policy a {font-size:12px}
        .policy .table th,
        .policy .table td {padding:0.3rem 0.3rem;}
    }

/* Footer */
footer {padding:4.375rem 0;background:#f9f9f9}
footer .layout {max-width:940px}
footer .footer-info {position:relative;border-bottom:1px solid #e8e8e8;padding-bottom:1.5rem;margin-bottom:1.5rem}
footer .company-area li,
footer .company-area li em,
footer .company-area li a,
footer .footer-policy li a {font-size:13px;color:#808080; line-height: 1.85;}
footer .company-area li:first-child {font-weight:bold}
footer .company-area li:last-child br {display:none;}
footer .dowload-area {position:absolute;right:0;top:0}
footer .dowload-area a {float:left;margin:0 10px;width:187px;}
footer .dowload-area a img {width:100%}
footer .footer-policy {display:-webkit-flex;display:flex;flex-wrap: nowrap;}
footer .footer-policy li a {font-weight:bold;}
footer .footer-policy li:first-child {margin-right:15px;padding-right:15px;position:relative;}
footer .footer-policy li:first-child::after {content:"";width:1px;height:10px;background-color:#a8a8a8;display:block;position:absolute;right:0;top:7px}
.app-download {display:none}
    /* Footer 미디어쿼리 */
    @media all and (max-width:1000px) {
        footer {padding:1.875rem 0}
        footer .footer-info li:last-child br {display:block;}
        footer .footer-info {padding-bottom:0.75rem;margin-bottom:0.75rem}
        footer .company-area li em {display:none;}
    }
    @media all and (max-width:640px) {
        footer {margin-bottom:64px}
        footer .company-area li em,
        footer .dowload-area {display:none;}
        .app-download {width:100%;height:64px;display:flex;justify-content: center;text-align:center;color:#f37022;align-items: center;position:fixed;bottom:0;background:#fff;}
        .app-download a {color:#f37022;font-size:1.125rem}
    }