@charset "utf-8";

#container .content {
    background: #fff;
}

.content.content-join {
    font-family: 'noto3', sans-sarif;
}
.content.content-join::after {
    display: block;
    content: '';
    clear: both;
}
.content select,
.content input[type='text'],
.content input[type='password'] {
    color: #787878;
    font-size: 12px;
    font-family: 'Nanum Square';
    padding: 0 0 0 17px;
}

#container .content {
    background: #fff;
}

.join-wrap {
    width: 700px;
    margin: 0 auto;
    padding: 0 1px;
}
.content-join h1.top_logo {
    text-align: center;
    width: 154px;
    height: 64px;
    margin: 105px auto 50px;
}
.mb_birth .item_right label {
    margin-right: 0;
}
ul.each_term li {
    display: inline-block;
}

/*오버라이드*/
.join-content1,
.join-content2 {
    width: 100%;
}
.item_right input.middle {
    width: 100%;
    height: 100%;
    outline: none;
    font-size: 18px;
    font-family: 'Nanum Square';
    font-weight: 300;
}
.item_right input#mb_password {
    font-weight: 400;
}
.item_right input#mb_password_re {
    font-weight: 400;
}
.item_right input[type='text'],
.item_right input[type='password'] {
    color: #000;
    height: 100%;
    padding: 14px 22px 13px;
}
.items > li {
    padding: 13px 0px;
    border: none;
    overflow: initial;
}

.items > li:first-child {
    border-top: none;
}
.item_left {
    font-family: 'Nanum Square';
    font-weight: 400;
    padding-left: 0px;
    padding-right: 20px;
    color: #282828;
    font-size: 20px;
    margin-bottom: 9px;
    display: block;
    letter-spacing: -0.7px;
}

.item_left,
.item_right {
    width: auto;
    float: none;
}

.item_right {
    width: 100%;
    font-size: 12px;
    border: 1px solid #dbdbdb;
    background: #fff;
}

.item_right.is_focus {
    border: 2px solid #d91a1a;
}

::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #a8a8a8 !important;
    font-size: 18px;
    letter-spacing: -1px;
    font-weight: 300;
}
::-moz-placeholder {
    /* Firefox 19+ */
    color: #a8a8a8 !important;
    font-size: 18px;
}
:-ms-input-placeholder {
    /* IE 10+ */
    color: #a8a8a8 !important;
    font-size: 18px;
}
:-moz-placeholder {
    /* Firefox 18- */
    color: #a8a8a8 !important;
    font-size: 18px;
}

label.circle_radio:before,
label.i_label:before {
    width: 20px;
    height: 20px;
    border: none;
    background: url('/_skin/sidae/popkon/images/pc_img.png') no-repeat -10px -120px;
    border-radius: 0;
}

label.circle_radio:after,
label.i_label:after {
    width: 20px;
    height: 20px;
    border: none;
    background: url('/_skin/sidae/popkon/images/pc_img.png') no-repeat -10px -91px;
    border-radius: 0;
    left: 0;
    margin-top: -10px;
}

label.circle_radio {
    font-size: 14px;
}
.mail_degree label.circle_radio {
    margin-right: 7px;
}

.term_degree {
    margin-bottom: 0;
    border: 1px solid #ddddde;
    border-radius: 7px;
    background: #fff;
}
.term_degree > h5 {
    font-size: 16px;
    color: #7d7d7d;
}
.term_degree > ul {
    padding: 0;
    background: #fff;
    border-radius: 16px;
}
.term_degree > ul.term_each_degree {
    padding: 22px 30px 8px;
}
.term_degree .term_title {
    height: 33px;
    line-height: 33px;
    border-top: none;
    color: #787878;
}
.term_degree .term_title {
    font-size: 12px;
}
.term_degree li label {
    top: 4px;
    width: 20px;
}
.term_degree .term_btn {
    top: 5px;
    margin-left: 10px;
}

.term_agreement h3 {
    font-size: 12px;
}
.term_agreement p {
    font-size: 12px;
}
.term_btn button {
    color: #000;
    background: none;
    width: auto;
    font-size: 16px;
    cursor: initial;
}
.term_btn button .necessity {
    color: #2c76f0;
    font-family: 'Nanum Square';
    font-weight: 300;
}
.right_part {
    transform: skew(-0.1deg);
}
.right_part span {
    cursor: pointer;
    background: #fff;
    border-radius: 5px;
    padding: 3px 7px;
    font-size: 14px;
    border: 1px solid #cecece;
    font-family: 'Nanum Square';
    font-weight: 300;
    color: #2b2b2b;
    letter-spacing: -0.7px;
}

.term_content .terms-css ol li,
.term_content .terms-css ul li,
.term_content .term_dl dt,
.term_content .term_dl dd,
.term_content .term_ol1 li {
    font-size: 12px;
}
.term_content .tit {
    font-size: 14px;
}

.upper_portion {
    display: flex;
    justify-content: space-between;
    border-bottom: 2px solid #000;
    padding: 20px 20px 20px 20px;
    align-items: center;
}
.skip.early {
    width: 100%;
    height: auto;
    position: static;
    text-indent: initial;
    font-size: 20px;
    color: #000;
    visibility: visible;
    overflow: initial;
    line-height: initial;
}
.skip.early + i {
    background: url('/_skin/sidae/popkon/images/pc_img.png') no-repeat -159px -89px;
    width: 44px;
    height: 39px;
    cursor: pointer;
}
.termArea {
    height: fit-content;
}
.termArea .term_txt {
    font-size: 15px;
}

.term_degree > ul li.con1 .termArea {
    height: fit-content;
}

/*약관동의 수정*/
.term_degree .term_text.on {
    border-top: none;
    padding: 0;
}
.term_degree .term_content {
    padding-right: 0;
    padding-bottom: 0;
    height: auto;
}
.term_text_wrap {
    position: relative;
    padding-top: 5px;
    height: 0;
}

.txtArea {
    padding: 27px 20px 27px 20px;
}
.txtArea .term_title,
.skip.early {
    font-weight: bold;
}
.term_text_wrap.on {
    position: fixed;
    width: 700px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: auto;
    background: #fff;
    z-index: 999999;
    border: 2px solid;
}
.term_text_wrap > li {
    width: 100%;
    float: left;
    top: 0px;
    left: 0;
    box-sizing: border-box;
    height: 0;
}
.term_each_degree {
    width: 100%;
    padding: 3px;
}
.onclick_degree {
    float: none;
    margin-left: 0;
    line-height: initial;
}
.onclick_degree .all_agree {
    width: 100px;
    display: block;
    height: 20px;
    font-size: 17px;
    margin-left: 32px;
    color: #000;
    line-height: 18px;
    font-family: 'Nanum Square';
    font-weight: 700;
    letter-spacing: -0.7px;
}
.term_bg {
    display: none;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 999999;
}
.term_degree .term_each_degree > li {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}
.term_degree .term_each_degree > li:first-child {
    margin-bottom: 13px;
}
.term_degree .term_each_degree > li:nth-child(3) {
    margin-bottom: 10px;
}
.term_degree .term_each_degree > li:nth-child(4) {
    margin-bottom: 14px;
}
.sms_coupon_event {
    display: block;
    width: fit-content;
    font-size: 15px;
    padding: 7px 21px 7px 20px;
    border-radius: 30px;
    transform: skew(-0.1deg);
    margin: 10px 0 0 25px;
}
.sms_coupon_event span {
    font-family: 'Nanum Square';
    font-weight: 600;
    letter-spacing: -1px;
}
.sms_coupon_event::after {
    display: none;
}
/*스크롤바 style : S*/
/*스크롤바 style : E*/

.protector_degree {
    padding: 20px 15px;
    background: #fff;
    border: 1px solid #454545;
    margin-bottom: 20px;
}
.protector_degree h6 {
    color: #fff;
    background: #454545;
    padding: 5px 25px;
    font-size: 12px;
    font-weight: normal;
}
.protector_degree p {
    font-size: 12px;
    line-height: 16px;
}
.protector_degree .red {
    color: #de474f;
}
.protector_degree ul {
    border-top: none;
}
.protector_degree > ul > li .protector_right {
    width: auto;
}
.protector_degree > ul > li .protector_left,
.protector_degree > ul > li .protector_right {
    font-size: 12px;
}
.protector_degree > ul > li .protector_left {
    font-weight: bold;
    color: #7d7d7d;
}
.protector_degree > ul > li .protector_right select {
    min-width: 70px;
}
.content select {
    min-width: 100px;
}
.chk_btn1 {
    width: 100px;
}
.chk_btn1,
.chk_btn2 {
    font-size: 15px;
    font-weight: bold;
}
.text_alert {
    font-size: 14px;
    line-height: 16px;
    margin-left: 10px;
}
.mail_degree {
    transform: skew(-0.1deg);
}
.mail_degree .txt {
    display: block;
    margin-top: 6px;
    margin-left: 10px;
    font-size: 15px;
    letter-spacing: -1px;
    color: #787878;
    font-family: 'Nanum Square';
    font-weight: 300;
}
.phone_num {
    width: 65px;
}
.term_position {
    position: absolute;
    bottom: 5px;
}

/* 관심분야 */
.inter_list {
    display: flex;
    flex-wrap: wrap;
    border-left: initial;
    margin-left: 2px;
}
.inter_list > li.on {
    background: none;
}

.inter_list > li {
    float: none;
    outline: none;
    width: calc((100% - 30px) / 3);
    box-sizing: border-box;
    margin-right: 10px;
    margin-bottom: 10px;
    margin-top: 0;
    margin-left: 0;
    height: auto;
    line-height: initial;
    position: static;
}
.inter_list > li:before {
    display: none;
}
.inter_list > li label.i_label {
    font-size: 17px;
    margin-left: 0;
    color: #000;
    /* padding-left: 0; */
    padding: 13px 0;
    border: 1px solid #dbdbdb;
    border-radius: 5px;
    font-family: 'Nanum Square';
    font-weight: 300;
    letter-spacing: -0.7px;
    line-height: 20px;
    background: #fcfcfc;
}

.inter_list li:before {
    display: none;
}
.inter_list li.on label.i_label {
    position: relative;
    outline: 2px solid #013ac5;
    user-select: none;
    background: #ffffff;
    font-weight: bold;
    color: #003ac4;
}
.inter_list li.on label.i_label::after {
    position: absolute;
    top: initial;
    bottom: -13px;
    left: 46%;
    display: none;
    width: 0px;
    height: 0px;
    border-top: 10px solid #004dd3;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
}
.inter_list li label.i_label::before {
    display: none;
}
.inter_data {
    margin-top: 23px;
    text-align: center;
    overflow: initial;
}
.fav_menu {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
    border-bottom: 1px solid #bebebe;
    padding-bottom: 18px;
}
.fav_menu span {
    border: 1px solid #dbdbdb;
    width: calc((100% - 20px) / 3);
    line-height: 48px;
    cursor: pointer;
    font-size: 17px;
    color: #000;
    margin-right: 0;
    text-align: center;
    height: 48px;
    border-radius: 6px;
    margin-bottom: 0;
    background: #fcfcfc;
    font-family: 'Nanum Square';
    font-weight: 300;
    letter-spacing: -1px;
}

.fav_menu span.active {
    color: #fff;
    background: #494949;
    border: 1px solid #494949;
}
.fav_infor {
    font-size: 17px;
    font-weight: 100;
    display: inline-block;
    margin-left: 9px;
    font-family: 'Nanum Square';
    font-weight: 300;
    transform: skew(-0.1deg);
    letter-spacing: -0.7px;
}
.fav_list .under_line {
    text-decoration: underline;
    color: #c82323;
    font-family: 'Nanum Square';
    font-weight: 300;
}
.term_table th,
.term_table td {
    vertical-align: middle;
}
.term_table th {
    text-align: center;
    font-weight: normal;
}
.consonant {
    display: none;
    margin-top: 26px;
}
.consonant li {
    width: calc(100% / 5);
    text-align: center;
    padding: 6px 10px;
    border-radius: 5px;
    font-size: 17px;
    cursor: pointer;
    line-height: 20px;
}
.consonant li.active {
    background: #013ac5;
}
.consonant li.active span {
    color: #fff;
}
.consonant span {
    color: #000;
    font-family: 'Nanum Square';
    font-weight: 300;
}
.consonant span.active {
    background: #494949;
    color: #fff;
}
.profit {
    margin-top: 25px;
    display: none;
    height: 230px;
}
.profit ul {
    position: absolute;
    left: 0;
    display: flex;
    justify-content: space-between;
    flex-flow: row wrap;
    width: calc(700px - 15px);
    height: 190px;
}
.profit ul > li {
    width: calc((100% - 30px) / 3);
    background: #eeeeee;
    padding: 30px 30px;
    border-radius: 10px;
    height: 220px;
    line-height: initial;
}
.profit ul > li span {
    font-size: 18px;
    line-height: 24px;
    font-weight: 700;
    color: #000;
}
.profit ul > li:nth-child(1) {
    padding: 30px 25px;
}
.profit ul > li:nth-child(2) {
    padding: 30px 27px;
}
.profit ul > li:nth-child(2) .lec_name {
    display: block;
}
.profit ul > li:nth-child(3) {
    padding: 30px 55px;
}
.profit .image_box1 {
    background: url('/_skin/sidae/popkon/images/pc_img.png') no-repeat -7px -169px;
    width: 174px;
    height: 101px;
    min-height: 115px;
}
.profit .image_box2 {
    background: url('/_skin/sidae/popkon/images/pc_img.png') no-repeat -200px -173px;
    width: 167px;
    height: 92px;
    min-height: 115px;
}
.profit .image_box3 {
    background: url('/_skin/sidae/popkon/images/mobile_img.png') no-repeat -381px -124px;
    width: 146px;
    height: 90px;
    min-height: 115px;
}

.dash_top {
    margin: 0;
    border-top: none;
    padding-top: 0;
}
.btn_section {
    margin-top: 28px;
    margin-bottom: 22px;
    width: 100%;
}
.btn_section a {
    width: 100%;
}
.btn_section a.next_btn {
    background-color: #000000;
    font-family: 'market-m';
    font-weight: 400;
    font-size: 25px;
    height: auto;
    line-height: initial;
    padding: 20px 0 16px;
    border-radius: 3px;
}

#mb_birth_year,
#mb_birth_month,
#mb_birth_day {
    color: #000;
    width: 100%;
    height: 100%;
    font-size: 18px;
    padding: 0;
    border: none;
    outline: none;
    font-family: 'Nanum Square';
    font-weight: 300;
    appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    letter-spacing: -0.7px;
    padding: 0 20px;
    background: url('/_skin/sidae/popkon/images/arrow_bottom.png') no-repeat 90%;
}
.birth_each {
    position: relative;
}

.item_right.flex-box {
    display: flex;
    padding: 0;
    align-items: center;
    height: 50px;
}
.item_right.flex-box .birth_each {
    width: 35.333%;
    height: 100%;
    border-right: 1px solid #dbdbdb;
    /* padding: 0 20px; */
}
.item_right.flex-box .birth_each:nth-child(3) {
    border-right: none;
}
#mb_birth_year.no_select,
#mb_birth_month.no_select,
#mb_birth_day.no_select {
    background: #e5e5e5;
    pointer-events: none;
}
.select_baria {
    position: relative;
}
.select_baria:after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
}
/* 간편회원가입 푸터*/
.new-tail-info {
    width: 495px;
    margin: 0 auto;
    padding: 0 0 70px 0;
    transform: skew(-0.1deg);
}
.new-tail-info ul {
    margin-bottom: 15px;
    /* margin-left: 40px; */
    text-align: center;
}
.new-tail-info ul:after {
    content: '';
    display: block;
    clear: both;
}
.new-tail-info ul li {
    float: left;
    transform: skew(-0.1deg);
}
.new-tail-info ul li {
    display: inline-block;
}
.new-tail-info ul li:before {
    content: '|';
    margin: 0 25px;
    font-weight: normal;
    color: #c6c6c6;
}

.new-tail-info ul li a.foot_menu {
    font-family: 'Nanum Square';
    font-weight: 300;
    color: #868686;
    font-size: 14.5px;
}
.new-tail-info ul li:first-child:before {
    display: none;
}

/*.new-tail-info ul li a:link,*/
.new-tail-info ul li a:visited,
.new-tail-info ul li a:active {
    color: #868686;
    font-size: 14px;
    text-decoration: none;
}

.new-tail-info address {
    color: #8f8f8f;
    font-size: 15px;
    /* border-top: 1px solid #c6c6c6; */
    /* padding-top: 20px; */
    font-style: normal;
    text-align: center;
    line-height: 1.6;
    float: none;
    font-family: 'Nanum Square';
    font-weight: 100;
    letter-spacing: -0.7px;
}

#bback {
    display: none;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9;
}
.modalyong {
    background: #fff;
    border: 2px solid #000;
    padding: 5px;
    width: 360px;
    color: #000;
    border-radius: 6px;
    min-height: 190px;
    top: calc(50% - 130px);
    left: calc(50% - 180px);
    position: absolute;
    z-index: 11;
    text-align: center;
}
.modalyong .textboxs {
    margin: 16px;
}
.modalyong .btns {
    display: none;
    margin: 21px;
}
.modalyong .fack_btn {
    cursor: pointer;
    padding: 5px 16px;
    border-radius: 2px;
    margin: 6px;
    font-weight: bold;
    border: 2px solid #000;
}
.modalyong .fack_btn:hover {
    background: #000;
    color: #fff;
}

/* 도서 회원가입 우측네비게이션 */
.right-mypage-menu {
    display: none;
}

.cell_ph .item_right {
    display: flex;
    padding: 0;
    align-items: center;
    flex-wrap: wrap;
    background: none;
    border: none;
}
.cell_ph .item_right.is_focus {
    position: relative;
    border: 0;
}

.cell_ph .item_right.is_focus::before {
    clear: both;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    border: 2px solid #d91a1a;
    box-sizing: border-box;
    z-index: 2;
    pointer-events: none;
}
.cell_ph .arrow_box {
    position: relative;
    height: 100%;
    height: 50px;
}
.cell_ph select {
    border: none;
    width: 100%;
    height: 100%;
    border: 1px solid #dbdbdb;
    font-size: 18px;
    color: #000;
    outline: none;
    width: 165px;
    box-sizing: border-box;
    appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    padding-left: 22px;
    font-weight: 300;
    letter-spacing: -1px;
    background: url('/_skin/sidae/popkon/images/arrow_bottom.png') no-repeat 90% #fff;
}
.cell_ph .item_right input#mb_hp {
    border: 1px solid #dbdbdb;
    font-weight: 300;
}
.cell_ph .item_right input {
    border: none;
    font-size: 19px;
    width: 165px;
    height: 100%;
    border-right: 1px solid #dbdbdb;
    box-sizing: border-box;
    outline: none;
}
.cell_ph .item_right input.code_txt {
    width: 100% !important;
    height: 48px;
    font-weight: 300;
}
.cell_ph .item_right input.okChk {
    color: #000;
    font-weight: 300;
    font-size: 18px;
    letter-spacing: -1px;
    border-top: 1px solid #dbdbdb;
    border-bottom: 1px solid #dbdbdb;
}
.cell_ph .item_right input.chk_btn2 {
    display: inline;
    background: red;
    color: #fff;
    font-weight: 400;
}
#nChk {
    opacity: 0.5;
}
.cell_ph .item_right input.chk_btn1,
.cell_ph .item_right .chk_btn2 {
    width: calc(100% - 495px);
    border-right: none;
    background: #353535;
    font-size: 18px !important;
    outline: none;
    font-family: 'Nanum Square';
    font-weight: 400;
    height: 50px;
}
.cell_ph .item_right input#nChk.chk_btn1.is_active {
    background: #000;
    opacity: 1;
    cursor: pointer;
}
.cell_ph .item_right .chk_btn2 {
    width: 100%;
}
.cell_ph .item_right .chk_btn2.skip {
    position: static;
    background: #004dd3 !important;
    visibility: visible;
    text-indent: 0;
    cursor: default;
}
.cell_ph .item_right input.chk_btn1.pUpdate,
.cell_ph .item_right .chk_btn2:not(.skip) {
    cursor: pointer;
}
.text_alert.y,
.text_alert.n {
    display: inline-block;
    margin-top: 6px;
}
.text_alert.y {
    color: #2c76f0;
}
.item_right input.middle,
.item_right input.middle::placeholder,
#mb_birth_year,
#mb_birth_month,
#mb_birth_day,
.cell_ph select,
.cell_ph .item_right input.okChk {
    height: 50px;
    font-size: 16px;
}

.mb_birth .item_right.flex-box.is_focus {
    border: 2px solid #d91a1a;
}

.item_right > p {
    margin-top: 6px !important;
    margin-left: 10px;
}
.code {
    width: 100%;
    height: fit-content;
    margin-bottom: 0;
}
.code_txt {
    width: 100%;
}
.code_timer {
    display: none;
    position: static;
    width: fit-content;
    top: 0;
    left: 0;
    text-align: right;
    height: 100%;
    font-size: 19px;
    font-weight: bold;
    padding-top: 13px;
    padding-right: 23px;
}
.timeWrap {
    position: relative;
    width: 100%;
    border: 1px solid #ccc;
    border-bottom: 0;
    height: fit-content;
    display: flex;
}
.term_btn button {
    transform: skew(-0.1deg);
}
.term_btn button span {
    font-family: 'Nanum Square';
    font-weight: 300;
    letter-spacing: -0.7px;
}
.degree_box {
    margin-top: 20px;
}
.chouse {
    font-family: 'Nanum Square';
    font-weight: 300;
}
.cell_ph {
    margin-top: 15px;
    margin-bottom: 15px;
}
.Chk_notice {
    font-size: 15px;
    margin-top: 0 !important;
}