@charset "utf-8";

/* common */
#cu-wrap {
    position:relative; width:100%; min-width:1024px; height:100%; min-height:100vh;
}

/* top button */
.cu-btn-top {
    display:none; position:fixed; width:42px; height:42px; bottom:130px; left:50%; right:auto; margin-left:520px;
}
.cu-btn-top.cu-wide {
    left:50%; right:auto; margin-left:720px;
}
.cu-btn-top.cu-display {
    display:block;
}
.cu-btn-top a {
    display:block; position:relative; width:100%; height:100%; border:1px solid #ddd; background-color:#f8f8f8; border-radius:50%;
}
.cu-btn-top a::before {
    content:""; display:block; position:absolute; width:30%; height:30%; top:40%; left:32%; border-left:2px solid #999; border-top:2px solid #999; transform:rotate(45deg);
}
@media screen and (max-width:1600px) {
    .cu-btn-top.cu-wide {
        left:auto; right:10px; margin-left:0px; background-color:rgba(248,248,248,0.5);
    }
    .cu-btn-top.cu-wide a {
        background-color:rgba(248,248,248,0.5);
    }
}
@media screen and (max-width:1050px) {
    .cu-btn-top {
        left:auto; right:10px; margin-left:0px; background-color:rgba(248,248,248,0.5);
    }
    .cu-btn-top a {
        background-color:rgba(248,248,248,0.5);
    }
}

/* header */
#cu-header {
    position:fixed; width:100%; height:60px; top:0px; left:0px; border-bottom:1px solid #eee; background-color:#fff; z-index:9999;
}
#cu-header .cu-inner {
    position:relative; width:100%; max-width:1440px; min-width:980px; min-width:1000px; height:100%; padding:0px 12px; margin:auto;
}
#cu-header .cu-inner::after {
    content:""; display:table; clear:both;
}
#cu-header .cu-inner .cu-logo {
    float:left; position:relative; width:160px; height:100%;
}
#cu-header .cu-inner .cu-logo .cu-link-home {
    display:block; width:100%; height:100%; background:url("../images/logo.png") 0% 50% no-repeat;
}
#cu-header .cu-inner .cu-gnb {
    position:absolute; height:100%; top:0px; left:50%; margin-left:50px; transform:translateX(-50%);
}
#cu-header .cu-inner .cu-gnb .cu-navi {
    display:flex; position:relative; list-style:none; height:100%;
}
#cu-header .cu-inner .cu-gnb .cu-navi::after {
    content:""; display:table; clear:both;
}
#cu-header .cu-inner .cu-gnb .cu-navi .cu-menu {
    float:left; position:relative; height:100%;
}
#cu-header .cu-inner .cu-gnb .cu-navi .cu-menu a {
    display:block; height:100%; font-size:14px; line-height:1.5em; color:#555; font-weight:400; padding:0px 15px; white-space:nowrap; transition:all 0.3s ease-in-out;
}
#cu-header .cu-inner .cu-gnb .cu-navi .cu-menu a:hover {
    color:#0082dd;
}
#cu-header .cu-inner .cu-gnb .cu-navi .cu-menu.cu-current a {
    color:#0082dd;
}
#cu-header .cu-inner .cu-gnb .cu-navi .cu-menu a span {
    display:block; padding-top:20px;
}
#cu-header .cu-inner .cu-login {
    display:none; float:right; position:relative; height:100%;
}
#cu-header .cu-inner .cu-login.cu-display {
    display:block;
}
#cu-header .cu-inner .cu-login .cu-link-login {
    display:block; position:relative; height:100%; font-size:13px; line-height:1.5em; color:#555; font-weight:400; padding-top:20px; transition:all 0.3s ease-in-out;
}
#cu-header .cu-inner .cu-login .cu-link-login:hover {
    color:#2fa2f2;
}
#cu-header .cu-inner .cu-login .cu-link-login::before {
    content:""; display:inline-block; width:18px; height:16px; vertical-align:middle; margin-right:2px; background:url("../images/icon-account1-n.png") 50% 50% no-repeat;
}
#cu-header .cu-inner .cu-login .cu-link-login:hover::before {
    background:url("../images/icon-account1-o.png") 50% 50% no-repeat;
}
#cu-header .cu-inner .cu-account {
    display:none; float:right; position:relative; height:100%; padding-top:14px;
}
#cu-header .cu-inner .cu-account.cu-display {
    display:block;
}
#cu-header .cu-inner .cu-account .cu-navi {
    position:relative;
}
#cu-header .cu-inner .cu-account .cu-navi:hover {
    padding:0px 0px 10px 5px;
}
#cu-header .cu-inner .cu-account .cu-navi .cu-icon {
    position:relative; width:32px; height:32px; border-radius:50%; background:#eee url("../images/icon-account2-n.png") 50% 50% no-repeat; transition:all 0.3s ease-in-out;
}
#cu-header .cu-inner .cu-account .cu-navi .cu-icon:hover {
    background:#e0e0e0 url("../images/icon-account2-o.png") 50% 50% no-repeat;
}
#cu-header .cu-inner .cu-account .cu-navi .cu-layerPanel {
    display:none; position:absolute; width:110px; top:35px; right:0px; padding:10px 0px; border:1px solid #ddd; background-color:#fff;
}
#cu-header .cu-inner .cu-account .cu-navi .cu-layerPanel a {
    display:block; width:100%; font-size:13px; line-height:1.5em; color:#555; font-weight:400; padding:2px 0px 2px 15px;
}
#cu-header .cu-inner .cu-account .cu-navi .cu-layerPanel a:hover {
    color:#333; text-decoration:underline;
}
#cu-header .cu-inner .cu-account .cu-navi:hover .cu-layerPanel {
    display:block;
}

/* content */
#cu-main {
    position:relative; padding:60px 0px 90px 0px;
}
#cu-main::after {
    content:""; display:table; clear:both;
}
#cu-content {
    position:relative;
}
#cu-content.cu-sub {
    width:1000px; padding:40px 12px; margin:auto;
}
#cu-content.cu-sub.cu-wide {
    width:100%; max-width:1440px; min-width:1000px;
}

#cu-subTitle {
    display:flex; position:relative; width:100%; height:70px; justify-content:center; align-items:center; background-color:#6f8ead; background-size:cover;
}
#cu-subTitle .cu-title {
    position:relative; font-size:26px; line-height:1.5em; color:#fff; font-weight:500;
}
.cu-useGuide #cu-subTitle {
    background:url("../images/sub-visual-01.png") 50% 50% no-repeat; background-size:cover;
}
.cu-apiGuide #cu-subTitle {
    background:url("../images/sub-visual-02.png") 50% 50% no-repeat; background-size:cover;
}
.cu-serviceapi #cu-subTitle {
    background:url("../images/sub-visual-03.png") 50% 50% no-repeat; background-size:cover;
}
.cu-faq #cu-subTitle {
    background:url("../images/sub-visual-04.png") 50% 50% no-repeat; background-size:cover;
}
.cu-notice #cu-subTitle {
    background:url("../images/sub-visual-05.png") 50% 50% no-repeat; background-size:cover;
}
.cu-qna #cu-subTitle {
    background:url("../images/sub-visual-06.png") 50% 50% no-repeat; background-size:cover;
}
.cu-account #cu-subTitle {
    background:url("../images/sub-visual-08.png") 50% 50% no-repeat; background-size:cover;
}
.cu-terms #cu-subTitle {
    background:url("../images/sub-visual-08.png") 50% 50% no-repeat; background-size:cover;
}
.cu-privacy #cu-subTitle {
    background:url("../images/sub-visual-08.png") 50% 50% no-repeat; background-size:cover;
}

/* footer */
#cu-footer {
    position:absolute; width:100%; height:90px; bottom:0px; left:0px; background-color:#3c4146;
}
#cu-footer .cu-inner {
    position:relative; width:100%; max-width:1440px; min-width:1000px; height:100%; padding:0px 12px; margin:auto;
}
#cu-footer .cu-inner::after {
    content:""; display:table; clear:both;
}
#cu-footer .cu-inner .cu-copyright {
    float:left; position:relative; height:100%; font-size:12px; line-height:1.5em; color:#ccc; font-weight:300; padding-top:25px;
}
#cu-footer .cu-inner .cu-navi-ect {
    float:right; height:100%; list-style:none; padding-top:25px;
}
#cu-footer .cu-inner .cu-navi-ect li {
    float:left;
}
#cu-footer .cu-inner .cu-navi-ect a {
    font-size:13px; line-height:1.5em; color:#ccc; font-weight:300; transition:all 0.3s ease-in-out;
}
#cu-footer .cu-inner .cu-navi-ect a:hover {
    color:#fff;
}
#cu-footer .cu-inner .cu-navi-ect a::before {
    content:"/"; display:inline-block; font-size:12px; color:#999; font-weight:300; vertical-align:baseline; padding:0px 15px;
}
#cu-footer .cu-inner .cu-navi-ect li:first-child a::before {
    content:""; display:none;
}


/* popup */
#cu-popup-wrap {
    position:relative; width:100%; height:100vh; padding-top:50px; background-color:#fff;
}
#cu-popup-wrap .cu-header {
    display:flex; position:fixed; width:100%; height:50px; top:0px; left:0px; align-items:center; justify-content:flex-start; padding:0px 20px; background-color:#2e88d5; z-index:10;
}
#cu-popup-wrap .cu-header .cu-title {
    position:relative; font-size:18px; line-height:1.5em; color:#fff; font-weight:400;
}
#cu-popup-wrap .cu-header .cu-btn-close {
    display:block; position:absolute; top:50%; right:20px; width:24px; height:24px; transform:translateY(-50%); opacity:0.7; transition:all 0.3s ease-in-out;
}
#cu-popup-wrap .cu-header .cu-btn-close::before {
    content:""; display:block; position:absolute; top:50%; left:0px; width:100%; height:1px; background-color:#fff; transform:rotate(45deg);
}
#cu-popup-wrap .cu-header .cu-btn-close::after {
    content:""; display:block; position:absolute; top:50%; left:0px; width:100%; height:1px; background-color:#fff; transform:rotate(-45deg);
}
#cu-popup-wrap .cu-header .cu-btn-close:hover {
    opacity:1;
}
#cu-popup-wrap .cu-content {
    position:relative; padding:20px;
}
