@charset "UTF-8";

@import url(notosanskr.css);

@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
	font-weight: 100;
    src: url('font/NotoSans-Thin.woff2') format('woff2'),
		 url('font/NotoSans-Thin.woff') format('woff');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
	font-weight: 300;
    src: url('font/NotoSans-Light.woff2') format('woff2'),
		 url('font/NotoSans-Light.woff') format('woff');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
	font-weight: 400;
    src:url('font/NotoSans-Regular.woff2') format('woff2'),
		url('font/NotoSans-Regular.woff') format('woff');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
	font-weight: 500;
    src: url('font/NotoSans-Medium.woff2') format('woff2'),
		 url('font/NotoSans-Medium.woff') format('woff');
}
@font-face {
    font-family: 'Noto Sans KR';
    font-style: normal;
	font-weight: 700;
    src: url('font/NotoSans-Bold.woff2') format('woff2'),
		 url('font/NotoSans-Bold.woff') format('woff');
}

:root {
	--bs-font-sans-serif: 'Noto Sans KR';
	--bs-gray: #999;
	--bs-body-font-size: 14px;
	--bs-body-color: #555;
	--bs-body-bg: #f7f8fc;
}

a {color:#555; text-decoration: none;}

.btn-hover-shadow:hover {box-shadow: 0 0 10px rgba(0,0,0,.2); }

html,body {width:100%; height:100%;margin:0; padding:0; color:#555;}



.form-control, .form-select {border-color: #dee2e6;}
input::placeholder {
  color: #aaa !important;
}

.bootbox {text-align: right;}
.bootbox-close-button {border:none; background-color: #fff;margin-bottom:20px;}
.bootbox-body {text-align: left;}
.bootbox-accept {background-color: #1d3661;}
.bootbox-accept:hover,
.bootbox-accept:focus {background-color: #305697;}


#site-body {width:100%; display: flex; align-items: center; flex-direction: column; min-height: calc(100% - 320px); padding-top:114px; box-sizing:border-box;}
/*
#site-body header {width:100%; text-align:right;}
#site-body header a.badge:hover {color:#ddd;box-shadow: 0 0 10px rgba(0,0,0,.2);}
 */
#site-body .site-main {width:100%; max-width:400px; margin:auto;}
#site-body .site-main .main-logo {text-align: center; margin-bottom:40px;}
#site-body .site-main .main-dc {text-align: center; margin-bottom: 60px;}

/*.site-footer {width:100%;text-align: center; height: 84px; line-height: 78px;}*/

/* foxsite commmon : footer */
/*:root {
    --footer-color-bk: #333;
    --footer-color-gr: #777;
    --footer-color-gr100: #eee;
    --footer-color-gr50: #F8F8F8;
}

.foxsite-footer {
    font-family: 'Noto Sans KR', "맑은 고딕", "Malgun Gothic", "Apple Gothic", "돋움", Dotum, "굴림", Gulim, sans-serif;
    border-top: 1px solid var(--footer-color-gr100);
    font-size: 14px;
    color: var(--footer-color-gr);
    word-break: keep-all;
}

.foxsite-footer .wrap {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    max-width: 1200px;
    width: 100%;
    box-sizing: border-box;
    min-height: 0;
    padding: 0;
}

.foxsite-footer a {
    text-decoration: none;
    color: var(--footer-color-gr);
}

.foxsite-footer a:hover {
    text-decoration: underline;
}

.foxsite-footer p,
.foxsite-footer dl,
.foxsite-footer dt,
.foxsite-footer dd,
.foxsite-footer ul,
.foxsite-footer ol,
.foxsite-footer li,
.foxsite-footer figure,
.foxsite-footer figcaption,
.foxsite-footer form {
    margin: 0;
    padding: 0;
}

.foxsite-footer cite,
.foxsite-footer em,
.foxsite-footer address {
    font-style: normal;
}

.foxsite-footer .foxsite-footer-top {
    position: relative;
    height: 50px;
}

.foxsite-footer .foxsite-footer-site {
    position: absolute;
    top: 0;
    right: 0;
}

.foxsite-footer .foxsite-footer-site select {
    box-sizing: border-box;
    height: 50px;
    padding: 0 40px 0 10px;
    vertical-align: top;
    appearance: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    background: url('http://down.foxedu.kr/download/foxsite/images/footer/footer-sel-arr.svg') center right no-repeat;
    font-size: 14px;
    height: 50px;
    border: none;
    border-left: 1px solid var(--footer-color-gr100);
    border-right: 1px solid var(--footer-color-gr100);
    color: var(--footer-color-bk);
}

.foxsite-footer .foxsite-footer-menu a {
    line-height: 50px;
    margin-right: 16px;
}

.foxsite-footer .foxsite-footer-menu strong {
    font-weight: 700;
}

.foxsite-footer .foxsite-footer-cont {
    background-color: var(--footer-color-gr50);
    padding: 30px 0;
    font-size: 13px;
}

.foxsite-footer .foxsite-footer-cs {
    float: right;
    max-width: 300px;
}

.foxsite-footer .foxsite-footer-cs cite {
    font-weight: 700;
}

.foxsite-footer .foxsite-footer-cs strong {
    display: flex;
    align-items: center;
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 5px;
}

.foxsite-footer .foxsite-footer-cs strong:before {
    content: " ";
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    background: url('http://down.foxedu.kr/download/foxsite/images/footer/footer-ico-cs.svg') no-repeat;
}
.foxsite-footer .foxsite-footer-info address {
    margin-bottom: 5px;
}

.foxsite-footer .foxsite-footer-info dl {
    margin-bottom: 15px;
}

.foxsite-footer .foxsite-footer-info dl dt {
    font-weight: 700;
}

.foxsite-footer .foxsite-footer-info dl dd {
    margin-left: 0;
    margin-bottom: 5px;
}

.foxsite-footer .foxsite-footer-info address span {
    margin-right: 10px;
    white-space:nowrap;
}
.foxsite-footer .foxsite-footer-info address span:last-child {
    margin-right:0;
}
.foxsite-footer .foxsite-footer-info > p {
    font-size: 12px;
    color: #999;
}

.foxsite-footer .foxsite-footer-logo {
    display: block;
    margin: 30px 0 0;
}

.foxsite-footer .foxsite-footer-logo img {
    display: block;
}*/
/* -------------------------------------------------
	- TABLE MAX-WIDHT 1279
------------------------------------------------- */
@media screen and (max-width:1279px) {
   /* .foxsite-footer .wrap {
        padding-left: 15px;
        padding-right: 15px;
    }*/
}
/* -------------------------------------------------
	- MOBILE MAX-WIDHT 767
------------------------------------------------- */
@media screen and (max-width:767px) {
   /* .foxsite-footer .foxsite-footer-site {
        top: 70px;
        right: auto;
        width: calc(100% - 30px);
    }

    .foxsite-footer .foxsite-footer-site select {
        width: 100%;
        border: 1px solid #ddd;
    }

    .foxsite-footer .foxsite-footer-cont {
        padding-top: 90px;
    }

    .foxsite-footer .foxsite-footer-cs {
        float: none;
        margin-bottom: 20px;
    }

    .foxsite-footer .foxsite-footer-cs strong {
        font-size: 20px;
    }

    .foxsite-footer .foxsite-footer-cs strong img {
        height: 20px;
    }

    .foxsite-footer .foxsite-footer-logo img {
        height: 20px;
    }*/
}


#portal-top .portal-logo{
    box-sizing:content-box;
}

#portal-top .my-btn {position:absolute; top:3px; right:10px; z-index: 1;}
#portal-top .my-btn a { padding: 4px 15px; color:#fff;}
@media (max-width:575px) {
    #portal-top .my-btn {
        position: absolute;
        top: 40px;
        right: 10px;
    }

    #portal-top .my-btn a {
        color: #333;
    }
}
/*
#portal-top {position:relative; background-color: #1D3661; height: 30px;}
#portal-top .portal-nav {border-bottom:none;}
#portal-top .portal-nav figure {margin:0; padding:5px 7px 0;}
#portal-top .portal-nav figure img {vertical-align: top;}
#portal-top .portal-nav .nav-link {color:#fff; font-size:13px; border-radius:0;
    letter-spacing: -0.025em;
    padding: 0 16px 0 17px;
    height:30px; line-height: 30px;
    border:0;
}
#portal-top .portal-nav .nav-link.active {color:#1D3661;}
#portal-top .portal-nav .nav-link:hover,
#portal-top .portal-nav .nav-link:focus {border:0px solid transparent;}
#portal-top .my-btn {position:absolute; top:3px; right:10px; z-index: 1;}
#portal-top .my-btn a { padding: 4px 15px; color:#fff;}
@media (max-width:575px) {
    #portal-top .my-btn {position:absolute; top:40px; right:10px;}
    #portal-top .my-btn a {color:#333;}
}
 */

.foxsite-logo-portal {
  background-image: url('//down.foxedu.kr/download/foxsite/images/logo/logo_foxlc.svg');
}

#site-login {width:100%; height:100%; display: flex; align-items: flex-start ;}
#site-login .login-form { width:100%; max-width: 450px; margin:50px auto; }
#site-login .login-logo {text-align:center; margin-bottom: 40px;}
#site-login .login-dc {text-align: center; margin-bottom:30px;font-size:1.1rem;}
#site-login .login-dc strong {color:#000;}
#site-login .login-form input[type=text],
#site-login .login-form input[type=password] {line-height:35px; margin-bottom:10px;}
#site-login .btn {width:100%;  margin-bottom:10px; line-height:45px; background-position: left 25px center; background-repeat: no-repeat;}
#site-login .login-btn {background: #1d3661; color:white; margin-bottom: 30px;}
#site-login .login-sns {background-color: #efefef;padding:25px 30px; margin-bottom:30px;}
#site-login .login-sns h3 {text-align:center; font-size:18px; font-weight: 600; margin-bottom:25px;color:#000;}
#site-login .login-sns .whale-info {position:relative; line-height: 14px; margin-top:25px;}
#site-login .login-sns .whale-info .whale-info-quest {position: absolute; left:130px; top:25px; display: none; width:280px;font-size:12px;
    border:1px solid #ccc; background-color: #fff; padding:5px 8px; line-height: 19px; border-radius: 5px;
}
#site-login .login-sns .btn-whale-info {display: inline-block; border:1px solid #1d3661; border-radius: 50%; width:20px; height:20px;
    text-align: center; background-color: #1d3661; margin-left:5px;}
#site-login .login-sns .btn-whale-info:hover {border-color: #1d3661; background-color: #fff;}
#site-login .login-sns .btn-whale-info:hover .bi {color:#1d3661;}
#site-login .login-sns .btn-whale-info .bi {font-size:12px; vertical-align: top; color:#fff;}

#site-login .login-sns .btn-no-fox-login {display: flex; flex-direction: row; color:#333;}
#site-login .login-sns .btn-no-fox-login span {flex:1 1 auto;}
#site-login .login-sns .btn-no-fox-login span.toggle {text-align: right;}
#site-login #sns-list {display: none; margin-top:20px;}
#site-login #sns-list.active {display: block;}

#site-login .sns-login-btn {height:50px; line-height: 50px; padding:0 0.75rem;}
#site-login .login-whale {background-color: #fff; border:1px solid #aaa;background-image: url('/resources/front/user/sign/img/icon_whale.png?2022');}
#site-login .login-naver {background-color: #04cf5c; color:white; border:1px solid #04cf5c; background-image: url('/resources/front/user/sign/img/icon_naver.png');}
#site-login .login-kakao {background-color: #ffe500; border:1px solid #ffe400;background-image: url('/resources/front/user/sign/img/icon_kakao.png');}
#site-login .login-google {background-color: #fff; border:1px solid #aaa;background-image: url('/resources/front/user/sign/img/icon_google.png');}
#site-login .login-apple {background-color: #fff; border:1px solid #aaa;background-image: url('/resources/front/user/sign/img/icon_apple.png'); background-position-x: 14px;}
#site-login .login-copyright {margin-top:30px; text-align:center;}

#site-join {width:100%; display: flex; align-items: center; flex-direction: column;}
#site-join .join-wrap {width:400px; margin:50px auto; padding:30px 0;}
#site-join .join-tit {text-align:center;margin:0 0 50px; font-size:24px; color:#000;}

#site-join .stplat-agre {margin-top:30px; color:#212529;}
#site-join .stplat-agre h5 {font-size:18px;}
#site-join .stplat-check-field {border-radius: 5px; border:1px solid #ddd; margin-bottom:20px;}
#site-join .stplat-check-field label {font-size:14px;}
#site-join .stplat-check-field .form-check-input:checked { background-color: #1d3661; border-color: #1d3661; }
#site-join .stplat-check-field .form-check-input[type="checkbox"] {border-radius:0;}
#site-join .stplat-agre li {list-style: none; }
#site-join .stplat-agre .btn-stplat-agree {background: #1d3661; color: white; margin-bottom: 30px; width:100%; line-height: 40px;}
#site-join .stplat-all {padding:10px 15px; border-bottom:1px solid #ddd;}
#site-join .stplat-list {margin:0; padding:10px 15px;}
#site-join .stplat-view {text-decoration: underline; font-size:14px;}

#site-join .user-type {margin:80px 0 50px;}
#site-join .user-icon {display:inline-block; width:120px; height:120px; border:1px solid #efefef; border-radius: 50%; background-color:#efefef; }
#site-join .user-icon img {display:inline-block; margin-top:34px;}
#site-join .user-select-ctrl {margin-top:50px;}
#site-join .user-select-ctrl .btn {line-height:45px; border:1px solid #959fb1; width:100%;}
#site-join .user-select-ctrl .btn:hover {background:#1d3661; color:white;}

#site-join #registForm {line-height:50px;}
#site-join #registForm label {font-size:14px; font-weight: 600;}
#site-join #registForm input,
#site-join #registForm select {font-size:14px; padding:.9rem .75rem;}
#site-join #registForm .form-control[readonly] {background-color: #fafafa; color:#333;}
#site-join .gender-btn {text-align: center; border:1px solid #dee2e6; color:#999; width:100%; padding:.9rem .75rem;}
#site-join .gender-btn:hover {font-weight:bold;color:#000;}
#site-join .male {}
#site-join .male.active {background-color:#1d3661; color: #fff; font-weight: 800;}
#site-join .female.active {background-color:#1d3661; color: #fff; font-weight: 800;}
#site-join .search-zip-btn {background-color:#1d3661; color:white; font-size: 14px; padding:.9rem .75rem;}
#site-join .before-page-btn {border:1px solid #dee2e6; line-height: 40px; width:150px;}
#site-join .save-mber-btn {background-color: #efefef; line-height: 40px; color:#999999; width:100%; cursor: default;}
#site-join .save-mber-btn.active {background-color: #1d3661; color:white; box-shadow: 0 0 10px rgba(0,0,0,.2);cursor: pointer;}

#site-join #registForm .error {height:1rem; font-size: 13px; color:red; line-height: 1rem;}

#site-join #searchChildrenForm {line-height:50px;}
#site-join #searchChildrenForm label {font-size:14px; font-weight: 600;}
#site-join #searchChildrenForm input,
#site-join #searchChildrenForm select {font-size:14px; padding:.9rem .75rem;}
#site-join #searchChildrenForm .search-children-btn {background-color:#959fb1; color:#fff; border:1px solid #dee2e6; line-height: 40px; width:100%;}
#site-join #searchChildrenForm .search-children-btn.active {background-color: #1d3661; color:white; box-shadow: 0 0 10px rgba(0,0,0,.2); cursor:pointer;}
#site-join #registChildrenForm #later-add-btn {border:1px solid #dee2e6; line-height: 40px; width:150px;}
#site-join #registChildrenForm #save-children-btn {background-color: #efefef; line-height: 40px; color:#999999; width:100%; cursor: default;}
#site-join #registChildrenForm #save-children-btn.active {background-color: #1d3661; color:white; box-shadow: 0 0 10px rgba(0,0,0,.2); cursor:pointer;}
#site-join #children-list {margin:0 0 30px; padding:0; text-align: center; }
#site-join #children-list li {position:relative; margin-bottom:10px; line-height:45px; border:1px solid transparent;
    background-position: left 25px center; background-repeat: no-repeat; border-radius: 5px; list-style:none;}
#site-join #children-list li .bi {position: absolute; right:15px; top:0px; font-size: 24px;}
#site-join #children-list .naver {background-color: #04cf5c; color:white; background-image: url('/resources/front/user/sign/img/icon_naver.png'); border:1px solid #04cf5c;}
#site-join #children-list .kakao {background-color: #ffe500; background-image: url('/resources/front/user/sign/img/icon_kakao.png'); border:1px solid #ffe500;}
#site-join #children-list .google {background-color: #fff; background-image: url('/resources/front/user/sign/img/icon_google.png'); border:1px solid #ddd;}
#site-join #children-list .apple {background-color: #000; color:white;}
#site-join #children-list .fox {background-color: #fff; background-image: url('/resources/front/user/sign/img/icon_whale.png'); border:1px solid #ddd;}

#site-join #join-complt {text-align: center;}
#site-join #join-complt .complt-login-btn {width:100%;background-color: #1d3661; color:white; box-shadow: 0 0 10px rgba(0,0,0,.2);cursor: pointer; line-height:40px;}

#site-join .join-step {background:url('/resources/front/site/SITE_00000/images/login/step.png') no-repeat; height:55px;margin-bottom: 50px;}
#site-join .step-01 {background-position-y: 0px;}
#site-join .step-02 {background-position-y: -55px;}
#site-join .step-03 {background-position-y: -110px;}
#site-join .step-04 {background-position-y: -165px;}

#site-join .join-wrap .user-profile{ width: 200px; height: 200px; border-radius: 50%; border: 1px solid #fafafa; box-shadow: 0px 1px 1px 1px grey; background-color: #e9e9e9;}
#site-join .update-img-btn {background-color: #1d3661; color: white}

/*마이페이지*/
#site-join #user-info {line-height:50px;}
#site-join #user-info label {font-size:14px; font-weight: 600;}
#site-join #user-info input,
#site-join #user-info select {font-size:14px; padding:.9rem .75rem;}
#site-join #user-info .form-control {background-color: #fafafa; color:#333;}
#site-join #user-info .error {height:1rem; font-size: 13px; color:red; line-height: 1rem;}
#site-join #user-info .update-mber-btn {width: 40%; background-color: #1d3661; color:white; box-shadow: 0 0 10px rgba(0,0,0,.2);cursor: pointer;}
#site-join #user-info .row .btn-start {text-align: left}
#site-join #user-info .row .btn-end {text-align: end}

#stplatContentModal article {font-size:12px;}
#stplatContentModal table thead th {background:#eee;}
#stplatContentModal h1 {font-size:20px; font-weight: bold; margin-bottom:40px;}
#stplatContentModal h2 {font-size:16px; font-weight: bold;}
#stplatContentModal ol {margin-bottom:25px;}
#stplatContentModal ol > li {margin-bottom:10px;}
#stplatContentModal ul > li {list-style: square;}

#site-join #user-info #myChdr .numBox {display: inline-block;border-radius: 6px;width: 70%;border: 1px solid black;padding: 0.5rem 0.5rem;text-align: center;font-size: 0.7rem;}

#site-join .my-children {margin-top:30px; border:1px dotted #ccc; border-radius: 5px; padding:10px;}
#site-join .my-children #myChdr {min-height:50px; padding:10px;}
#site-join .my-children .child-nm {margin-bottom:5px; font-size:0.85rem;}

/*비밀번호 보기*/
#site-login .login-pw i.ico-view, #findMberForm i.ico-view{
    background-image: url(/resources/front/site/SITE_00000/images/common/ico-view.svg);
    background-position: center;
}
#site-login .login-pw i.ico-view-off, #findMberForm i.ico-view-off{
    background-image: url(/resources/front/site/SITE_00000/images/common/ico-view-off.svg);
    background-position: center;
}

#site-join #findMberForm input[type=text],
#site-join #findMberForm input[type=password] {line-height:35px; margin-bottom:10px;}
/*
.ico-view:before {
    content: "\f06e";
}
.ico-view-off:before {
    content: "\f070";
}*/