/* **************************************** *
 * 공통클래스_Layout
 * **************************************** */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css");
@import url("/css/nice-select.css");
@import url("/css/xeicon.min.css");

* {
    box-sizing: border-box;
    font-family: 'Noto Sans KR', 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 17px;
    line-height: 1.5;
}

html,
body {
    font-size: 17px;
    line-height: 1.4;
}

ul {
    padding-left: 0 !important
}

p {
    margin-bottom: 0 !important
}

#splash {
    position: relative;
    min-height: 100%;
}

#wrap {
    position: relative;
    min-height: 100%;
}

#container {
    position: relative;
    margin: 9vh auto 0;
    width: 100%;
}

.user_container {
    padding-bottom: 100px;
}

.sub #container {
    margin: 101px auto 0;
}

.main #container {
    margin: 55px auto 0;
    background: #0583f2;
    padding-bottom: 0
}

.main2 #container {
    margin: 55px auto 0;
    background: #f7faff;
    padding-bottom: 0
}

.sub.sub_bg #container {
    margin: 55px auto 0;
    background: #f7faff;
    padding-bottom: 0;
    padding-top: 46px;
    min-height: 92vh
}

.inner {
    position: relative;
    margin: 0 auto;
    max-width: 1030px;
    padding: 0 20px;
}

.ea1 li {
    width: 100%;
}

.ea2 li {
    width: 50%;
}

.ea3 li {
    width: 33.333%;
}

.ea4 li {
    width: 25%;
}

.ea5 li {
    width: 20%;
}

.ea6 li {
    width: 16.666%;
}

.ea7 li {
    width: 14.2857%;
}

.ea8 li {
    width: 12.5%;
}

.ea9 li {
    width: 11.111%;
}

/* input_common */
.put_box {
    position: relative;
}

.put_box .put_inner {
    position: relative;
    margin-top: 15px;
}

input {
    width: 100%;
    height: 52px;
    border: 0 solid #d7d7d7;
    background: #fafafa;
    padding: 10px;
    border-radius: 5px;
}

input::placeholder,
textarea::placeholder {
    color: #b2b2b2;
    font-size: 16px;
}

.put_box .put_inner:first-of-type {
    margin-top: 0;
}

.form_cont {
    position: relative;
    width: 100%;
}

.form_cont>textarea {
    position: relative;
    width: 100%;
    border: 1px solid #f3f3f3;
    height: 150px;
    border-radius: 5px;
    padding: 10px;
    font-size: 16px;
    background: #fafafa;
}

.form_cont>input {
    font-size: 13px;
    width: 100%;
    border: 1px solid #f4f4f4;
    border-radius: 5px;
    height: 42px;
    line-height: 40px;
    padding: 0 10px;
}

.form_cont>.cont_box {
    font-size: 13px;
    width: 100%;
    color: #666666;
    border: 1px solid #cccccc;
    border-radius: 10px;
    padding: 10px;
}


/* btn_common */
.btn_bom {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    max-width: 1030px;
}

.btn_bom .btn_st01 {
    border-radius: 0 !important;
    margin: 0;
}

.btn_st01 {
    margin-top: 15px;
}

.btn_st01 strong {
    font-weight: 700;
}

.btn_st02 {
    height: 52px;
    margin-top: 15px;
    background: #d7d7d7;
}



/********************************************************
* TITLE
*********************************************************/
/* 회원가입 */
.cont_title01,
.cont_title01 span {
    font-size: 35px;
    color: #121212;
    font-weight: 600;
    line-height: 1.3em;
}

#wrap h5 {
    font-size: 16px;
    color: #717171;
    font-weight: 400;
}

/* 점포01 */
.con_title_wrap01 {
    position: relative;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.con_title_wrap01>.title {
    font-size: 16px;
    color: #333;
    font-weight: 500;
}

.con_title_wrap01>.go_btn {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    text-align: right;
    font-size: 10px;
    color: #333;
}

.con_title_wrap01>.go_btn>.xi-angle-right {
    font-size: 9px;
    color: #686868
}

.con_title_wrap01>.go_btn>.go_btn_icon {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 18px;
    height: 18px;
    margin-left: 5px;
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #ededed;
    transition: background-color .3s;
}

.con_title_h4 {
    position: relative;
}

.con_title_h4>h4 {
    font-size: 16px;
    color: #333333;
    font-weight: 500;
    display: block;
    padding: 30px 0 20px;
}


/********************************************************
* Intro
*********************************************************/
.splash_main {
    width: 100vw;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0084f4 url(/images/splash_bg.jpg) no-repeat center top;
    background-size: cover;
    text-align: center;
}

.splash_main a {
    max-width: 400px
}

.splash_logo img {
    width: 50%
}

.splash_img {
    margin-top: 10vh
}

.splash_img img {
    width: 80%
}



/********************************************************
* Header
*********************************************************/
#header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 100;
}

.header_type01 {
    position: relative;
    height: 55px;
    background-color: #fff;
    border-bottom: 1px solid #efefef;
}

.header_type02 {
    position: relative;
    height: 55px;
    background-color: #0583f2;
    border-bottom: 1px solid #0583f2;
}

.header_type03 {
    position: relative;
    height: 55px;
    background-color: #0583f2;
    border-bottom: 1px solid #0583f2;
}

.header_type03 .inner {
    position: relative;
    padding-top: 3px;
}

/* btn */
.header_btn01 {
    position: absolute;
    top: 6px;
    left: 20px;
}

.header_btn01 a,
.header_btn02 a {
    padding: 10px;
    display: block;
}

.header_btn02 {
    position: absolute;
    top: 8px;
    left: 10px;
}

.header_btn01_icon {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 16px;
    height: 16px;
    color: #1b1b1b;
}

.header_btn02_icon {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 16px;
    height: 16px;
    color: #fff;
}

.header_type02 .nav_close {
    float: right;
    margin-top: -54px;
}

.header_type02 .nav_close i {
    font-size: 32px;
    color: #fff;
}

/* title */
.header_title01 {
    font-size: 18px;
    color: #111;
    text-align: center;
    line-height: 55px;
}

.header_title02 {
    font-size: 18px;
    color: #fff;
    text-align: left;
    line-height: 55px;
    padding-left: 30px;
}

.header_title03 {
    font-size: 16px;
    color: #2f2f2f;
    text-align: left;
    line-height: 55px;
}

/* util */
.util_menu_wrap {
    position: relative;
    margin-left: auto;
    text-align: left;
    align-self: flex-start;
}

/* .util_menu_wrap:after{content: "\f4ad";font-family: "Font Awesome 5 Free"; font-weight: 600; float: right; line-height: 24px; color: #fff;} */

.util_menu_wrap .main_tit {
    display: inline-block;
    color: #fff;
    font-size: 18px;
    padding: 11px 10px;
    font-weight: 500;
}

.util_menu_wrap .util_item .util_name {
    position: relative;
    display: block;
}

.top_comment {
    float: right;
    margin-top: 13px;
}

.top_comment a {
    display: block;
    color: #fff
}

.top_comment a:hover {
    opacity: .7;
    color: #fff;
}

.top_comment i {
    font-size: 20px
}


.util_item {
    position: relative;
    display: inline-block;
    vertical-align: top;
    padding: 15px 0;
}

.util_menu_wrap .util_item [class*=ic-head-] {
    position: relative;
    display: block;
    width: 21px;
    height: 18px;
    background-repeat: no-repeat;
    background-position: top center;
}

.util_menu_wrap .util_item .ic-head-talk {
    background-image: url("/images/header_icon_talk_off.png");
}

.util_menu_wrap .util_item .ic-head-notice {
    background-image: url("/images/header_icon_notice_off.png");
}

.util_menu_wrap .util_item .util_name .count {
    overflow: hidden;
    display: block;
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 4px;
    max-width: 4px;
    height: 4px;
    background: #f64b5b;
    border-radius: 2px;
    word-wrap: normal;
}

.util_item .nav_open {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 17px;
    margin-top: 1px;
}

.util_item .nav_open>span {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 1px;
    background-color: #fff;
    font-size: 0;
    text-indent: -9999px;
    overflow: hidden;
    visibility: visible;
    opacity: 1;
    transition: all 0.5s;
}

.util_item .nav_open::before {
    content: '';
    position: absolute;
    top: 0;
    width: 100%;
    height: 1px;
    background-color: #fff;
    transition: all 0.5s 0.1s;
    z-index: 1;
}

.util_item .nav_open::after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: #fff;
    transition: all 0.5s 0.2s;
}

.util_item .nav_close {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-top: 0;
}

.util_item .nav_close>span {
    display: none;
}

.util_item .nav_close::before {
    content: '';
    position: absolute;
    top: 0;
    width: 100%;
    height: 1px;
    background-color: #333;
    -webkit-transform: translateY(10px) rotate(45deg);
    z-index: 1;
}

.util_item .nav_close::after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: #333;
    transform: translateY(-7px) rotate(-45deg);
    transition: all 0.5s 0.2s;
}

/* 서브 메뉴 */
.side_menu_wrap {
    position: relative;
    width: 100%;
    height: 45px;
    background-color: #fff;
    border-bottom: 1px solid #f1f1f1;
}

.side_menu_wrap::after {
    content: "";
    clear: both;
    display: block;
}

.side_menu_wrap .side_menu_list {
    position: relative;
    margin: 0 auto;
    max-width: 1030px;
    line-height: 45px;
    text-align: center;
}

.side_menu_wrap .side_menu_list ul {
    padding-left: 0
}

.side_menu_wrap .side_menu_list ul li {
    position: relative;
    display: inline-block;
    text-align: center;
    line-height: 45px;
    padding: 0 20px;
}

.side_menu_wrap .side_menu_list ul li:after {
    content: '';
    display: table;
    clear: both;
}

.side_menu_wrap .side_menu_list ul li a {
    position: relative;
    display: inline-block;
    color: #c4c4c4;
    font-size: 16px;
    line-height: 45px;
}

.side_menu_wrap .side_menu_list ul li.on a,
.side_menu_wrap .side_menu_list ul li a:hover {
    color: #6d7582;
    font-weight: 500;
}

.side_menu_wrap .side_menu_list ul li.on a::after,
.side_menu_wrap .side_menu_list ul li a:hover::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #6d7582;
}


.side_menu_wrap2 {
    position: relative;
    width: 100%;
    height: 45px;
    background-color: #fff;
    border-bottom: 1px solid #f3f3f3;
    margin-top: 30px;
}

.side_menu_wrap2::after {
    content: "";
    clear: both;
    display: block;
}

.side_menu_wrap2 .side_menu_list {
    position: relative;
    margin: 0 auto;
    max-width: 1030px;
    line-height: 45px;
}

.side_menu_wrap2 .side_menu_list ul li {
    position: relative;
    display: block;
    float: left;
    text-align: center;
}

.side_menu_wrap2 .side_menu_list ul li:after {
    content: '';
    display: table;
    clear: both;
}

.side_menu_wrap2 .side_menu_list ul li a {
    position: relative;
    display: inline-block;
    color: #909090;
    font-size: 16px;
}

.side_menu_wrap2 .side_menu_list ul li.on a {
    color: #5724cf;
    font-weight: 500;
}

.side_menu_wrap2 .side_menu_list ul li.on::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: #5724cf;
}



/********************************************************
* Footer
*********************************************************/
/* 하단 아이콘 링크 */
.footer_menu_wrap {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 70px;
    background-color: #fff;
    border-top: 1px solid #f3f3f3;
    z-index: 100;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    box-shadow: 0 0 15px -3px #ddd;
}

.footer_menu_wrap .fot_icon_menu_list {
    position: relative;
    margin: 0 auto;
    max-width: 1030px;
    padding: 10px 0;
    overflow: hidden;
}

.footer_menu_wrap .fot_icon_menu_list ul {
    padding-left: 0;
}

.footer_menu_wrap .fot_icon_menu_list ul li {
    position: relative;
    display: table;
    width: 20%;
    float: left;
    text-align: center;
}

.footer_menu_wrap .fot_icon_menu_list ul li a {
    color: #adb4bd;
    font-size: 10px;
    display: block;
}

.footer_menu_wrap .fot_icon_menu_list ul li:after {
    content: '';
    display: table;
    clear: both;
}

.footer_menu_wrap .fot_icon_menu_list li span {
    display: block;
    margin: 5px auto 5px;
    height: 24px;
    width: 24px
}

.footer_menu_wrap .fot_icon_menu_list ul li.on a {
    color: #0a87ee;
}

.footer_menu_wrap .fot_icon_menu_list li span.icon01 {
    background: url("/images/fot_icon01.png") no-repeat center;
    background-size: 100%;
}

.footer_menu_wrap .fot_icon_menu_list li.on span.icon01 {
    background: url("/images/fot_icon01_on.png") no-repeat center;
    background-size: 100%;
}

.footer_menu_wrap .fot_icon_menu_list li span.icon02 {
    background: url("/images/fot_icon02.png") no-repeat center;
    background-size: 100%;
}

.footer_menu_wrap .fot_icon_menu_list li.on span.icon02 {
    background: url("/images/fot_icon02_on.png") no-repeat center;
    background-size: 100%;
}

.footer_menu_wrap .fot_icon_menu_list li span.icon03 {
    position: relative;
    background: url("/images/fot_icon03.png") no-repeat center;
    background-size: 100%;
}

.footer_menu_wrap .fot_icon_menu_list li.on span.icon03 {
    background: url("/images/fot_icon03_on.png") no-repeat center;
    background-size: 100%;
}

.footer_menu_wrap .fot_icon_menu_list li span.icon04 {
    position: relative;
    background: url("/images/fot_icon04.png") no-repeat center;
    background-size: 100%;
}

.footer_menu_wrap .fot_icon_menu_list li.on span.icon04 {
    background: url("/images/fot_icon04_on.png") no-repeat center;
    background-size: 100%;
}

.footer_menu_wrap .fot_icon_menu_list li span.icon05 {
    background: url("/images/fot_icon05.png") no-repeat center;
    background-size: 100%;
}

.footer_menu_wrap .fot_icon_menu_list li.on span.icon05 {
    background: url("/images/fot_icon05_on.png") no-repeat center;
    background-size: 100%;
}

.footer_menu_wrap .fot_icon_menu_list li span.count {
    overflow: hidden;
    display: block;
    position: absolute;
    top: -1px;
    left: 50%;
    margin-left: 6px;
    width: 12px;
    height: 12px;
    line-height: 12px;
    font-size: 2px;
    color: #fff;
    background: #5724cf;
    text-align: center;
    border-radius: 50%;
}


/* 하단 사이트 정보 */
.footer_info_wrap {
    position: relative;
    margin: 25px auto 90px;
    width: 100%;
    border-top: 8px solid #f7f7f7;
}

.footer_info_wrap .inner>h2 {
    color: #6b6b6b;
    font-size: 14px;
    padding: 25px 0 15px;
}

.footer_info_wrap p {
    padding-bottom: 4px;
}

.footer_info_wrap p span {
    position: relative;
    color: #a1a0a0;
    font-size: 11.5px;
    padding-right: 20px;
}

.footer_info_wrap p span::after {
    content: '';
    width: 1px;
    height: 11px;
    background: #f2f2f2;
    position: absolute;
    top: 4px;
    left: -10px;
}

.footer_info_wrap p span:first-child::after {
    display: none;
}

.footer_info_wrap p a {
    position: relative;
    color: #a1a0a0;
    font-size: 11.5px;
    padding-right: 20px;
}

.footer_info_wrap p a::after {
    content: '';
    width: 1px;
    height: 11px;
    background: #f2f2f2;
    position: absolute;
    top: 4px;
    left: -10px;
}

.footer_info_wrap p a:first-child::after {
    display: none;
}



/* **************************************** *
 * 로그인
 * **************************************** */
.login_wrap {
    position: relative;
    margin: 0 auto;
    width: 100%;
    text-align: center;
}

.login_wrap .login_logo {
    display: block;
    padding-top: 0;
    text-align: center;
}

.login_wrap .login_logo img {
    width: 100%;
    max-width: 100px;
    height: auto;
}

.login_wrap .login_input {
    margin-top: 60px;
}

.login_wrap .login_input a {
    display: block;
    color: #6d6d6d;
    padding: 15px 0;
    font-size: 14px;
}

.login_wrap .login_member {
    margin-top: 0;
}

.login_wrap .login_member .member_bt {
    margin: 15px auto;
}

.login_wrap .login_member a {
    position: relative;
    color: #6d6d6d;
    font-size: 14px;
    margin-left: 25px;
    padding: 10px 5px;
}

.login_wrap .login_member a.terms_bt {
    margin-left: 0
}

.login_wrap .login_input a:hover,
.login_wrap .login_member a:hover {
    color: #464646;
}

.login_wrap .login_member .privacy_bt:before {
    content: '';
    display: block;
    position: absolute;
    left: -14px;
    top: 14px;
    width: 1px;
    height: 13px;
    background: #ececec;
}




/* **************************************** *
 * 회원정보 및 회원가입
 * **************************************** */
.member_join {
    position: relative;
    padding-top: 90px;
}

.member_join.terms {
    padding-top: 0
}

.member_join .member_text01 {
    color: #717171;
    font-size: 15px;
}

.member_join .member_text02 {
    padding-top: 5px;
    color: #f03e3e;
    font-size: 13px;
}

.member_join .member_text03 {
    padding-top: 5px;
    color: #0583f2;
    font-size: 13px;
}

.member_join .member_text04 {
    padding-top: 15px;
    color: #222222;
    font-size: 19px;
    line-height: 1.6;
    font-weight: 500;
    text-align: center;
}

.member_join .member_text04 span {
    font-size: 19px;
    font-weight: 500;
}

/* 회원가입 동의 */
.agree_wrap {
    position: relative;
    padding-top: 30px;
}

.member_accordion {
    margin-top: 20px
}

.member_join .agree_text {
    position: relative;
    line-height: 1.6;
    font-size: 15px;
}

.member_join .agree_text strong {
    display: block;
    padding: 10px 0;
    margin-top: 20px;
    color: #272727;
}

.custom-control-label {
    width: 100%;
    font-size: 15px;
    color: #0c0c0c;
    line-height: 20px;
}

.custom-control-label span {
    color: #ababab;
    font-size: 14px;
}

.custom-control-label span.num {
    color: #0c0c0c;
    font-size: 14px;
}

.member_accordion .m-agree-box {
    display: none;
}

.member_accordion .m-agree-box .m-agree-box-wrap {
    background: #f9f9f9;
    width: 100%;
    height: 100%;
    height: 170px;
    overflow-y: scroll;
    overflow-x: hidden;
    border: 0;
}

.member_accordion .m-agree-box .m-agree-box-wrap .agree_text2 {
    position: relative;
    font-size: 12px;
    color: #8d8d8d;
    line-height: 1.6;
    padding: 5px 15px 15px 15px;
}

.member_accordion .m-agree-box .m-agree-box-wrap .agree_text2 strong {
    display: block;
    padding: 10px 0;
    font-size: 12px;
    font-weight: 500;
}

.member_accordion .m-agree-box .m-agree-box-wrap::-webkit-scrollbar {
    width: 3px;
}

.member_accordion .m-agree-box .m-agree-box-wrap::-webkit-scrollbar-thumb {
    background-color: #ebebeb;
}

.member_accordion .m-agree-box .m-agree-box-wrap::-webkit-scrollbar-track {
    background-color: #f9f9f9;
}

.m-agree-chkcont {
    position: relative;
}

.m-agree-chkcont:nth-child(2) {
    border-bottom: none;
}

.m-agree-chkcont .m-agree-btn {
    position: absolute;
    top: -35px;
    right: 0px;
    width: 20px;
    height: 20px;
    padding: 10px;
}

.m-agree-chkcont .m-agree-btn:before,
.m-agree-chkcont .m-agree-btn:after {
    display: block;
    content: "";
    width: 8px;
    height: 1px;
    background: #878787;
    position: absolute;
    top: 50%;
    margin-top: -1px;
    transition: all .3s ease
}

.m-agree-chkcont .m-agree-btn:before {
    transform: rotate(45deg);
    right: 16px;
    z-index: 3
}

.m-agree-chkcont .m-agree-btn:after {
    transform: rotate(-45deg);
    right: 10px;
}

.m-agree-chkcont .m-agree-btn.is-open:before {
    transform: rotate(-45deg)
}

.m-agree-chkcont .m-agree-btn.is-open:after {
    transform: rotate(45deg)
}

/* form */
.form_wrap {
    padding-top: 26px;
}

.form_wrap .form_box .form_title {
    font-size: 15px;
    color: #090909;
    line-height: 21px;
}

.form_wrap .form_box .form_cont {
    margin-top: 7px;
}

.form_wrap .form_box+.form_box {
    margin-top: 20px;
}

.form_wrap .form_box .form_cont .col-input~.col-input,
.form_wrap .form_box .form_cont .ip-btn-wrap~.valid-check,
.form_wrap .form_box .form_cont .input-wrap~.valid-check {
    padding-top: 6px;
}

.form_wrap .form_box .form_title .required:before {
    content: '*';
    display: inline-block;
    margin: 3px 0 0 3px;
    font-size: 14px;
    color: #e62323;
    line-height: 1;
    vertical-align: top;
}


#join_write input {
    background: transparent;
    border-bottom: 1px solid #e0e0e0;
    border-radius: 0;
    padding-left: 0;
    text-indent: 0rem;
}



/* 회원가입 완료 */
.join_completion {
    position: relative;
    text-align: center;
    margin: 50px auto 30px auto;
    max-width: 52px;
}

.join_completion .shop_icon {
    padding-top: 40px;
}

.join_completion .shop_name {
    padding-top: 15px;
    color: #5724cf;
    font-size: 16px;
    font-weight: 500;
}


/********************************************************
* 전체메뉴
*********************************************************/
.nav_menu .accordion-item {
    border: 0
}

.nav_menu .accordion-button {
    background: #f7faff;
    color: #4d4d4d;
    font-size: 16px;
    font-weight: 500;
    border-radius: 10px;
    margin-top: 20px;
}

.nav_menu .accordion-item:nth-child(4) .accordion-button::after,
.nav_menu .accordion-item:nth-child(5) .accordion-button::after {
    background-image: none
}

.nav_menu .accordion-button:not(.collapsed) {
    color: #000;
    font-size: 16px;
    font-weight: 600;
    background: #f7faff;
    box-shadow: none
}

.nav_menu .accordion-body {
    overflow: hidden;
}

.nav_menu .accordion-body a {
    color: #4d4d4d;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    width: 25%;
    float: left
}

.nav_menu .accordion-body a img {
    display: block;
    margin: 7px auto;
    width: 21px;
}


/********************************************************
* 메인
*********************************************************/
/* 산재법 메인 */
.main_visual {
    position: relative;
    background-color: #0583f2;
    padding-top: 30px;
}

.main_visual .inner {
    display: flex;
    justify-content: space-between;
}

.main_visual .inner>div {
    width: 50%
}

.main_visual_txt {
    padding-right: 20px;
}

.main_visual_txt .logo {
    padding-bottom: 20px;
    padding-bottom: 20px;
    margin-top: 10%
}

.main_visual_txt .logo_txt {
    color: #fff;
    margin: 0 0 10px 0;
}

.main_visual_img {
    text-align: right;
}

.main_visual_img img {
    width: 50%
}

.main .contents .inner {
    background: #fff;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
    padding: 30px 25px;
}

.main_menu {
    padding: 25px;
    border-radius: 20px;
    box-shadow: 0px 0px 10px -3px #c1c1c1;
    display: flex;
    margin-bottom: 20px;
}

.main .main_ad {
    padding-bottom: 50px;
}

.main_ad {
    margin: 20px 0 0px 0;
    overflow: hidden;
    padding-bottom: 120px;
}

.main_ad img {
    width: 100%;
    height: 192px;
}

.main_menu .img {
    width: 30%
}

.main_menu .menu_txt {
    width: 70%
}

.main_menu .img {
    text-align: center;
}

.main_menu img {
    width: 59px
}

.main_menu h3 {
    font-size: 16px;
    color: #282828;
    font-weight: 600;
}

.main_menu h3:after {
    content: "\f054";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    float: right;
    line-height: 24px;
    color: #d5d5d5;
}

.main_menu h3 span {
    font-size: 16px;
    color: #9fa4ab;
    font-weight: 400
}

.main_menu a {
    height: 30px;
    line-height: 1;
    font-size: 14px;
    font-weight: 500;
    padding: 6px 5px;
    width: 32.333%
}

.main_menu a.main_link {
    height: auto;
    padding: 0;
    width: 100%;
    display: block;
    padding-bottom: 15px;
}

.main_menu .btn-primary {}

.main_menu .btn-primary-outline {
    border: 1px solid #0583f2;
    color: #0583f2;
}

.main_menu .btn-primary-outline:hover {
    color: #0069c5 !important
}


/* 점포 전체 메뉴 */
.top_name_wrap {
    position: relative;
    display: flex;
    align-items: center;
    background: #5724cf;
    border-radius: 10px;
    height: 60px;
    padding: 0 20px;
}

.top_name_wrap .shop_name {
    color: #fff;
    font-size: 18px;
}

.top_name_wrap .btn_logout {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    text-align: right;
    color: #fff;
    font-size: 13px;
    border-radius: 3px;
    background-color: rgba(255, 255, 255, .2);
    padding: 5px 8px;
}

.nav_wrap {
    position: relative;
    margin-top: 15px;
    border: 1px solid #f6f6f6;
    border-radius: 10px;
    padding: 0 20px;
    min-height: 130px;
}

.nav_wrap .nav_title {
    color: #5724cf;
    font-size: 16px;
    font-weight: 500;
    padding: 20px 0;
}

.nav_wrap .nav_list {
    position: relative;
}

.nav_wrap .nav_list ul li {
    position: relative;
    display: table;
    width: 33.333%;
    float: left;
    text-align: center;
}

.nav_wrap .nav_list ul li:after {
    content: '';
    display: table;
    clear: both;
}

.nav_wrap .nav_list ul li a {
    color: #353535;
    font-size: 13px;
}

.nav_wrap .nav_list ul li span {
    display: block;
    padding-bottom: 10px;
}

/* 특허법 메인 */
.main2 h2 {
    font-size: 22px;
    color: #0583f2;
    font-weight: 600;
    padding-top: 40px;
    margin-bottom: 30px;
}

.main2 .main_radius {
    background: #fff;
    border-radius: 10px;
    margin-bottom: 9px;
    padding: 20px 30px;
}

.my_box .my_img {
    width: 55px;
    display: inline-block;
    margin-right: 20px;
}

#wrap .my_box h5 {
    display: inline-block;
    color: #000;
    font-weight: 500;
    vertical-align: middle;
}

.my_box.main_radius {
    padding: 10px 30px;
}

.ranking_inner.main_radius {
    box-shadow: 0px 0px 6px -3px #c1c1c1;
    margin-bottom: 20px;
}

.main2 .main1_menu .main_radius {
    display: inline-block;
    width: 100%;
    box-shadow: 0px 0px 6px -3px #c1c1c1;
    padding: 14px 30px;
    text-align: center;
}

.ranking_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 15px;
    border-bottom: 1px solid #f2f6ff;
}

.ranking_header .tit {
    color: #6d7782;
    font-size: 16px;
    font-weight: 600;
}

.ranking_header .no {
    color: #0583f2;
    font-size: 15px;
    font-weight: 600;
}

.ranking_header .no span {
    color: #000;
    font-size: 12px;
    font-weight: 600;
}

.ranking_header .ranking_link {
    color: #757575;
    font-size: 10px;
    font-weight: 500;
    background: #f3f3f3;
    padding: 1px 5px;
    border-radius: 0;
}

.ranking_list {
    display: flex;
    justify-content: space-between;
    padding: 20px 0 0 0;
}

.ranking_list .ranking {
    width: 33.3%;
    float: left;
}

.ranking_list .ranking {
    color: #5f5656;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    line-height: 1.5;
}

.ranking_list .ranking span {
    color: #c1c3c2;
    font-size: 12px;
    font-weight: 600;
    display: block;
}

.ranking_list .ranking2 {
    width: 50%;
    float: left;
}

.ranking_list .ranking2 {
    color: #5f5656;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    line-height: 1.5;
}

.ranking_list .ranking2 span {
    color: #c1c3c2;
    font-size: 12px;
    font-weight: 600;
    display: block;
}

.ranking_inner .more {
    text-align: center;
    margin-top: 10px;
}

.ranking_inner .more a {
    color: #b1b8c0;
    padding: 10px;
}

.main2 .main1_menu a {
    color: #0583f2;
    font-size: 15px;
    font-weight: 500
}

.main2 .main1_menu a span {
    width: 21px;
    height: 18px;
    display: inline-block;
    margin-right: 7px;
    vertical-align: middle;
}

.main2 .main1_menu a:hover {
    background: #0583f2;
    color: #fff
}

.main2 .main1_menu a.main1_menu1 span {
    background: url("/images/mainmenu_1.png") no-repeat;
    background-size: 100%;
}

.main2 .main1_menu a.main1_menu2 span {
    background: url("/images/mainmenu_2.png") no-repeat;
    background-size: 100%;
}

.main2 .main1_menu a.main1_menu3 span {
    background: url("/images/mainmenu_3.png") no-repeat;
    background-size: 100%;
}

.main2 .main1_menu a.main1_menu4 span {
    background: url("/images/mainmenu_12.png") no-repeat;
    background-size: 100%;
}

.main2 .main1_menu a.main1_menu5 span {
    background: url("/images/mainmenu_13.png") no-repeat;
    background-size: 100%;
}

.main2 .main1_menu a.main1_menu1:hover span {
    background: url("/images/mainmenu_1_on.png") no-repeat;
    background-size: 100%;
}

.main2 .main1_menu a.main1_menu2:hover span {
    background: url("/images/mainmenu_2_on.png") no-repeat;
    background-size: 100%;
}

.main2 .main1_menu a.main1_menu3:hover span {
    background: url("/images/mainmenu_3_on.png") no-repeat;
    background-size: 100%;
}

.main2 .main1_menu a.main1_menu4:hover span {
    background: url("/images/mainmenu_12_on.png") no-repeat;
    background-size: 100%;
}

.main2 .main1_menu a.main1_menu5:hover span {
    background: url("/images/mainmenu_13_on.png") no-repeat;
    background-size: 100%;
}

/* 순위보기 */
.ranking .nav-tabs {
    border-bottom: 0
}

.ranking .nav {
    justify-content: center;
}

.ranking .nav-tabs .nav-link {
    background: #f7faff;
    color: #9d9d9d;
    font-size: 13px;
    font-weight: 500;
    border-radius: 40px;
    margin-bottom: 10px
}

.ranking .nav-tabs .nav-item.show .nav-link,
.ranking .nav-tabs .nav-link.active {
    color: #fff;
    background: #0583f2
}

.ranking .tab-pane ul {
    overflow: hidden;
    margin-top: 10px;
    padding-left: 0;
    background: #f7faff;
    border-radius: 10px;
}

.ranking .tab-pane ul li {
    padding: 10px;
    border-bottom: 1px solid #fff;
}

.ranking .tab-pane ul li .ranking_no {
    color: #0597f2;
    font-size: 15px;
    font-weight: 500;
    width: 30px;
    float: left;
    display: inline-block;
    text-align: center
}

.ranking .tab-pane ul li .ranking_no img {
    width: 22px
}

.ranking .tab-pane ul li .ranking_name {
    color: #000;
    font-size: 15px;
    font-weight: 600;
    display: inline-block;
    vertical-align: top;
}

.ranking .tab-pane ul li .ranking_score {
    color: #0597f2;
    font-size: 15px;
    font-weight: 500;
    float: right;
    display: inline-block;
    text-align: right;
}

.ranking .tab-pane p {
    font-size: 12px;
    color: #c3c5c4
}

.ranking .tab-pane p i {
    font-size: 12px;
}

.t_right {
    text-align: right
}

/* 랭킹전 참여하기 */
.score_wrap {
    margin-bottom: 20px;
}

.score_wrap h3 {
    font-size: 32px;
    color: #000;
    text-align: center;
    font-weight: 600;
    font-family: Poppins;
}

.count_wrap {
    position: relative;
    margin: 15px 0;
    padding-top: 3px;
}

.count_wrap .progress {
    width: 80%;
    height: 10px;
    background-color: #fff
}

.count_wrap .count {
    position: absolute;
    top: 0;
    right: 0;
    color: #99a9a1;
    font-size: 12px
}

.count_wrap .combo {
    position: absolute;
    left: 50%;
    margin-left: -70px;
    top: -9px;
    font-size: 25px;
    font-family: Poppins;
    font-weight: 800;
    color: #fff;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #0583f2;
    text-shadow: 4px 1px 1px #0583f2;
    font-style: italic;
}

.count_wrap .count span {
    color: #000;
    font-size: 12px
}

.ranking_life_wrap {
    display: flex;
    justify-content: center;
}

.ranking_life_wrap img {
    width: 32px;
    margin: 0 3px
}

.quiz_wrap {
    background: #fff;
    border-radius: 10px;
    padding: 20px;
    min-height: 380px;
}

.quiz_wrap .bg-light {
    color: #6bbef2;
    font-size: 12px;
    background: #f4faff !important;
    padding: 6px 15px;
    border-radius: 15px;
    margin-bottom: 20px;
}

/*.quiz_wrap .quiz_con{font-size:15px; line-height:25px; color:#000;max-height: 300px; overflow-y: auto;}*/
/*20221201 수정*/
.quiz_wrap .quiz_con {
    font-size: 15px;
    line-height: 25px;
    color: #000;
}

.quiz_wrap .quiz_commentary {
    font-size: 15px;
    line-height: 25px;
    color: #000;
    max-height: 300px;
    overflow-y: auto;
}

.ox_wrap {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

.ox_wrap button {
    width: 49%;
    height: 20vh;
    box-shadow: 0px 0px 6px -3px #c1c1c1;
    border-radius: 10px;
}

.ox_wrap button.btn_o {
    background: #fff url("/images/quiz_o.png") no-repeat center center;
    background-size: 100px;
}

.ox_wrap button:hover.btn_o,
.ox_wrap button:active.btn_o {
    background: #0583f2 url("/images/quiz_o_on.png") no-repeat center center;
    background-size: 100px;
}

.ox_wrap button.btn_x {
    background: #fff url("/images/quiz_x.png") no-repeat center center;
    background-size: 100px;
}

.ox_wrap button:hover.btn_x,
.ox_wrap button:active.btn_x {
    background: #0583f2 url("/images/quiz_x_on.png") no-repeat center center;
    background-size: 100px;
}

.ranking .modal-dialog {
    margin-top: 24vh;
}

.ranking .modal-content {
    background-color: transparent;
}

.ranking .modal-content {
    border: 0
}

.ranking .modal-header {
    border-bottom: 0
}

.ranking .btn-close {
    width: 30px;
    height: 30px;
    color: #fff;
    display: none
}

/* 통계집계 */
.statistics .result_wrap {
    margin-top: 40px;
}

.statistics .result_wrap h3 {
    color: #313237;
    font-size: 17px;
}

.statistics .result_wrap h3 span {
    color: #0583f2;
    font-size: 1em;
    font-weight: 600
}

.statis_img {
    background: url("/images/statistics_bg.png") no-repeat center center;
    background-size: 235px;
    padding: 20px 0;
    margin-bottom: 30px;
}


/* 결제내역 */
.pay #container .inner {
    padding-top: 20px;
}

.pay_list_head {
    display: flex;
    justify-content: space-between;
    background: #f5f5f5;
    border-bottom: 2px solid #e8eaed
}

.pay_list_head p,
.pay_list_body p {
    width: 33%;
    text-align: center;
}

.pay_list_body {
    display: flex;
    justify-content: space-between;
    border-bottom: 2px solid #f5f5f5
}

.pay_list_head p {
    color: #878d95;
    font-size: 13px;
    padding: 11px 0;
}

.pay_list_body p {
    color: #323232;
    font-size: 15px;
    padding: 14px 0;
}

.pay_list_body p a {
    color: #0583f2;
    font-size: 12px;
    background: #f4faff;
    padding: 5px 14px;
    border-radius: 15px;
}

.pay_list_body p a:hover,
.pay_list_body p a:active {
    background: #0583f2;
    color: #fff
}

/* 공지사항 */
.top_search_wrap {
    position: relative;
    padding: 20px 0 0 0;
}

.top_search_wrap .put_search input {
    width: 100%;
    height: 45px;
    border: none;
    border-radius: 4px;
    padding: 0 10px;
    background: #f5f5f5 url("/images/top_search_icon.png") no-repeat 97% center;
    font-size: 15px;
    margin: 0 0 32px 0;
}

.top_search_wrap .put_search input::placeholder {
    color: #a5a5a5;
    font-size: 16px;
}

.notice_wrap {
    position: relative;
    padding-bottom: 100px;
}

.notice_list_top {
    position: relative;
    border-top: 1px solid #f5f5f5;
    border-bottom: 1px solid #f5f5f5;
    margin-top: 15px;
    background: #f4faff url("/images/icon_noticelist.png") no-repeat 96% center;
    background-size: 8px;
}

.notice_list_top .top_notice {
    position: relative;
    display: flex;
    align-items: center;
    height: 70px;
}

.notice_list_top a .notice_ico {
    background: #0583f2;
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    width: 40px;
    text-align: center;
    padding: 1px 0;
    border-radius: 4px;
    display: inline-block;
}

.notice_list_top a .notice_text {
    padding-left: 5px;
    color: #000;
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 78%;
    display: inline-block;
    vertical-align: middle;
}

.notice_list {
    position: relative;
    border-bottom: 1px solid #f5f5f5;
    background: url("/images/icon_noticelist.png") no-repeat 96% center;
    background-size: 8px;
}

.notice_list .notice_title {
    font-size: 16px;
    color: #000;
    padding-top: 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.notice_list_top a,
.notice_list a {
    padding: 20px 0px;
    display: block;
}

.pagination {
    position: relative;
    margin: 30px auto 30px !important;
    text-align: center;
    display: block !important;
}

.pagination a {
    position: relative;
    display: inline-block;
    padding: 0;
    margin: 0px 0px;
    font-size: 13px;
    text-align: center;
    color: #373737;
    padding: 5px 12px;
}

.pagination a.on {
    color: #373737;
    font-weight: 500;
    background: #f5f5f5;
    display: inline-block;
    border-radius: 6px;
}

.pagination a:hover:not(.on) {
    color: #373737;
}

.pagination a.page_first,
.pagination a.page_previous,
.pagination a.page_next,
.pagination a.page_end {
    font-size: 28px;
    color: #a3a3a3;
    font-weight: 100;
}

.pagination .prev,
.pagination .next {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 25px;
    border-radius: 50%;
    color: #5c5c5c;
    font-size: 13px;
}

.notice_view_top {
    position: relative;
    padding-top: 20px;
    padding-bottom: 20px;
}

.notice_view_top .notice_title {
    font-size: 17px;
    color: #272727;
    font-weight: 500;
    line-height: 1.2;
}

.notice_view_top .notice_date {
    font-size: 11.5px;
    color: #999898;
    font-weight: 300;
    padding-top: 10px;
}

.super_notice_view_top {
    position: relative;
    padding-top: 20px;
    padding-bottom: 20px;
}

.super_notice_view_top>div {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    padding-top: 10px;
}

.super_notice_view_top>div>.notice_shop {
    font-size: 13px;
    color: #4f4f4f;
    font-weight: 400;
}

.super_notice_view_top>div>.notice_date {
    font-size: 11.5px;
    color: #999898;
    font-weight: 300;
    margin-left: auto;
    text-align: right;
}

.super_notice_view_top>.notice_title {
    display: block;
    font-size: 18px;
    color: #272727;
    font-weight: 500;
    line-height: 1.2;
}

.notice_view_cont {
    position: relative;
    min-height: 76vh;
    padding: 20px 0 60px;
    background: #f9f9f9;
    border-top: 1px solid #ebebeb;
}

.notice_view_cont .file_wrap {
    display: block;
    margin-bottom: 20px;
}

.notice_view_cont .file_wrap .file {
    background: #ededed url("/images/icon_file.png") no-repeat center left;
    background-position: 10px;
    border-radius: 7px;
    padding: 5px 10px 5px 35px;
    font-size: 13px;
    color: #272727;
}

.notice_view_cont .board_btn {
    margin: 20px 0 50px 0;
}

.notice_view_cont .notice_cont {
    position: relative;
    background: #fff;
    border-radius: 7px;
    padding: 20px;
    font-size: 15px;
    color: #272727;
    line-height: 1.4;
}

.notice_view_cont .notice_cont>img {
    width: 100%;
    height: auto;
    border-radius: 5px;
}

.notice_fix_wrap {
    position: fixed;
    bottom: 145px;
    left: 0px;
    right: 0px;
    width: 100%;
    margin: 0 auto;
    max-width: 1030px;
    padding: 0 20px;
}

.notice_fix_wrap .notice_fix {
    width: 100%;
    height: 45px;
    background: #f5f5f5;
    border-radius: 5px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.notice_fix_wrap .notice_fix .fix_text {
    font-size: 16px;
    color: #191919;
    padding-left: 20px;
}

.notice_fix_wrap .notice_fix>.custom-control {
    margin-left: auto;
    text-align: right;
    padding: 0 20px 18px 20px
}

.board_btn {
    margin: 0 auto;
    max-width: 1030px;
    padding: 0 20px;
}

.board_btn .btn_list {
    height: 45px;
    font-size: 16px;
}

.board_btn02 {
    width: 100%;
    margin: 0 auto;
    max-width: 1030px;
    padding: 30px 20px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.board_btn02>button {
    display: inline-block;
}

.board_btn02 .btn_cancle {
    width: 49%;
    height: 45px;
    border-radius: 4px;
}

.board_btn02 .btn_ok {
    width: 49%;
    height: 45px;
    border-radius: 4px;
}

.btn-gray {
    background: #e1e1e1 !important;
    color: #737373 !important
}

.btn-gray:hover {
    background: #bfbfbf !important
}

/* 문의하기 */
.inquiry_wrap {
    position: relative;
    padding-bottom: 90px
}

.inquiry_wrap.pb {
    padding-bottom: 230px
}

.inquiry_list {
    position: relative;
    border-bottom: 1px solid #f5f5f5;
    padding: 10px 0px 10px 20px;
    margin-top: 10px;
    overflow: hidden;
}

.inquiry_list .txt {
    float: left;
    width: 70%
}

.inquiry_list .btn {
    float: right;
    width: 30%;
    text-align: right;
}

.reply {
    width: 70px;
    float: right;
    text-align: center;
    background-color: #f5f5f5;
    border-radius: 4px;
    color: #737373;
    font-size: 12px;
    padding: 5px 10px;
    font-weight: 500;
}

.reply_cont_wrap .reply {
    background-color: #fff;
}

.reply_ok {
    width: 70px;
    float: right;
    text-align: center;
    background-color: #0583f2;
    border-radius: 4px;
    color: #fff;
    font-size: 12px;
    padding: 5px 10px;
    font-weight: 500;
}

.inquiry_list a .top {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.reply_btn {
    overflow: hidden;
}

.reply_cont_wrap {
    clear: both;
    padding-top: 20px;
}

.inquiry_list .inquiry_date {
    font-size: 11.5px;
    color: #b6bcc5;
    text-align: left;
}

.inquiry_list .inquiry_title {
    font-size: 16px;
    color: #272727;
    padding: 5px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inquiry_wrap input.writer_title {
    font-size: 16px;
    width: 100%;
    border: 1px solid #f4f4f4;
    border-radius: 5px;
    height: 42px;
    line-height: 40px;
    padding-left: 10px;
}

.notice_view_cont .form_cont>textarea {
    background: #fff;
    padding: 20px
}

.reply_cont_wrap .tit_wrap {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    margin-top: 30px;
}

.reply_cont_wrap .tit_wrap>.reply_tit {
    font-size: 16px;
    color: #333333;
    font-weight: 500;
}

.reply_cont_wrap .reply_cont {
    background: #fff;
    border-radius: 7px;
    padding: 20px;
    font-size: 15px;
    color: #272727;
    margin-top: 10px;
    line-height: 1.4;
}

.reply_cont_wrap .tit_wrap>.reply_ok {
    text-align: right;
}


/* 회원정보 */
.mem_setting_wrap {
    position: fixed;
    z-index: 999;
    width: 100px;
    inset: 0 20px 0 auto;
}

.memberinfo_wrap {
    position: relative;
    padding-top: 15px;
    padding-bottom: 100px;
}

.mem_title_wrap {
    height: 55px;
    display: flex;
    align-items: center;
}

.mem_title_wrap .mem_title {
    color: #232323;
    font-size: 18px;
    font-weight: 500;
}

.mem_title_wrap .mem_btn {
    margin-left: auto;
    text-align: right;
    padding: 0 10px;
    height: 27px;
    border-radius: 3.5px;
}

.mem_title_wrap .mem_btn a {
    color: #fff;
    font-size: 13px;
    line-height: 24px;
}

.mem_cont_wrap {
    position: relative;
    border-radius: 12.5px;
    color: #5c5c5c;
    border: 1px solid #ececec;
}

.mem_cont_wrap {
    position: relative;
    padding: 20px 17px;
    background: #fff;
}

.mem_cont_wrap .mem_list {
    padding-top: 20px;
}

.mem_cont_wrap .mem_list:first-child {
    padding-top: 0px;
}

.mem_cont_wrap .mem_list>.tit {
    font-size: 13px;
    color: #8a8a8a;
}

.mem_cont_wrap .mem_list>.txt {
    font-size: 15px;
    color: #222222;
    padding-top: 10px;
}

.mem_cont_wrap .mem_list>.txt img {
    width: 100px
}

.mem_cont_wrap .mem_list .tit {
    width: 40%;
    display: inline-block;
    vertical-align: top;
}

.mem_cont_wrap .mem_list .txt {
    width: 60%;
    display: inline-block;
    vertical-align: top;
    padding-top: 0
}


.membermodify_wrap .mem_modify>.put_inner img {
    width: 55px
}

.mypage .modal.show .modal-dialog {
    margin-top: 24vh;
}

.mypage_pass input {
    margin: 15px 0
}



.membermodify_wrap {
    position: relative;
    padding-bottom: 30px;
}

.membermodify_wrap .mem_modify>.tit {
    font-size: 15px;
    color: #090909;
    padding-top: 20px;
}

.membermodify_wrap .mem_modify>.put_inner {
    position: relative;
    margin-top: 10px;
}

.membermodify_wrap .mem_modify>.put_inner input {
    width: 100%;
    height: 45px;
    border: 1px solid #f2f2f2;
    border-radius: 5px;
}

.membermodify_wrap .mem_modify>.put_inner.point input {
    background-color: #f9f9f9;
}

.membermodify_wrap .mem_modify>.put_inner input::placeholder {
    color: #282828;
    font-size: 16px;
}

.membermodify_wrap .mem_modify>.put_inner:first-of-type {
    margin-top: 0;
}

.membermodify_wrap .mem_modify>.put_inner.profile_img {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.membermodify_wrap .mem_modify>.put_inner span {
    display: inline-block;
}

.membermodify_wrap .mem_modify>.put_inner input[type="radio"] {
    height: 16px;
    width: 16px;
    margin: 5px auto;
    display: block;
}

/* 알림설정 */
.set_wrap {
    position: relative;
}

.set_wrap::before {
    content: "";
    clear: both;
    display: table;
}

.shop_switch {
    position: relative;
    height: 55px;
    display: flex;
    align-items: center;
}

.shop_switch .text {
    position: relative;
    color: #232323;
    font-size: 16px;
}

.shop_switch .toggle_switch {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    text-align: right;
}

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 28px;
}

.switch input {
    position: relative;
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ececec;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 24px;
    width: 24px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked+.slider {
    background-color: #0583f2
}

input:checked:before {
    position: absolute;
    content: "off";
    display: none
}

input:focus+.slider {
    box-shadow: 0 0 1px #0583f2
}

input:checked+.slider:before {
    -webkit-transform: translateX(32px);
    -ms-transform: translateX(32px);
    transform: translateX(32px);
}

.slider.round {
    border-radius: 28px;
}

.slider.round:before {
    border-radius: 50%;
}

.switch_text {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 10;

    width: 100%;
    display: inline-block;
    font-size: 0px;
    text-align: left;
}

.switch_text .t_on {
    font-size: 13px;
    color: #fff;
    display: inline-block;
    width: 50%;
    line-height: 28px;
    text-align: center;
    visibility: hidden;
}

.switch_text .t_off {
    font-size: 13px;
    color: #a1a1a1;
    padding-left: 6px;
    display: inline-block;
    width: 50%;
    line-height: 28px;
    text-align: center;
    visibility: visible;
}

input:checked+.slider .switch_text .t_on {
   visibility: visible;
}
input:checked+.slider .switch_text .t_off {
   visibility: hidden;
}
.sub .member_bt {
    line-height: 40px
}

.shop_group {
    padding: 20px 0 10px 0;
}

.shop_group>.mem_title {
    font-weight: 600;
    font-size: 18px;
}

.set_wrap>hr {
    color: #999;
}



/* 정보 */
.set_info_wrap {
    position: relative;
    border-bottom: 1px solid #f3f3f3;
}

.set_info_wrap::before {
    content: "";
    clear: both;
    display: table;
}

.set_info {
    position: relative;
    height: 55px;
    display: flex;
    align-items: center;
}

.set_info>.title {
    position: relative;
    font-size: 16px;
    color: #232323;
}

.set_info>.go_btn {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    text-align: right;
    font-size: 10px;
    color: #333;
}

.set_info>.go_btn>.xi-angle-right {
    font-size: 9px;
    color: #686868
}

.set_info>.go_btn>.go_btn_icon {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #ededed;
    transition: background-color .3s;
}


/* 주문 리스트 */
.order_pick_list_wrap {
    position: relative;
    padding-bottom: 130px
}

.order_pick_list {
    position: relative;
    margin-top: 20px;
    height: 43px;
    display: flex;
    align-items: center;
}

.order_pick_list .pick_list_num {
    font-size: 15px;
    color: #272727;
}

.order_pick_list .pick_list_num strong {
    font-weight: 600;
}

.pick_list_select {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    text-align: right;
}

.pick_list_select>.nice-select {
    border-radius: 0;
    border: none;
    font-size: 13px;
    color: #272727;
    height: 28px;
    line-height: 26px;
}

.pick_list_select>.nice-select .option {
    font-size: 13px;
    line-height: 30px;
    min-height: 30px;
    padding-left: 17px;
    padding-right: 17px;
}

.order_product_list {
    position: relative;
    border-top: 1px solid #f4f4f4;
    padding: 15px 0;
}

.order_product_list>.inner {
    position: relative;
    display: flex;
}

.order_product_list .list_thumbnail {
    max-width: 100px;
}

.order_product_list .list_thumbnail img {
    border-radius: 5px;
    max-width: 100px;
    max-height: 100px;
}

.order_product_list .list_cont_right {
    position: relative;
    flex: 1;
    margin-left: 20px;
    width: 60%;
}

.order_product_list .list_cont_right>.p_title {
    font-size: 16px;
    color: #2a2a2a;
    width: 100%;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 20px;
}

.order_product_list .list_cont_right .amount_box {
    position: relative;
    display: flex;
    align-items: center;
    margin-top: 20px;
}

.order_product_list .list_cont_right .amount_box .amount {
    display: table-cell;
}

.order_product_list .list_cont_right .amount_box .amount>button.amount_icon {
    position: relative;
    width: 22px;
    height: 22px;
    border: 1px solid #f4f4f4;
    color: #a5a5a5;
    background-color: #fff;
    border-radius: 50%;
}

.order_product_list .list_cont_right .amount_box .amount>input {
    color: #2a2a2a;
    font-size: 12px;
    width: 40px;
    border: 0;
    text-align: center;
}

.order_product_list .list_cont_right .amount_box .pay {
    margin-left: auto;
    text-align: right;
    color: #535353;
    font-size: 13px;
}

.order_product_list .list_cont_right .amount_box .pay strong {
    font-weight: 500;
    color: #2a2a2a;
    font-size: 16px;
}

.order_product_list .list_cont_right>.btn_cart {
    width: 85px;
    margin-left: auto;
    text-align: right;
    text-align: center;
    height: 27px;
    border-radius: 3px;
    background-color: #5724cf;
    margin-top: 15px;
}

.order_product_list .list_cont_right>.btn_cart a {
    color: #fff;
    font-size: 13px;
    line-height: 24px;
}

.cart_popup {
    position: fixed;
    left: 50%;
    top: 50%;
    margin-top: -70px;
    margin-left: -70px;
    z-index: 9999;
}

.cart_popup .pop_inbox {
    width: 140px;
    height: 140px;
    background-color: #5724cf;
    border-radius: 50%;
    overflow: auto;
    text-align: center;
}

.cart_popup .pop_inbox>img {
    padding: 30px 0 12px;
}

.cart_popup .pop_inbox>p {
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
}

.cart_fot_warp {
    position: fixed;
    bottom: 65px;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 50px;
    line-height: 50px;
    background-color: #e35c5c;
}

.cart_fot_warp .cart_fot.inner {
    position: relative;
    display: flex;
    align-items: center;
}

.cart_fot_warp .cart_fot.inner>.pick {
    color: #fff;
    flex: 1;
    font-size: 16px;
}

.cart_fot_warp .cart_fot.inner>.pay {
    position: relative;
    color: #fff;
    font-size: 16px;
    margin-right: 30px;
}

.cart_fot_warp .cart_fot.inner>.pay strong {
    font-weight: 700;
}

.cart_fot_warp .cart_fot.inner>.btn_order {
    position: relative;
}

.cart_fot_warp .cart_fot.inner>.btn_order a {
    color: #fff;
    font-size: 14px;
    font-weight: 300;
}

/* 장바구니 */
.total_pick_top {
    position: relative;
    border-bottom: 8px solid #f5f5f5;
}

.total_pick_top .total_pick {
    position: relative;
    margin-top: 20px;
    height: 43px;
    display: flex;
    align-items: center;
}

.total_pick_top .total_pick .btn_delete {
    margin-left: auto;
    text-align: right;
    text-align: center;
    height: 27px;
    border-radius: 3px;
    padding: 0 10px;
    background-color: #f7f7f7;
}

.total_pick_top .total_pick .btn_delete a {
    color: #7e7e7e;
    font-size: 13px;
    line-height: 24px;
}

.pick_product_list {
    position: relative;
    display: flex;
}

.pick_product_list .pick_product_cont {
    position: relative;
    flex: 1;
    padding: 15px 0;
    border-bottom: 1px solid #f9f9f9;
    width: 90%;
    padding-right: 30px;
}

.pick_product_list .pick_product_cont:after {
    clear: both;
    display: block;
    content: "";
}

.pick_product_list .pick_product_cont>.p_title {
    font-size: 15px;
    color: #222a2a;
    display: block;
    padding: 2px 0 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pick_product_list .pick_product_cont>.list_thumbnail {
    float: left;
    margin-right: 15px;
}

.pick_product_list .pick_product_cont>.list_thumbnail img {
    border-radius: 5px;
    max-width: 65px;
    max-height: 65px;
}

.pick_product_list .pick_product_cont>.pay {
    color: #535353;
    font-size: 13px;
    padding: 5px 0 16px;
}

.pick_product_list .pick_product_cont>.pay strong {
    font-weight: 500;
    color: #2a2a2a;
    font-size: 15px;
}

.pick_product_list .pick_product_cont .amount {
    display: table-cell;
    height: 28px;
    border: 1px solid #f6f6f6;
    border-radius: 4px;
}

.pick_product_list .pick_product_cont .amount>button.amount_icon {
    position: relative;
    width: 22px;
    height: 22px;
    color: #dcdcdc;
}

.pick_product_list .pick_product_cont .amount>input {
    color: #2a2a2a;
    font-size: 12px;
    width: 40px;
    border: 0;
    text-align: center;
}

.pick_product_list .pick_product_cont>.btn_delete2 {
    position: absolute;
    right: 0;
    top: 15px;
    width: 15px;
    height: 15px;
}

.total_pay_wrap {
    position: relative;
    border-top: 8px solid #f5f5f5;
    padding: 20px 0 170px;
}

.total_pay_wrap>.inner {
    position: relative;
    display: flex;
}

.total_pay_wrap>.inner>.total_title {
    color: #161515;
    font-size: 15px;
}

.total_pay_wrap>.inner>.total_pay {
    margin-left: auto;
    text-align: right;
    color: #535353;
    font-size: 13px;
}

.total_pay_wrap>.inner>.total_pay strong {
    color: #2a2a2a;
    font-size: 16px;
    font-weight: 700;
}

.total_pay_wrap2 {
    position: relative;
    border-bottom: 8px solid #f5f5f5;
    padding: 20px 0;
}

.total_pay_wrap2>.inner {
    position: relative;
    display: flex;
}

.total_pay_wrap2>.inner>.total_title {
    color: #161515;
    font-size: 15px;
}

.total_pay_wrap2>.inner>.total_pay {
    margin-left: auto;
    text-align: right;
    color: #535353;
    font-size: 13px;
}

.total_pay_wrap2>.inner>.total_pay strong {
    color: #2a2a2a;
    font-size: 16px;
    font-weight: 700;
}

.total_pay_wrap3 {
    position: relative;
    border-top: 8px solid #f5f5f5;
}

.total_pay_wrap3>.inner {
    position: relative;
    display: flex;
    padding: 15px 20px 0;
}

.total_pay_wrap3>.inner>h4 {
    font-size: 15px;
    color: #161515;
    font-weight: 500;
    display: block;
}

.total_pay_wrap3>.inner>.total_title {
    color: #575757;
    font-size: 14px;
}

.total_pay_wrap3>.inner>.total_pay {
    margin-left: auto;
    text-align: right;
    color: #535353;
    font-size: 13px;
}

.total_pay_wrap3>.inner>.total_pay strong {
    color: #2a2a2a;
    font-size: 15px;
}

.total_pay_wrap4 {
    position: relative;
    border-top: 8px solid #f5f5f5;
    margin-top: 20px;
}

.total_pay_wrap4>.inner {
    position: relative;
    display: flex;
    padding: 15px 20px 0;
}

.total_pay_wrap4>.inner>.total_title {
    font-size: 15px;
    color: #161515;
    font-weight: 500;
}

.total_pay_wrap4>.inner>.total_pay {
    margin-left: auto;
    text-align: right;
    color: #535353;
    font-size: 13px;
}

.total_pay_wrap4>.inner>.total_pay strong {
    color: #2a2a2a;
    font-size: 16px;
    font-weight: 700;
}


.btn_order_bom {
    position: fixed;
    bottom: 85px;
    left: 0px;
    right: 0px;
    width: 100%;
    margin: 0 auto;
    max-width: 1030px;
    padding: 0 20px;
}


/* 주문서 작성 */
.shop_order_form_wrap {
    position: relative;
    width: 100%;
}

.shop_order_form_wrap .accordion dl {
    position: relative;
    border-bottom: 1px solid #f3f3f3;
}

.shop_order_form_wrap .accordion dl:first-child {
    border-top: 0;
}

.shop_order_form_wrap .accordion dl:before {
    display: none;
}

.shop_order_form_wrap .accordion dt {
    position: relative;
    border-bottom: 1px solid #f3f3f3;
}

.shop_order_form_wrap .accordion dt a {
    position: relative;
    margin: 0 auto;
    max-width: 1030px;
    padding: 0 20px;
    display: block;
    font-size: 15px;
    color: #161515;
    cursor: pointer;
    height: 48px;
    line-height: 48px;
}

.shop_order_form_wrap .accordion dt .class {
    display: none;
}

.shop_order_form_wrap .accordion dt:first-child {}

.shop_order_form_wrap .accordion dt a:after {
    content: "\e941";
    font-family: xeicon;
    font-size: 13px;
    color: #777;
    float: right;
}

.shop_order_form_wrap .accordion dl.state-on dt a:after {
    content: "\e944";
}

.shop_order_form_wrap .accordion dd {
    display: none;
    position: relative;
}

.shop_order_form_wrap .accordion dl dd:before {
    display: none;
}

.shop_order_form_wrap .pick_product_list2 {
    position: relative;
    display: flex;
    padding: 15px 20px;
    border-top: 1px solid #f9f9f9;
}

.shop_order_form_wrap .pick_product_list2:first-child {
    border-top: 0;
}

.shop_order_form_wrap .pick_product_list2:after {
    clear: both;
    display: block;
    content: "";
}

.shop_order_form_wrap .pick_product_list2>.list_thumbnail {
    float: left;
    margin-right: 15px;
    max-width: 55px;
}

.shop_order_form_wrap .pick_product_list2>.list_thumbnail img {
    border-radius: 5px;
    max-width: 55px;
    max-height: 55px;
}

.shop_order_form_wrap .pick_product_list2 .pick_product_cont2 {
    width: 78%;
}

.shop_order_form_wrap .pick_product_list2 .pick_product_cont2>.p_title {
    font-size: 14px;
    color: #2a2a2a;
    display: block;
    padding: 5px 0 7px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 20px;
}

.shop_order_form_wrap .pick_product_list2 .pick_product_cont2>.pay_box {
    position: relative;
}

.shop_order_form_wrap .pick_product_list2 .pick_product_cont2>.pay_box span {
    position: relative;
    color: #535353;
    font-size: 14px;
    padding-right: 20px;
}

.shop_order_form_wrap .pick_product_list2 .pick_product_cont2>.pay_box span::after {
    content: '';
    width: 1px;
    height: 11px;
    background: #f2f2f2;
    position: absolute;
    top: 5px;
    left: -12px;
}

.shop_order_form_wrap .pick_product_list2 .pick_product_cont2>.pay_box span:first-child::after {
    display: none;
}

.shop_order_form_wrap .pick_product_list2 .pick_product_cont2>.pay_box span strong {
    font-weight: 700;
    color: #2a2a2a;
    font-size: 15px;
}

.shop_order_form_cont {
    position: relative;
    margin-top: 20px;
}

.pay_btn {
    position: relative;
    width: 100%;
    margin: 0 auto;
    max-width: 1030px;
    padding-bottom: 200px;
    display: flex;
    flex-wrap: wrap;
}

.pay_btn>button {
    display: inline-block
}

.pay_btn .btn01 {
    width: 49.5%;
    height: 42px;
    line-height: 40px;
    background: #fff;
    border: 1px solid #a58ae5;
    border-radius: 3px;
    color: #5724cf;
    font-size: 14px;
    margin-right: 0.5%;
}

.pay_btn .btn02 {
    width: 49.5%;
    height: 42px;
    line-height: 40px;
    background: #fff;
    border: 1px solid #f2f2f2;
    border-radius: 3px;
    color: #353535;
    font-size: 14px;
    margin-left: 0.5%;
}


/* 주문내역조회 */
.calendar_wrap {
    position: relative;
    margin: 30px auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.calendar_wrap input.calendar_input {
    font-size: 15px;
    color: #444444;
    border: 1px solid #f8f8f8;
    border-radius: 5px;
    height: 42px;
    line-height: 40px;
    text-align: center;
    margin: 0 10px;
}

.calendar_wrap button.btn_calendar {
    font-size: 15px;
    color: #444444;
    border: 1px solid #f8f8f8;
    border-radius: 5px;
    width: 42px;
    height: 42px;
    line-height: 40px;
    text-align: center;
}

.custom-control_wrap {
    background: #fafafa;
    padding: 15px 30px;
}

.custom-control_wrap .custom-control-label::before,
.custom-control_wrap .custom-control-input:checked~.custom-control-label::before {
    top: 17px
}

.custom-control {
    position: relative;
    display: block;
    padding-left: 40px;
    margin: 15px 0px
}

.custom-control-input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

.custom-control-input:checked~.custom-control-label::before {
    content: '';
    position: absolute;
    display: block;
    width: 20px;
    height: 20px;
    top: 5px;
    left: 10px;
    background: url("/images/icon_join_ch_on.png");
}

.custom-control-label::before {
    content: '';
    position: absolute;
    display: block;
    width: 20px;
    height: 20px;
    top: 1px;
    left: 10px;
    background: url("/images/icon_join_ch.png");
}

.custom-control-label {
    width: 100%;
    font-size: 15px;
    color: #0c0c0c;
    line-height: 20px;
}


/* 주문상세내역 */
.order_view_wrap {
    position: relative;
    height: 48px;
    line-height: 48px;
    border-bottom: 1px solid #f3f3f3;
}

.order_view_wrap p {
    color: #161515;
    font-size: 15px;
    font-weight: 500;
}

.pay_info_wrap {
    position: relative;
    border-top: 8px solid #f5f5f5;
    margin-top: 20px;
}

.pay_info_wrap>h4 {
    position: relative;
    margin: 0 auto;
    max-width: 1030px;
    font-size: 15px;
    color: #5724cf;
    font-weight: 500;
    display: block;
    padding: 10px 20px;
}

.pay_info_wrap>.inner {
    position: relative;
    width: 100%;
    line-height: 1.4;
}

.pay_info_wrap>.inner>.title {
    font-size: 13px;
    color: #161515;
    min-width: 70px;
    display: inline-block;
}

.pay_info_wrap>.inner>.text {
    font-size: 13px;
    color: #252525;
    text-align: left;
    display: inline-block;
}


/* 스케줄 */
.schedule_calendar {
    position: relative;
}

.schedule_calendar>.year {
    font-size: 17px;
    color: #353535;
    font-weight: 700;
    padding: 30px 0;
    text-align: center;
}

.schedule_calendar>.month_list {
    position: relative;
    margin: 0 auto;
    width: 90%;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    justify-content: space-between;
    text-align: center;
}

.schedule_calendar>.month_list a {
    font-size: 17px;
    color: #acacac;
    font-weight: 300;
}

.schedule_calendar>.month_list a.on {
    font-size: 33px;
    color: #5724cf;
    font-weight: 700;
}

.schedule_calendar>.month_list>button {
    color: #575757;
    font-size: 18px;
}

.button-prev {
    position: absolute;
    top: 50%;
    left: 0;
    width: 27px;
    height: 44px;
    margin-top: 30px;
    z-index: 10;
    cursor: pointer;
    background-size: 27px 44px;
    background-position: center;
    background-repeat: no-repeat
}

.button-next {
    position: absolute;
    top: 50%;
    right: 0;
    width: 27px;
    height: 44px;
    margin-top: 30px;
    z-index: 10;
    cursor: pointer;
    background-size: 27px 44px;
    background-position: center;
    background-repeat: no-repeat
}

.schedule_wrap {
    position: relative;
    margin-top: 40px;
    padding: 0 20px 100px;
}

.schedule_wrap.inner {
    position: relative;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
}

.schedule {
    position: relative;
    border-radius: 12.5px;
    width: 49%;
    background-color: #f7f7f7;
    text-align: center;
    margin: 7px 0;
}

.schedule.on {
    background-color: #6b3fd5;
}

.schedule a>.day {
    font-size: 13px;
    color: rgba(139, 139, 139, .6);
    padding: 20px 0 30px;
}

.schedule a>.date {
    font-size: 33px;
    color: #8d8d8d;
    font-weight: 500;
}

.schedule a>.condition {
    font-size: 15px;
    color: #8d8d8d;
    font-weight: 500;
    padding: 30px 0 20px;
}

.schedule.on a>.day {
    color: rgba(255, 255, 255, .6);
}

.schedule.on a>.date {
    color: #fff;
}

.schedule.on a>.condition {
    color: #fff;
}

.schedule_view {
    position: relative;
    width: 100%;
    padding-top: 30px;
}

.schedule_view::after {
    content: " ";
    clear: both;
    display: block;
}

.schedule_view .day_box {
    border-radius: 12.5px;
    background-color: #f9f9f9;
    text-align: center;
    padding: 25px 0;
}

.schedule_view .day_box>.year {
    font-size: 18px;
    color: #1f1f1f;
    font-family: 300;
}

.schedule_view .day_box>.date {
    font-size: 21px;
    color: #1f1f1f;
    font-family: 500;
    padding-left: 10px;
}

.schedule_view .day_box>.condition {
    font-size: 15px;
    color: #5724cf;
    font-weight: 500;
    padding-top: 15px;
}

.schedule_view_cont {
    position: relative;
    width: 100%;
}

.schedule_view_cont>h4 {
    font-size: 16px;
    color: #333333;
    font-weight: 500;
    display: block;
    padding: 30px 0 10px;
}

.schedule_view_cont>.form_cont {
    border-radius: 5px;
    background-color: #f9f9f9;
    font-size: 14px;
    padding: 15px;
    color: #777
}

.schedule_view_cont>.form_record {
    min-height: 70px;
    border-radius: 5px;
    background-color: #fff;
    font-size: 13px;
    padding: 15px;
    color: #b1b1b1;
    border: 1px solid #f4f4f4;
    margin-bottom: 180px;
}

/* 체크리스트 */
.checklist_wrap {
    position: relative;
    margin-top: 40px;
    padding: 0 20px 170px;
}

.checklist_wrap.inner {
    position: relative;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
}

.checklist {
    position: relative;
    border-radius: 12.5px;
    border: 1px solid #e7e7e7;
    width: 49%;
    background-color: #fff;
    text-align: center;
    margin: 7px 0;
}

.checklist a>.day {
    font-size: 13px;
    color: rgba(132, 132, 132, .7);
    padding: 20px 0 30px;
}

.checklist a>.date {
    font-size: 33px;
    color: #191919;
    font-weight: 500;
}

.checklist a>.supervisor {
    font-size: 14px;
    color: #5724cf;
    padding: 30px 0 20px;
}

.checklist a>.shop {
    font-size: 14px;
    color: #fc690d;
    padding: 30px 0 20px;
}


/* 체크리스트 상세 */
.checklist_top {
    position: relative;
    padding-top: 30px;
    color: #5724cf;
    font-size: 19px;
    font-weight: 500;
}

.checklist_top>span.c_point {
    display: inline-block;
    border-radius: 5px;
    border: 1px solid #a68be6;
    font-size: 14px;
    color: #5724cf;
    margin-left: 10px;
    padding: 5px;
}

.checklist_top_date {
    font-size: 16px;
    color: #333333;
    font-weight: 500;
    display: block;
    padding: 30px 20px 20px;
}

.checklist_select_title {
    border-radius: 5px;
    width: 100%;
    font-size: 16px;
    color: #fff;
    font-weight: 500;
    padding: 15px;
    text-align: center;
    margin: 10px 0 20px;
}

.checklist_select_title.box01 {
    background-color: #5724cf;
}

.checklist_select_title.box02 {
    background-color: #24cf3c;
    margin-top: 50px;
}

.checklist_select_title.box03 {
    background-color: #8b07c8;
    margin-top: 50px;
}

.checklist_select_title.box04 {
    background-color: #da6100;
    margin-top: 50px;
}

.checklist_select_wrap {
    position: relative;
    margin-bottom: 20px;
}

.checklist_select_wrap::after {
    content: " ";
    clear: both;
    display: block;
}

.checklist_select_wrap>.question {
    border-radius: 5px;
    width: 100%;
    background-color: #f9f9f9;
    border: 1px solid #efefef;
    font-size: 12px;
    color: #666666;
    font-weight: 500;
    padding: 10px;
    line-height: 1.4;
}

.checklist_select_wrap>.check_select_box {
    position: relative;
    border-radius: 5px;
    width: 100%;
    border: 1px solid #efefef;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    justify-content: space-between;
    margin-top: 5px;
}

.checklist_select_wrap>.check_select_box>label {
    position: relative;
    height: 35px;
    text-align: center;
    width: 20%;
}

.checklist_select_wrap>.check_select_box>label::after {
    content: '';
    width: 1px;
    height: 100%;
    background: #efefef;
    position: absolute;
    top: 0;
    left: 0px
}

.checklist_select_wrap>.check_select_box>label:first-child::after {
    display: none;
}

.self_check input[type="radio"] {
    display: none;
}

.self_check input[type="radio"]+span {
    display: inline-block;
    background: none;
    font-size: 12px;
    line-height: 35px;
}

.self_check input[type="radio"]+span.check5 {
    color: #0078ff;
}

.self_check input[type="radio"]+span.check4 {
    color: #2ea4ff;
}

.self_check input[type="radio"]+span.check3 {
    color: #666666;
}

.self_check input[type="radio"]+span.check2 {
    color: #da6100;
}

.self_check input[type="radio"]+span.check1 {
    color: #da0000;
}

.self_check input[type="radio"]:checked+span {
    background-color: #0078ff;
    color: #fff;
    width: 100%;
}

.self_check input[type="radio"]:checked+span.check5 {
    background-color: #0078ff;
    color: #fff;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.self_check input[type="radio"]:checked+span.check4 {
    background-color: #2ea4ff;
    color: #fff;
}

.self_check input[type="radio"]:checked+span.check3 {
    background-color: #222222;
    color: #fff;
}

.self_check input[type="radio"]:checked+span.check2 {
    background-color: #da6100;
    color: #fff;
}

.self_check input[type="radio"]:checked+span.check1 {
    background-color: #da0000;
    color: #fff;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.filebox {
    position: relative;
    width: 100%;
    margin-top: 10px;
}

.filebox:first-child {
    padding-top: 0px;
}

.filebox label {
    width: 100%;
    text-align: center;
    display: inline-block;
    padding: 10px 0;
    color: #636363;
    font-size: 14px;
    line-height: normal;
    vertical-align: middle;
    background-color: #fff;
    cursor: pointer;
    border: 1px solid #eaeaea;
    border-radius: 5px;
}

.filebox input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.file_cont {
    position: relative;
    width: 100%;
    margin-top: 10px;
}

.file_cont>img {
    width: 100%;
    max-width: 140px;
    height: auto;
    border-radius: 5px;
}

.checklist_writer {
    position: relative;
    padding-bottom: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.checklist_writer>input.writer_name {
    font-size: 13px;
    width: 100%;
    color: #b1b1b1;
    border: 1px solid #f4f4f4;
    border-radius: 5px;
    height: 42px;
    line-height: 40px;
    padding-left: 10px;
}

.checklist_writer>button.btn_writer {
    font-size: 14px;
    color: #5724cf;
    border: 1px solid #b199e9;
    border-radius: 5px;
    width: 90px;
    height: 42px;
    line-height: 40px;
    text-align: center;
    margin-left: 5px;
}

.checklist_writer2 {
    position: relative;
    margin-bottom: 180px;
    padding: 15px;
    border: 1px solid #f2f2f2;
    border-radius: 5px;
}

.checklist_writer2>span {
    display: inline-block;
}

.checklist_writer2>span.name {
    font-size: 14px;
    color: #272626;
    text-align: left;
}

.checklist_writer2>span.shop_m {
    font-size: 14px;
    color: #5724cf;
    float: right;
}


#wrap.sub.h100 #container {
    /* height: calc(100vh - 55px); */
}

/* btn */
.sub .btn {
    border-radius: 10px;
}

.sub .btn-shadow {
    box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 15%);
}

.sub .btn-gray2 {
    background-color: #ededed;
    color: #737373;
    height: 52px;
}

.info_box {
    display: flex;
    background: #fff;
    border-radius: 10px;
    padding: 20px;
    min-height: 250px;
    align-content: center;
    justify-content: center;
    align-items: center;
}

.quiz_wrap .text-primary {
    color: #0583f2 !important;
}

.accordion-style {}

.accordion-style .accordion-button,
.accordion-style .accordion-button:not(.collapsed) {
    background: #f7faff;
    box-shadow: none;
    color: #888;
    font-weight: 500;
    font-size: 18px;
    border-radius: 10px !important;
}

.accordion-style .accordion-button:not(.collapsed) {
    color: #313237;
}

.accordion-style .accordion-button::after,
.accordion-style .accordion-button::before {
    position: absolute;
    content: '';
    margin: 0;
    background-color: #0583f2;
    background-image: none;
}

.accordion-style .accordion-button:not(.collapsed)::after,
.accordion-style .accordion-button:not(.collapsed)::before {
    transform: inherit;
}

.accordion-style .accordion-button::after {
    right: 1.25rem;
    width: 19px;
    height: 2px;
    transform: inherit;
}

.accordion-style .accordion-button::before {
    right: 1.25rem;
    width: 2px;
    height: 19px;
    margin-right: 8px;
}

.accordion-button:not(.collapsed)::before {
    display: none;
}

.accordion-style .accordion-item {
    border: none;
}

.accordion-style .accordion-item+.accordion-item {
    margin-top: 15px;
}

.accordion-style .accordion-body {
    padding: 0;
}

/* 바튼 모달 */
.sub .bottom-modal {
    top: inherit;
    bottom: 0;
    height: inherit;
}

.sub .bottom-modal.show {
    display: block;
}

.sub .bottom-modal .modal-dialog {
    margin: 0;
}

.sub .bottom-modal .modal-content {
    border-radius: 40px 40px 0 0;
    border: none;
}

.sub .bottom-modal.fade .modal-dialog {
    transform: translate(0, 50px);
    max-width: inherit;
}

.sub .bottom-modal.fade.show .modal-dialog {
    transform: none;
}

.sub .bottom-modal .modal-header {
    position: relative;
    justify-content: center;
    border-bottom: none;
    align-items: flex-end;
    min-height: 70px;
    padding: 0;
}

.sub .bottom-modal .modal-header .modal-title {
    font-size: 18px;
}

.sub .bottom-modal .modal-header .btn-close {
    margin: 0;
    position: absolute;
    top: 15px;
    right: 20px;
}

.sub .bottom-modal .modal-body {
    padding: 10px 30px 20px;
}

.sub .bottom-modal .modal-body textarea {
    border: none;
    background: #f5f5f5;
    width: 100%;
    border-radius: 11px;
    min-height: 190px;
    padding: 15px;
}

.sub .bottom-modal .modal-body .info-text {
    text-align: center;
    color: #60607a;
}

.sub .bottom-modal .modal-body .info-img {
    display: block;
    margin: 30px auto 10px;
    max-width: 130px;
}

.sub .bottom-modal .modal-footer {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin-left: -3px;
    margin-right: -3px;
    border-top: none;
    padding: 0 30px 30px;
}

.sub .bottom-modal .modal-footer>button {
    flex: 1 1 auto;
    width: auto;
    max-width: 100%;
    margin: 0 3px;
    line-height: 1.1;
    font-size: 16px;
    padding: 10px 10px;
    height: 42px;
    border-radius: 5px;
}

/*  랭킹전 결과 */
.ranking .result_wrap {
    background: #f7faff;
    margin-top: 10px
}

.result_wrap {
    background: #fff;
    border-radius: 20px;
    padding: 30px 30px;
    box-shadow: 0px 0px 6px -3px #c1c1c1;
    margin-bottom: 30px;
    text-align: center;
}

.result_wrap h3 {
    font-size: 26px;
    font-weight: 600;
    text-align: center;
    color: #6d7582;
    margin-bottom: 20px;
}

.result_wrap h4 {
    text-align: center;
    font-size: 50px;
    font-weight: 600;
    color: #0583f2;
    margin: 10px 0 10px;
}

#wrap .result_wrap h5 {
    text-align: center;
    font-size: 18px;
    color: #888;
    font-weight: 500;
    margin-bottom: 35px;
}

.result_wrap .result_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.result_wrap .result_list .item {
    flex: 0 0 33.3%;
    text-align: center;
    color: #5f5656;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: 30px;
}

.result_wrap .result_list .item:nth-child(4),
.result_wrap .result_list .item:nth-child(5) {
    margin-bottom: 0;
}

.result_wrap .result_list .item>span {
    display: block;
    color: #c1c3c2;
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 10px;
}

/* 단원별 학습하기 */
.unit_list {
    list-style: none;
    padding: 0;
    margin: 10px 0 0;
}

.unit_list>li {
    padding: 0 15px;
}

.unit_list>li>h3 {
    border-bottom: 1px solid #eee;
    font-size: 17px;
    padding: 10px 5px;
    margin-bottom: 17px;
}

.unit_list>li .item {}

.unit_list>li .item>li {
    margin: 12px 0;
}

.unit_list .form-check {
    position: relative;
    display: inline-block;
    margin: 0;
    padding-left: 30px;
}

.unit_list .item .form-check>label {
    font-size: 15px;
    color: #606060;
    /* padding-top: 10px;
    transform: translateX(-20px); */
}

.unit_list .form-check>input {
    box-sizing: border-box;
    padding: 0;
    position: absolute;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 1.25rem;
    overflow: visible;
    opacity: 0;
}

.unit_list .item .form-check>input:checked+label {
    color: #0583f2;
}

.unit_list .form-check>input:checked+label:before {
    content: '\F633';
    position: absolute;
    top: -1px;
    left: 0;
    font-family: bootstrap-icons;
    color: #0583f2;
    font-size: 18px;
}

.unit_setup .unit_list .form-check>input+label:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    border: 1px solid #0583f2;
    width: 20px;
    height: 20px;
    border-radius: 4px;
}

.unit_setup .unit_list>li .item {
    margin-left: 40px;
}


.unit_carousel .owl-carousel {
    width: 300px;
    margin: 0 auto;
    max-width: 80%;
    border: none;
}

.unit_carousel .owl-stage-outer:after {
    content: '';
    position: absolute;
    top: 5%;
    bottom: 5%;
    display: inline-block;
    width: 100%;
    z-index: -1;
    border-radius: 30px;
    background: #fff;
}

.unit_carousel .owl-nav {
    position: absolute;
    display: flex;
    top: 50%;
    left: -30px;
    right: -30px;
    z-index: -1;
    margin-top: -10px;
    width: calc(100% + 60px);
    justify-content: space-between;
}

.unit_carousel .owl-carousel .owl-nav .owl-prev:after,
.unit_carousel .owl-carousel .owl-nav .owl-next:after {
    font-size: 20px;
    font-family: 'bootstrap-icons';
    font-weight: 800;
    color: #b3b4b6;
}

.unit_carousel .owl-carousel .owl-nav .owl-prev:after {
    content: '\F284';
}

.unit_carousel .owl-carousel .owl-nav .owl-next:after {
    content: '\F285';
}

.unit_carousel .owl-carousel .owl-nav .owl-prev>span,
.unit_carousel .owl-carousel .owl-nav .owl-next>span {
    display: none;
}

.unit_carousel .owl-carousel .owl-item {}

.unit_carousel .nav-item {
    margin: 0 auto;
    border-radius: 35px;
    padding: 12px 0;
    transition: 0.3s;
    text-align: center;
    max-width: 80px;
}

.unit_carousel .nav-item .num {
    display: block;
    color: #0583f2;
    font-size: 20px;
    font-weight: 400;
    margin-bottom: 4px;
}

.unit_carousel .nav-item .percent {
    font-size: 16px;
    font-weight: 400;
    color: #767676;
}

.unit_carousel .nav-item .percent>span {
    display: block;
    font-weight: 400;
    color: #b3b4b6;
    font-size: 14px;
    margin-top: 2px;
}

.unit_carousel .owl-item.center .nav-item {
    background: #0583f2;
    border: none;
    box-shadow: 0 0 3px 0 rgb(0 0 0 / 45%);
}

.unit_carousel .owl-item.center .nav-item .num {
    color: #fff;
}

.unit_carousel .owl-item.center .nav-item .percent {
    color: #fff;
}

.unit_carousel .owl-item.center .nav-item .percent>span {
    color: #8fcbff;
}

.unit_carousel_cont .unit_item {
    display: none;
}

.unit_carousel_cont .unit_item.active {
    display: block;
}


/* 오답노트 */
.wrong_list {}

.wrong_list .item {
    background: #fff;
    border-radius: 10px;
    padding: 20px;
}

.wrong_list .item+.item {
    margin-top: 20px;
}

.wrong_list .item>.header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.wrong_list .item>.header>h3 {
    font-size: 17px;
    color: #949494;
    margin-bottom: 0;
}

.wrong_list .item>.header>h3 strong {
    display: inline-block;
    font-size: 18px;
    color: #454545;
    margin-left: 15px;
}

.wrong_list .item>.header .btn_wrong {
    color: #dfe1e2;
}

.wrong_list .item>.header .btn_wrong .bi {
    font-size: 20px;
}

.wrong_list .item .wrong_answer {
    font-size: 15px;
    color: #606060;
    line-height: 1.5;
    margin-bottom: 20px;
}

.wrong_list .item>.bottom {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.wrong_list .item>.bottom .bottom-item:first-child {
    display: flex;
    align-items: center;
}

.wrong_list .item>.bottom .bottom-item:nth-child(2) {
    display: flex;
}

.wrong_list .item>.bottom .bottom-item .answer_tit {
    font-size: 18px;
    margin-right: 6px;
}

.wrong_list .item>.bottom .bottom-item .answer {
    display: inline-block;
    font-size: 25px;
    font-weight: 500;
    font-family: 'Poppins';
    line-height: 1.0;
}

.wrong_list .item>.bottom .bottom-item button+* {
    margin-left: 10px;
}

.wrong_list .item>.bottom .bottom-item .btn_star.form-check {
    position: relative;
    display: inline-block;
    margin: 0 12px;
    padding: 0;
}

.wrong_list .item>.bottom .bottom-item .btn_star.form-check>label {
    font-size: 15px;
    color: #99a3a8;
}

.wrong_list .item>.bottom .bottom-item .btn_star.form-check>input {
    box-sizing: border-box;
    padding: 0;
    position: absolute;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 1.25rem;
    overflow: visible;
    opacity: 0;
}

.wrong_list .item>.bottom .bottom-item .btn_star.form-check>input:checked+label {
    color: #0583f2;
}

.wrong_list .item>.bottom .bottom-item .btn_star .bi {
    font-size: 21px;
}

.wrong_list .item>.bottom .bottom-item img {
    width: 25px;
}

.wrong_list .item>.bottom .bottom-item .badge {
    padding: 0.35rem 1rem;
    background-color: #0583f2 !important;
}

.wrong_note_fix {
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    background-color: #fff;
    border-top: 1px solid #f3f3f3;
    z-index: 100;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    box-shadow: 0px 0px 15px -3px #ddd;
    display: flex;
    flex-direction: row;
}

.wrong_note_fix .item {
    display: flex;
    flex: 0 0 33.3%;
    padding: 20px 0;
    justify-content: center;
    border-right: 1px solid #e1e3e6;
}

.wrong_note_fix .item:last-child {
    border-right: 0 solid #ffffff;
}

.wrong_note_fix .item .form-check {
    position: relative;
    display: inline-block;
    margin: 0;
    padding-left: 40px;
}

.wrong_note_fix .item .form-check>input {
    box-sizing: border-box;
    padding: 0;
    position: absolute;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 32px;
    overflow: visible;
    opacity: 0;
}

.wrong_note_fix .item .form-check>input+label img {
    width: 40px;
}

.wrong_note_fix .item .form-check>input+label i {
    color: #0583f2;
    font-size: 30px;
    vertical-align: super;
}

.wrong_note_fix .item .form-check>input+label:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -12px;
    border: 1px solid #0583f2;
    width: 24px;
    height: 24px;
    border-radius: 4px;
}

.wrong_note_fix .item .form-check>input:checked+label:before {
    content: '\F633';
    position: absolute;
    top: 3px;
    left: 1px;
    font-family: bootstrap-icons;
    color: #0583f2;
    font-size: 20px;
    font-weight: 700;
}

/* 해설 */
.explain_fix {
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    background-color: #0583f2;
    z-index: 100;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    box-shadow: 0px 0px 15px -3px #ddd;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 20px 30px;
}

.explain_fix .item {
    color: #fff;
    font-size: 20px;
    font-weight: 500;
}


/* 아이템샵 */
.item_list {}

.item_list .item {
    background: #fff;
    border-radius: 10px;
    padding: 30px;
}

.item_list .item+.item {
    margin-top: 20px;
}

.item_list .item>.header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.item_list .item>.header>h3 {
    font-size: 17px;
    color: #313237;
    margin-bottom: 0;
    font-weight: 600;
}

.item_list .item_contents {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.item_list .item_contents .img {
    flex: 0 0 100px;
}

.item_list .item_contents .txt {
    flex: 0 0 calc(100% - 100px);
    padding-left: 20px;
    font-size: 14px;
    color: #7b7b7b;
}

.item_list .item>.bottom {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.item_list .item>.bottom .bottom-item:first-child {
    display: flex;
    align-items: center;
    padding-left: 10px;
    color: #6c6e78;
}

.item_list .item>.bottom .bottom-item .badge {
    color: #6bbef2;
    font-size: 12px;
    background: #f4faff;
    padding: 6px 10px;
    border-radius: 5px;
    margin: 0 0 0 5px;
}

.sub .my_item .modal-header {
    position: relative;
    justify-content: center;
    border-bottom: none;
    align-items: flex-end;
    min-height: 70px;
    padding: 25px 0;
}

.sub .item_detail .modal-header .modal-title {
    text-align: left;
    font-size: 21px;
}

.sub .item_detail .item_header li span.tit {
    font-size: 16px;
    width: 80px;
    display: inline-block;
}

.sub .item_detail .item_header ul {
    overflow: hidden;
    border-bottom: 1px solid #eee;
    padding-bottom: 13px;
}

.sub .item_detail .item_header li {
    font-size: 16px;
    padding: 3px 0;
}

.sub .item_detail .item_header span.t_red {
    color: red;
    font-size: 15px;
}

.sub .item_detail .item_contents li {
    font-size: 14px;
    color: #7b7b7b;
    margin-bottom: 7px;
}

.sub .item_detail .item_contents ul {
    list-style: disc;
    margin-left: 20px;
    padding-top: 5px;
}

.sub .my_item .modal-content {
    border-radius: 25px;
    border: none;
    background: #0583f2;
}

.sub .my_item .modal-header .modal-title {
    text-align: center;
    font-size: 21px;
    color: #fff;
}

.sub .my_item .modal-header .modal-title>span {
    display: block;
    font-size: 13px;
    font-weight: 200;
}

.sub .my_item .modal-header .btn-close {
    margin: 0;
    position: absolute;
    top: 0;
    right: 5px;
    background: none;
    color: #fff;
    opacity: 1;
    width: inherit;
    height: inherit;
}

.sub .my_item .modal-header .btn-close .bi {
    font-size: 27px;
}

.sub .my_item .modal-body {
    border-radius: 25px;
    padding: 25px 40px;
    background: #fff;
}

.sub .my_item .item_header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.sub .my_item .item_header .tit {
    font-size: 15px;
    margin: 0;
}

.sub .my_item .item_header .badge {
    color: #6bbef2;
    font-size: 12px;
    background: #f4faff;
    padding: 6px 15px;
    border-radius: 15px;
}

.sub .my_item .item_contents {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.sub .my_item .item_contents .img {
    flex: 0 0 100px;
}

.sub .my_item .item_contents .txt {
    flex: 0 0 calc(100% - 100px);
    padding-left: 20px;
    font-size: 15px;
    color: #7b7b7b;
}






@media screen and (max-width:800px) {
    .main_ad img {
        width: 100%;
        height: auto;
    }
}

@media screen and (max-width:600px) {
    * {
        font-size: 15px;
        line-height: 1.3;
    }

    .main_visual_img img {
        width: 90%;
    }

    .main_visual .inner .main_visual_txt {
        width: 70%;
        padding: 0
    }

    .nav_menu .accordion-body {
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .nav_menu .accordion-body a {
        width: 50%;
        min-height: 100px;
        border-bottom: 1px solid #e6e6e6;
        padding: 15px;
    }

    .nav_menu .accordion-body a:nth-child(1),
    .nav_menu .accordion-body a:nth-child(3) {
        border-right: 1px solid #e6e6e6;
        padding: 15px;
    }

    .nav_menu .accordion-body a:nth-child(3),
    .nav_menu .accordion-body a:nth-child(4),
    .nav_menu .accordion-body.menu2 a:nth-child(1),
    .nav_menu .accordion-body.menu2 a:nth-child(2) {
        border-bottom: 0px solid #e6e6e6;
        padding: 15px;
    }



    .nav_menu .accordion-body.menu6 a {
        border-bottom: 1px solid #e6e6e6;
        padding: 15px;
    }

    .nav_menu .accordion-body.menu6 a:nth-child(1),
    .nav_menu .accordion-body.menu6 a:nth-child(3),
    .nav_menu .accordion-body.menu6 a:nth-child(5) {
        border-right: 1px solid #e6e6e6;
        padding: 15px;
    }

    .nav_menu .accordion-body.menu6 a:nth-child(5),
    .nav_menu .accordion-body.menu6 a:nth-child(6) {
        border-bottom: 0px solid #e6e6e6;
        padding: 15px;
    }

}

@media screen and (max-width:450px) {
    .main_menu a {
        width: auto;
    }

    .main_menu .img {
        width: auto;
        margin-right: 20px;
    }

    .main_visual_txt .logo {
        margin-top: 0
    }

}

@media screen and (max-width:400px) {
    .main_visual_txt .logo_txt {
        font-size: 12px
    }

    .main_menu .img {
        margin-top: 5px
    }

    .main_menu a {
        width: 100%;
        margin-bottom: 5px
    }
}



/*테이블 */
/* table {border-top: 5px solid #eee;} */
table.dataTable {
    width: 100%;
}

table.dataTable td {
    padding: 20px 5px;
    border-bottom: 1px solid #eee;
}

table.dataTable td {
    width: 100%;
    font-size: 14px;
    vertical-align: top;
}

table.dataTable td a {
    color: #333;
}

table.dataTable td a:visited {
    color: #999;
}

table.dataTable .inquiry_date {
    font-size: 12px;
    color: #999;
    padding-top: 5px;
}

.frm_board_commu_open table.dataTable .inquiry_title {
    width: 100px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.frm_board_commu_open table.dataTable td:nth-child(2) {
    text-align: right;
    white-space: nowrap;
    width: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.frm_board_commu_open table.dataTable .inquiry_title2 {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-bottom: 10px;
    font-weight: 600 !important;
}

.new_tit_wrap img {
    height: 25px;
}


.new_tit_wrap {
    width: 250px;
    position: relative;
}

.new_tit_name {
    font-size: 13px;
    font-weight: 500;
    color: #000
}

.new_tit_date {
    font-size: 13px;
    color: #999
}

#board_content_wrapper #board_content {
    max-width: 100%;
    table-layout: fixed;
}


.put_search label {
    display: block;
}

.pagination li {
    display: inline-block;
    padding: 0 5px;
}

.pagination li.active a {
    background-color: #f5f5f5;
    color: #373737;
    border-radius: 5px;
}






/* 20230526 수정 */
/* 메인화면 */
.mt-2 {
    font-size: 12px;
    padding: 16px 0;
    line-height: 1.45;
}

.menu_txt4 h3 {
    margin-top: 30px;
}

.main_visual_top_wrap {
    display: flex;
}

.main_profile {
    display: flex;
    padding: 24px 10px 8px 10px;
    background-color: #fff;
    margin-bottom: 24px;
    border-radius: 16px
}

.main_profile .main_avatar {
    margin-right: 16px;
    width: 25%;
}

.maininfo_percent {
    width: 65%;
}

.main_profile .maininfo_percent .main_user {
    margin-bottom: 16px;
    font-weight: 600;
    font-size: 18px;
}

.main_user>span {
    color: #777;
}

.main_ranking {
    display: flex;
    justify-content: space-between;
}

.main_ranking li {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-weight: 500;
    color: #777;
}

.main_ranking span {
    color: #0078ff;
    font-weight: 700;
    font-size: 15px;
    line-height: 2;
    letter-spacing: -1px;
}

.main_visual .inner_login {
    flex-direction: column;
    width: 100% !important;
    position: relative;
    margin: 0 auto;
    max-width: 1030px;
    padding: 0 20px;
}

.problem_profile {
    flex-direction: column;
}

/* 관리자프로필 */
.admininfo_profile {
    display: flex;
    justify-content: space-between;
}

.admininfo_profile img {
    width: 30%;
    object-fit: scale-down;
}

.admin_badge {
    border-radius: 20px;
    background-color: #0583F2;
    color: white;
    display: inline;
    font-size: 12px;
    padding: 3px 14px;
}

.admin_name {
    font-size: 20px;
    line-height: 3;
}

.admin_name b {
    font-size: 20px;
    color: #0583F2;
}

.admin_profile {
    position: relative;
    background: #f7faff;
}

.admin_profile .result_wrap {
    text-align: left
}

.admininfo_wrap {
    padding: 15px 0 100px 0;
}

.admininfo_intro {
    margin: 0 0 50px 0
}

.admininfo_intro_tit {
    font-size: 20px;
    font-weight: 500;
    border-bottom: 1px solid #f1f1f1;
    line-height: 2.45;
    margin-bottom: 16px;
}

.admininfo_intro_des {
    line-height: 1.45;
}

.admininfo_intro table th {
    width: 120px;
    font-weight: 500;
    color: #777;
    vertical-align: top;
    line-height: 2;
    margin-right: 50px;
}

.admininfo_intro table td {
    font-size: 14px;
    line-height: 2;
    letter-spacing: -1px;
}

.admininfo_intro ul li {
    background: #F4FAFF;
    display: inline-block;
    padding: 8px 10px;
    border-radius: 20px;
    margin: 0 10px 10px 0;
    color: #0583F2;
    font-weight: 600;
}

/* 순위 */
.ranking_avatar img {
    width: 15%;
}

/* 로딩화면 */
#display_loading .inner h4 {
    color: #0583F2;
    font-weight: 600;
}

#display_loading .inner {
    text-align: center;
    margin: 300px 0;
}

#display_loading .loading_img {
    animation-name: rotate;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    width: 32px;
    margin: 0 0 20px 0;
}

@keyframes rotate {
    from {
        transform: rotate(-360deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* 공개질문 탭메뉴 */
.community_menu {
    padding: 20px 0;
    background: #fff;
    border-bottom: 1px solid #f1f1f1;
}

.community_menu a {
    font-size: 12px;
    background: #f5f5f5;
    color: #999;
    border-radius: 30px;
    padding: 4px 10px;
}

.community_menu .on a {
    background: #0078ff;
    color: #fff !important;
}

.frm_board_commu_open {
    padding: 40px 0 0;
}

.community_menu .inner {
    padding: 0 10px;
    text-align: center;
}

/* 공개질문 셀렉트박스 */
.form_cont select {
    border: 1px solid #f4f4f4;
    background: #fafafa;
    border-radius: 30px;
    padding: 8px 16px;
    text-align: center;
}

/* 랭킹전 결과 팝업 */
.title_level_modal {
    text-align: center;
}

.title_level_modal img {
    width: 50%;
}

/* 공개질문 게시판 뷰페이지 */
.open_view_top {
    padding-top: 80px !important;
}

.open_view_top .notice_date {
    margin-bottom: 20px;
}

.open_view_top .notice_name a {
    color: #777;
}

.open_view_top .notice_name img {
    width: 32px;
}

/* 해설보기 모달 선 제거 */
.modal-footer {
    border: none !important;
}

/* 마이페이지 타이틀 조정 */
.result_wrap img {
    transform: translateY(-3px);
}

/* 랭킹리스트 */
.my_ranking_title_wrap span {
    line-height: 40px;
    vertical-align: middle;
    margin-right: 5px;
}

.my_ranking_title_wrap .ranking_avatar img {
    width: 30px;
}

/* 마이랭킹 */
.my_ranking_result_wrap h3 {
    font-size: 20px;
    font-weight: 400;
    color: #000;
}

.my_ranking_result_wrap h3 span {
    color: #0d6efd;
    font-size: 20px;
    font-weight: 600;
}

/* 학습하기 마이페이지 */
.study_mypage h5 {
    margin: 10px 0 !important;
}

/* 공개질문 답글 */
.reply_cont_con {
    padding-bottom: 10px;
}

.reply_info {
    border-top: 1px solid #f1f1f1;
    text-align: right;
    vertical-align: middle;
    line-height: 30px;
    padding: 10px 0 0 0;
    line-height: 24px;
}

.reply_info a {
    color: #777;
    line-height: 24px;
}

.reply_info a img.img-fluid {
    height: 25px;
}

.deletebtn {
    padding: 0 10px !important;
    height: 22px !important;
    background: transparent !important;
    font-size: 12px !important;
    border-radius: 4px !important;
}

/* 마이페이지 프로필 */
.memberinfo_wrap .result_wrap h2 {
    font-size: 20px;
    font-weight: 500;
}

.memberinfo_wrap .result_wrap h2>b {
    color: #0078ff;
    font-size: 20px !important;
}

/* 랭킹결과 */
.result_wrap .result_splash {
    width: 150px;
}

/* 문제 레벨 */
.quiz_bar {
    position: relative;
    height: 40px;
}

.quiz_bar .quiz_count {
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 20px;
    text-align: right;
    font-size: 11px;
    color: #767676;
}

.quiz_bar .quiz_level {
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    height: 20px;
}

.quiz_bar .quiz_level .level1 {
    display: table-cell;
    font-size: 11px;
    font-weight: 600;
    color: #6BBEF2;
    padding: 6px 15px;
    background: #fff;
    border-radius: 20px;
}

.quiz_bar .quiz_level .level2 {
    display: table-cell;
    font-size: 11px;
    font-weight: 600;
    color: #FFA048;
    padding: 6px 15px;
    background: #fff;
    border-radius: 20px;
}

.quiz_bar .quiz_level .level3 {
    display: table-cell;
    font-size: 11px;
    font-weight: 600;
    color: #DC3545;
    padding: 6px 15px;
    background: #fff;
    border-radius: 20px;
}

/* 단원별학습하기 줄 밀림 조정 */
.unit_cate_list {
    padding: 14px 0;
    transform: translateX(-25px)
}

/* 게시판 이미지첨부 */
.content_attach input[type=file]::file-selector-button {
    color: #fff;
    border: none;
    background: #0583f2;
    border-radius: 8px;
    padding: 6px 12px;
    margin-right: 10px;
    font-size: 12px;
}

.content_attach>input {
    margin: 0 0 20px 0;
}

.content_del_check>input {
    height: 20px;
    width: 20px;
    margin: 0 10px;
    color: #777;
}

/* 복습노트 아이콘 */
.wrong_list_icon button {
    margin-left: 12px;
}

/* 복습노트페이지 */
.problemsitems_pagenation {
    padding-bottom: 60px;
}




.n_pfi_all_wrap {background-color: #fff; padding: 5px 10px;border-radius: 20px;overflow: hidden;margin-bottom: 30px;}
.n_pfi_top:after {content: "";display: block;height: 0;clear: both;visibility: hidden;}
.n_pfi_top {position: relative;top: 0px;left: 0px;padding-left: 80px;min-height: 60px;}
.n_pfi_top_left {position: absolute;top: 0px;left: 0px;width: 60px;height: 60px;}
.n_pfi_top_left img {max-width: 100%;}
.n_pfi_top_right {position:relative;top:0px;left:0px;padding-top:20px; }
.n_pfi_top_wrap {padding-bottom: 10px;}

.n_pfi_table:after {content: "";display: block;height: 0;clear: both;visibility: hidden;}

.n_pfi_table ul {float: left;display: block;width: 22%;font-size: 14px;}
.n_pfi_table ul:nth-child(4) {width: 34%;}
.n_pfi_table ul li {font-size: 14px;display: block;height: 40px;line-height: 40px;text-align: center;}
.n_pfi_table ul li:first-child {font-weight: 400;}
.n_pfi_table ul li  {font-size: 14px;font-weight: bold;border-bottom: 1px solid #eee;}


.n_pfi_table ul:nth-child(1) li {color: #0078ff}
.n_pfi_table_wrap {border-top: 2px solid #eee;}


.accordion-button span {display: inline-block;color: #0583f2; border-radius: 3px; position: absolute;bottom: 10px;left: 30px;padding: 5px 10px;font-size: 13px;font-weight: bold;}
.accordion-button {padding-bottom: 40px!important;position: relative;top: 0px;left: 0px;}

.form-check .ppc {display: inline-block;color: #0583f2; border-radius: 3px; padding: 3px 8px;font-size: 13px;font-weight: bold;border: 1px solid #0583f2;}