@charset "utf-8";

@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);

body.main {
    background: #fff;
    height: auto
}

body.scroll {
    padding-top: 107px
}

img {
    max-width: 100%;
    height: auto
}

.mSceenIndicator {
    position: fixed;
    top: 50%;
    right: 25px;
    width: 140px;
    margin-top: -108px;
    text-align: right;
    z-index: 49
}

.mSceenIndicator li {
    background: url('../img/common/ind_dotline_default.png') repeat-y top right;
    position: relative;
    cursor: pointer;
    height: 73px;
    transition: all .3s ease
}

.mSceenIndicator li span {
    position: absolute;
    top: 0;
    right: -200px;
    padding: 15px 25px 15px 0;
    font-size: 0.70rem;
    transition: all .6s ease
}

.mSceenIndicator li.on {
    background: url('../img/common/ind_dotline.png') repeat-y top right
}

.mSceenIndicator li.on span {
    right: 0
}

.mSceenIndicator li:after {
    content: "◁";
    color: #000;
    position: absolute;
    top: 50%;
    right: -1px;
    margin-top: -11px
}

.mSceenIndicator li.on:after {
    content: "◀"
}

.mSceenIndicator li em {
    height: 1px;
    width: 0;
    display: block;
    background: #000;
    position: absolute;
    top: 50%;
    right: 12px;
    margin-top: -1px;
    transition: all 1.5s ease
}

.mSceenIndicator li.on em {
    width: 100%
}

.mSceenIndicator li:nth-child(3).on span {
    color: #fff
}

.mSceenIndicator li:nth-child(3).on em {
    background: #fff
}

.mSceenIndicator li:nth-child(3).on:after {
    color: #fff
}

.header {
    transition: all .3s ease;
    position: relative;
    z-index: 110
}

.header .innerWrap {
    max-width: 1280px;
    margin: 0 auto;
    transition: all .3s ease
}

.mbMenu {
    position: absolute;
    top: -46px;
    right: 0;
    transition: all .3s ease
}

.launchMenu {
    position: absolute;
    top: -46px;
    left: 0
}

.mbMenu a, .launchMenu a {
    color: #3c444c;
    font-size: 0.9rem;
    padding: 10px 0 10px 10px;
    font-weight: 500;
    position: relative
}

.launchMenu a:first-child span {
    width: 96px
}

.launchMenu a:nth-child(2) span {
    width: 145px
}

/*2022-11-16추가*/
.launchMenu a:nth-child(3) span {
    width: 125px
}

/*2025-07-22추가*/
.launchMenu a:nth-child(4) span {
    width: 155px
}

/*2022-11-16추가*/
.launchMenu span.default {
    display: inline-block
}

.launchMenu span.over {
    display: none
}

.launchMenu a:hover span.over {
    display: inline-block
}

.launchMenu a:hover span.default {
    display: none
}

.launchMenu a img {
    margin-right: 10px;
    margin-bottom: 5px
}

.mbMenu span {
    display: none
}

.mbMenu span.icShortCut {
    background: url('../img/common/top_icon_shortcut.png') no-repeat 0 0
}

.mbMenu span.icLogin {
    background: url('../img/common/top_icon_login.png') no-repeat 0 0
}

.mbMenu span.icLogOut {
    background: url('../img/common/top_icon_logout.png') no-repeat 0 0
}

.mbMenu span.icRegister {
    background: url('../img/common/top_icon_join.png') no-repeat 0 0
}

.mbMenu span.icCartTop {
    background: url('../img/common/top_icon_cart.png') no-repeat 0 0
}

.mbMenu span.icMypage {
    background: url('../img/common/top_icon_mypage.png') no-repeat 0 0
}

.mbMenu span.icCs {
    background: url('../img/common/top_icon_cs.png') no-repeat 0 0
}

.mbMenu a dfn {
    display: block;
    position: absolute;
    top: 5px;
    right: 0;
    width: 6px;
    height: 6px;
    background: #e8463e;
    border-radius: 500px
}

.scroll .mbMenu a dfn {
    top: 17px;
    right: 10px
}

.mbMenu dfn + span.icCartTop {
    margin-top: 6px ! important
}

/* shortcut */
.modal.modalShortCut .modalHeader {
    height: 60px !important;
    line-height: 60px !important;
}

.modalShortCut .modalHeader h2 {
    font-size: 18px;
    line-height: 40px;
    font-weight: 400;
}

.shortCut-top h2 {
    font-size: 16px;
    color: #666666;
    margin-bottom: 30px;
}

.shortCut-top h2 b {
    color: #272c38;
}

.shortCut-top:after {
    content: '';
    clear: both;
    display: block;
}

.shortCut-top > div {
    float: left;
}

.shortCut-left {
    width: 33%;
    position: relative;
}

.shortCut-left:after {
    content: '';
    position: absolute;
    top: 0;
    right: 9.5%;
    width: 1px;
    height: 90%;
    background-color: #dcdcdc;
}

.shortCut-top > div a {
    display: inline-block;
    width: 185px;
    height: 45px;
    line-height: 13px;
    box-sizing: border-box;
    font-size: 14px;
    padding: 15px 0 15px 20px;
    color: #454545;
    border-radius: 5px;
}

.border-red {
    border: 1px solid #e8463e
}

.border-blue {
    color: #2651b4;
    border: 1px solid #2651b4;
}

.shortCut-left a b {
    color: #e9463f;
}

.shortCut-left a {
    margin-bottom: 20px;
}

.shortCut-right {
    width: 66%;
}

.shortCut-right a b {
    color: #2651b4;
}

.shortCut-right a {
    margin: 0 10px;
    margin-top: 0;
    margin-bottom: 20px;
}

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

.shortCut-bottom:before {
    content: '';
    position: absolute;
    top: 10px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #dcdcdc;
}

.shortCut-bottom h2 {
    font-size: 18px;
    font-weight: 500;
    color: #272c38;
}

.shortCut-bottom p {
    padding-top: 3px;
    padding-bottom: 15px;
    font-size: 16px;
    color: #666666;
}

.shortCut-bottom > div {
    border: 1px solid #c5c5c5;
}

.gnb {
    position: relative;
    margin: 0 auto;
    background: #272c38;
    color: #fff;
    height: 84px;
    margin-top: 70px;
    z-index: 100
}

.gnb .siteName {
    position: absolute;
    top: 26px;
    left: 15px
}

.gnb .siteName img {
    max-width: 130px
}

.gnbMenu {
    position: absolute;
    top: 0;
    left: 165px;
    right: 168px
}

.gnbMenu > ul {
    display: flex;
    align-items: center;
}

.gnbMenu > ul > li {
    /* float: left; */
    /* width: 0%; */
    /* width: 12.5%; */
    flex: 1;
    height: 84px;
    text-align: center;
    position: relative;
    /* display: none */
}

.gnbMenu > ul > li.data > ul {
    min-height: 240px;
}

.gnbMenu .fmaSection {
    display: none
}

.gnbMenu.active .fmaSection {
    display: none;
    position: absolute;
    top: 100%;
    right: -150px;
    width: 150px;
    min-height: 599px;
    box-sizing: border-box;
    border-left: 1px solid #ededed;
}

.gnbMenu.active .fmaSection > ul{
    padding: 20px 10px;
}

.gnbMenu.active .fmaSection li {
    margin-bottom: 30px;
}

.gnbMenu.active .fmaSection a {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    color: #272c38;
    text-decoration: none ! important;
    font-weight: 900;
    font-size: 1.1rem;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 8px
}

.gnbMenu.active .fmaSection a:hover {
    color: #e8463e
}

.gnbMenu.active .fmaSection a:after {
    content: "";
    width: 30px;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #272c38
}

.gnbMenu.active .fmaSection li:nth-child(1) {
    /* position: absolute;
    top: 0;
    left: -150px;
    width: auto */
}

.gnbMenu.active .fmaSection li:nth-child(2) {
    /* position: absolute;
    right: -110px */
}

.gnbMenu.active .fmaSection li:nth-child(3) {
    /* position: absolute;
    top: 60px;
    right: -110px */
}

.gnbMenu.active .fmaSection li.sns {
    /* position: absolute;
    top: 120px;
    right: -141px;
    min-width: 130px; */
}
.gnbMenu.active .fmaSection li.sns ul {
    margin-top: 15px;
}
.gnbMenu.active .fmaSection li.sns li {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    padding: 6px 0;
    margin-bottom: 0;
    width: 100%;
}
.gnbMenu.active .fmaSection li.sns li a {
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1rem;
    font-weight: 400;
    color: #5a5e66;
    display: block;
    margin-bottom: 0;
    padding: 0;
}
.gnbMenu.active .fmaSection li.sns li a:hover{
    color: #e8463e;
    text-decoration: underline !important;
}
.gnbMenu.active .fmaSection li.sns li a::after {
    display: none;
}

.gnbMenu.active > ul > li:nth-child(8) ul {
    border-right: 1px solid #ededed
}
.gnbMenu > ul > li.active {
    background: #2650b4
}

.gnbMenu > ul > li > a {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.25rem;
    position: relative;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    word-break: keep-all;
}

.gnbMenu > ul > li:hover > a {
    background: url('../img/common/gnb_hover_arrow.png') no-repeat center bottom -2px #2650b4
}

/*.gnbMenu > ul > li:nth-child(5):after { content:""; position:absolute; top:31px; right:0; width:2px; height:20px; background:rgba(255,255,255,0.4) }*/
/* .gnbMenu > ul > li:nth-child(8), .gnbMenu > ul > li:last-child > a {
    background-color: #e8463e
} */
.gnbMenu > ul > li.data > a {
    background-color: #495164;
}
.gnbMenu > ul > li.smart > a {
    background-color: #e8463e;
}

.gnbMenu > ul > li > ul {
    display: none;
    background: #fff;
    border: 1px solid #272c38;
    box-shadow: 10px 8px 10px rgba(0,0,0,0.08);
    border-top: 0px none;
    position: absolute;
    top: 84px;
    left: -80px;
    width: 460px;
    min-height: 290px;
    padding: 20px 0
}

.gnbMenu > ul > li.smart > ul {
    height: 240px;
    min-height: 240px;
}

.gnbMenu > ul > li:hover ul {
    display: block ! important
}

.gnbMenu > ul > li:hover ul.dummy {
    display: none ! important
}

.gnbMenu > ul > li:nth-child(6) ul, .gnbMenu > ul > li:nth-child(7) ul, .gnbMenu > ul > li:nth-child(8) ul {
    right: -85px;
    left: auto
}

.gnbMenu > ul > li > ul > li {
    text-align: left;
    padding: 3px 25px;
    letter-spacing: -0.5px
}

.gnbMenu > ul > li > ul > li a {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    color: #5a5e66;
    font-size: 1.05rem;
    display: block
}

.gnbMenu > ul > li > ul > li a:hover {
    color: #e8463e;
    text-decoration: underline
}

.gnbMenu > ul > li > ul > li.subMain a {
    color: #272c38;
    text-decoration: none ! important;
    font-weight: 900;
    font-size: 1.1rem;
    position: relative;
    margin-bottom: 15px
}

.gnbMenu > ul > li > ul > li.subMain a:hover {
    color: #e8463e
}

.gnbMenu > ul > li > ul > li.subMain a:after {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: -10px;
    background: #d6d6d6
}

.gnbMenu > ul > li > ul > li.addBox {
    position: absolute;
    top: 72px;
    right: 25px;
    width: 200px;
    height: 150px;
    text-align: center;
}

.gnbMenu > ul > li > ul > li.addBox img {
    width: 200px;
    height: 150px
}

.gnbMenu > ul > li > ul > li.addBox a {
    display: block;
    position: absolute;
    top: 0;
    left: 0
}

.gnbMenu > ul > li > ul > li.classBox {
    position: absolute;
    top: 184px;
    left: 25px;
    /* width: 230px; */
    width: 175px;
    height: 150px;
    border-top: 1px dashed #EEEEEE;
    padding: 3px 0;
}

.gnbMenu > ul > li > ul > li.classBox > ul > li {
    padding: 4px 0;
    /* padding-left: 8px; */
    position: relative;
}

/* .gnbMenu > ul > li > ul > li.classBox > ul > li::before {
    content: '';
    display: block;
    width: 3px;
    height: 3px;
    background-color: #888;
    position: absolute;
    top: 12px;
    left: 0;
} */

.gnbMenu > ul > li > ul > li.classBox > ul > li a {
    position: relative;
} 

.gnbMenu > ul > li > ul > li.smart > ul > li a {
    padding-left: 23px;
    font-weight: 700;
}
.gnbMenu > ul > li > ul > li.smart > ul > li a::after {
    content: '';
    display: block;
    background: url('../img/common/right-arrow-circle.png') no-repeat center / contain;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
} 
.gnbMenu > ul > li > ul > li.smart > ul > li a::before {
    content: '';
    display: block;
    background: url('../img/common/ic_school.png') no-repeat center / contain;
    width: 16px;
    height: 19px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
} 

.gnbMenu > ul > li > ul > li.curation {
    position: absolute;
    right: 25px;
    bottom: 20px;
    width: 200px;
    padding: 0;
    border: 1px solid #d6d6d6;
    padding: 5px 10px
}

.gnbMenu > ul > li > ul > li.curation a {
    display: block;
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 0.95rem;
    background: url('../img/common/right-arrow-circle.png') no-repeat right center / contain
}

.gnb .etcMenu {
    position: absolute;
    top: 0;
    right: 0;
    width: 168px
}

.gnb .etcMenu li {
    width: 50%;
    float: left;
    text-align: center;
    line-height: 84px
}

.gnb .etcMenu li a {
    display: block;
    position: relative
}

.gnb .etcMenu li a:before {
    content: "";
    width: 1px;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: #272c38
}

.gnb .etcMenu li:nth-child(1) a {
    background: #495164
}

.gnb .etcMenu li:nth-child(2) a {
    background: #2651b4
}

.toggleSearch .close {
    display: none ! important
}

.toggleSearch.active .open {
    display: none ! important
}

.toggleSearch.active .close {
    display: block ! important
}

.toggleSearch.active .close:after {
    content: url('../img/common/gnb_hover_arrow.png');
    line-height: 1rem;
    position: absolute;
    left: 50%;
    bottom: -3px;
    margin-left: -14px;
    font-size: 1rem
}

.toggleAllMenu .close {
    display: none ! important
}

.toggleAllMenu.active .open {
    display: none ! important
}

.toggleAllMenu.active .close {
    display: block ! important
}

.toggleAllMenu.active .close:after {
    content: url('../img/common/gnb_hover_arrow.png');
    line-height: 1rem;
    position: absolute;
    left: 50%;
    bottom: -3px;
    margin-left: -14px;
    font-size: 1rem
}

.gnb .etcMenu li a.close img {
    max-width: 30%;
    height: auto
}

.gnbMenu.active > ul > li > ul {
    border: 0px none;
    border-left: 1px solid #ededed;
    box-shadow: none;
    min-height: 599px;
    width: auto;
    left: 0;
    right: 0
}

.gnbMenu.active > ul > li:hover > ul {
    background: #f6f6f6
}

.gnbMenu.active > ul > li > ul > li {
    padding: 6px 10px
}

.gnbMenu.active > ul > li > ul > li a {
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1rem;
}

.gnbMenu.active > ul > li:nth-child(8) ul {
    border-right: 1px solid #ededed
}

.gnbMenu.active li.addBox, .gnbMenu.active li.curation {
    display: none
}
.gnbMenu.active li.classBox{
    position: inherit;
    left: auto;
    top: auto;
    margin-top: 10px;
    width: 100%;
    height: auto;
}
.gnbMenu.active li.classBox a::after{
    position: inherit;
    top: auto;
    transform: translate(0);
    display: inline-block;
    vertical-align: middle;
    margin-top: -3px;
    margin-left: 5px;
}
.gnbMenu.active > ul > li > ul > li.smart > ul > li a {
    padding-left: 0px;
}
.gnbMenu.active > ul > li > ul > li.smart > ul > li a::before {
    content: none;
}
.gnbMenu.active > ul > li > ul > li.subMain a {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    color: #272c38;
    text-decoration: none ! important;
    font-weight: 900;
    font-size: 1.1rem;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 8px
}

.gnbMenu.active > ul > li > ul > li.subMain a:after {
    content: "";
    width: 30px;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #272c38
}

.gnbMenu.active > ul > li > ul > li.subMain a:hover {
    color: #e8463e
}

.snbBg {
    display: none;
    background: #fff;
    height: 600px;
    border: 1px solid #272c38;
    border-top: 0px none;
    position: absolute;
    top: 84px;
    left: -165px;
    right: -168px;
    /*transition:all .3s ease*/
}

.gnbMenu.active .snbBg {
    display: block
}

.container {
}

.container-inner {
    max-width: 1280px;
    margin: 0 auto;
    position: relative;
}

/* search */
/*.schBg { position:fixed; top:0; left:0; right:0; background:#fff; border-bottom:1px solid #272c38; box-shadow:0 0 10px rgba(0,0,0,0.15); z-index:50; height:998px }*/
.searchBox {
    display: none;
    position: absolute;
    top: -70px;
    left: 0;
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #272c38;
    box-shadow: 0 0 10px rgba(0,0,0,0.15);
    z-index: 50
}

.searchBox .innerWrap {
    position: relative;
    z-index: 50;
    width: 1280px;
    min-width: 1280px;
    margin: 180px auto 20px
}

.searchBox .resultText {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.3rem;
    text-align: center;
    padding: 30px 0 0 0;
    height: 90px;
    color: #111;
    letter-spacing: -0.5px
}

.searchBox mark {
    color: #e8463e
}

.searchBox .closeSearch {
    background: #fff
}

.searchBox .closeSearch img {
    transform: rotate(-45deg)
}

.searchBox .btn {
    font-weight: 400 ! important
}

.searchBox .btn img {
    margin-left: 10px
}

.resultData {
    border: 1px solid #e1e1e1;
    border-top: 2px solid #e8463e;
    height: 490px;
}

.resultData .itemA {
    background: #f6f6f6;
    float: left;
    height: 100%;
    width: 35%;
    position: relative
}

#schCaseA .resultData .itemA {
    padding: 20px;
}

.resultData .itemA:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1px;
    height: 100%;
    background: #e1e1e1
}

.resultData .itemB {
    float: right;
    width: 65%
}

.resultData .itemA ul::-webkit-scrollbar {
    width: 8px;
}

.resultData .itemA ul::-webkit-scrollbar-track {
    background-color: transparent;
}

.resultData .itemA ul::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 500px
}

.resultData .itemA ul::-webkit-scrollbar-thumb:hover {
    background: #666;
}

.resultData .itemA ul::-webkit-scrollbar-button:start:decrement, .resultData .itemA ul::-webkit-scrollbar-button:end:increment {
    width: 0;
    height: 0;
    background: transparent none;
}

.resultData .itemA ul {
    padding-right: 20px
}

#schCaseA .itemA ul {
    overflow-y: auto;
    height: 100%
}

.resultData .itemA li {
    margin: 6px 0
}

.resultData .itemA li a:hover {
    text-decoration: underline
}

.resultData .itemB .item {
    display: table;
    width: 50%;
    float: left;
    height: 100px;
    position: relative;
    transition: all .3s ease
}

.resultData .itemB .item:hover {
    background: #f6f6f6;
    box-shadow: inset 0 -4px 0 rgba(232,70,62,1)
}

.resultData .itemB .item:not(:nth-child(2n)):after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1px;
    height: 100%;
    background: #e1e1e1
}

.resultData .itemB .item .thumbs, .resultData .itemB .item .info {
    display: table-cell;
    vertical-align: middle;
    border-bottom: 1px solid #e1e1e1
}

.resultData .itemB .item .thumbs {
    padding: 20px;
    width: 120px
}

.resultData .itemB .item .thumbs img {
    width: 70px;
    height: 95px;
    transition: all .3s ease
}

.resultData .itemB .item .info {
    padding-right: 20px
}

.resultData .itemB .item .info .sectionName {
    margin-top: 10px;
    color: #999;
    font-size: 0.85rem
}

.resultData .itemB .item .info .price {
}

.schContent .btnSet {
    margin-top: 20px
}

/* pagenation */
.pagenation {
    clear: both;
    line-height: 56px;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.08rem;
    text-align: center
}

.pagenation .pageNumber, .pagenation .indicator, .pagenation a, .pagenation strong {
    display: inline-block
}

.pagenation a, .pagenation strong {
    border: 1px solid #e1e1e1;
    height: 35px;
    line-height: 35px
}

.pagenation .pageNumber a, .pagenation .pageNumber strong {
    min-width: 33px
}

.pagenation .pageNumber {
    margin: 0 15px
}

.pagenation .pageNumber strong {
    border-color: #e8463e;
    color: #e8463e
}

.pagenation img {
    vertical-align: top
}

.pagenation a:hover {
    background: #f6f6f6;
    border-color: #ccc
}

.searchContainer .pagenation {
    line-height: 66px
}

.searchTabs ul {
    height: 58px
}

.searchTabs li {
    width: 33.33%;
    float: left;
    height: 58px;
}

.searchTabs li a {
    display: block;
    line-height: 58px;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    background: #fafafa;
    border: 1px solid #dcdcdc;
    color: #868686;
    text-align: center;
    position: relative
}

.searchTabs li:nth-child(2) {
    margin: 0 -1px
}

.searchTabs li:nth-child(1).active a {
    background: #0f9eda;
    color: #fff;
    border-color: #0f9eda
}

.searchTabs li:nth-child(1).active a:after {
    content: url('../img/common/schtab_active1.png');
    position: absolute;
    bottom: -5px;
    left: 48%;
    line-height: 5px
}

.searchTabs li:nth-child(2).active a {
    background: #ffc600;
    color: #fff;
    border-color: #ffc600
}

.searchTabs li:nth-child(2).active a:after {
    content: url('../img/common/schtab_active2.png');
    position: absolute;
    bottom: -5px;
    left: 48%;
    line-height: 5px
}

.searchTabs li:nth-child(3).active a {
    background: #e8463e;
    color: #fff;
    border-color: #e8463e
}

.searchTabs li:nth-child(3).active a:after {
    content: url('../img/common/schtab_active3.png');
    position: absolute;
    bottom: -5px;
    left: 48%;
    line-height: 5px
}

.schContent .schKeyword {
    margin-top: 25px;
    height: 58px
}

.schContent .schKeyword {
    background: url('../img/common/icon_schbg.png') no-repeat left 15px center #e8eaee;
    position: relative;
    padding: 13px 100px 13px 50px;
    /*box-shadow:inset 2px 2px 7px rgba(0,0,0,0.04)*/
}

.schContent .schKeyword input[type=text] {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    background: transparent none;
    border: 0px none;
    width: 100%
}

.schContent .schKeyword input[type=submit] {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    background: #272c38;
    color: #fff;
    border: 0px none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100px;
    cursor: pointer
}

.schFilter .filterName {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.2rem;
    font-weight: 900;
    color: #111;
    margin: 20px 0 0 20px
}

.schFilter.filterB .filterName {
    margin-left: 0
}

.schFilter li {
    display: inline-block;
    line-height: 24px;
    margin: 2px 0 ! important
}

.schFilter li a {
    display: block;
    background: #fff;
    border: 1px solid #004f7a;
    border-radius: 500px;
    padding: 0 10px;
    font-size: 0.85rem;
    letter-spacing: -0.5px;
    text-decoration: none ! important;
    transition: all .1s ease
}

.schFilter li a:hover, .schFilter li.active a {
    background: #004f7a;
    color: #fff
}

.schFilter.filterA {
    width: 42%;
    float: left;
    height: 100%;
    position: relative
}

.schFilter.filterA:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1px;
    height: 100%;
    background: #e1e1e1
}

.schFilter.filterA ul {
    height: auto;
    border-bottom: 1px solid #e1e1e1;
    padding: 8px 20px
}

.schFilter.filterA ul:last-child {
    border: 0px none
}

.schFilter.filterB {
    float: right;
    width: 58%;
    padding-left: 20px;
    height: 100%
}

.schFilter.filterB ul {
    height: 420px;
    overflow: auto;
    margin: 10px 20px 0 0
}

.schFilter.filterB::-webkit-scrollbar {
    width: 8px;
}

.schFilter.filterB::-webkit-scrollbar-track {
    background-color: transparent;
}

.schFilter.filterB::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 500px
}

.schFilter.filterB::-webkit-scrollbar-thumb:hover {
    background: #666;
}

.schFilter.filterB::-webkit-scrollbar-button:start:decrement, .schFilter.filterB::-webkit-scrollbar-button:end:increment {
    width: 0;
    height: 0;
    background: transparent none;
}

#schCaseC .resultData {
    height: auto
}

#schCaseC .sectionTabs {
    padding: 25px 0;
    text-align: center
}

#schCaseC .sectionTabs li {
    display: inline-block;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    position: relative
}

#schCaseC .sectionTabs li:not(:last-child):after {
    content: ":";
    position: absolute;
    top: 8px;
    right: 0;
    color: #999
}

#schCaseC .sectionTabs li a {
    display: block;
    padding: 8px 20px 8px 15px
}

#schCaseC .sectionTabs li span {
    color: #999;
    margin-left: 5px
}

#schCaseC .sectionTabs li.active a {
    border-bottom: 2px solid #e8463e;
    color: #e8463e
}

#schCaseC .item {
    display: table;
    width: 639px;
    float: left;
    height: 100px;
    position: relative;
    transition: all .3s ease
}

#schCaseC .item:hover {
    background: #f6f6f6;
    box-shadow: inset 0 -4px 0 rgba(232,70,62,1)
}

#schCaseC .item:nth-child(2n) {
    border-left: 1px solid #e1e1e1;
    width: 638px
}

#schCaseC .item .thumbs, #schCaseC .item .info {
    display: table-cell;
    vertical-align: middle;
    border-bottom: 1px solid #e1e1e1
}

#schCaseC .item .thumbs {
    padding: 20px;
    width: 200px
}

#schCaseC .item .thumbs img {
    max-width: 200px;
    height: 107px
}

#schCaseC .item .info {
    padding-right: 20px
}

#schCaseC .item .info .name {
    font-weight: 700
}

#schCaseC .item .info .desp {
    color: #333;
    font-size: 0.95rem;
    line-height: 1.2rem;
    margin: 5px 0;
    font-weight: 300;
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

#schCaseC .item .info .desp2 {
    color: #999;
    font-size: 0.85rem;
    line-height: 1.2rem;
    font-weight: 300;
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.indicator2 {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0
}

.indicator2 a {
    display: inline-block;
    font-size: 1.5rem;
    color: #999;
    width: 50px;
    height: 40px;
    line-height: 40px;
    margin-top: -20px;
    text-align: center
}

.indicator2 a.prev {
    position: absolute;
    left: -60px
}

.indicator2 a.next {
    position: absolute;
    right: -60px
}

.indicator2 a:hover {
    background: #272c38;
    color: #fff
}

.footer {
    margin-top: 80px
}

.footer.hasToolbar {
    padding-bottom: 120px
}

.footer-menu .container-inner {
    max-width: 1280px;
    margin: 0 auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.footer-menu {
    background: #f6f6f6;
    border-top: 1px solid #d6d6d6;
    border-bottom: 1px solid #d6d6d6
}

.footer-menu li {
    position: relative;
    display: inline-block;
    padding: 0 10px;
    line-height: 60px
}

.footer-menu li:first-child {
    padding-left: 0
}

.footer-menu li a {
    font-size: 0.99rem;
    color: #8a8a8a
}

.familySite {
    line-height: 60px;
    display: flex;
    align-items: center;
}

.family-wrap {
    display: flex;
    align-items: center;
    gap: 15px;
}

.family-wrap .sns-box {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 100%;
}

.family-wrap .sns-box li {
    padding: 0;
}

.family-wrap .sns-box li a {
    display: block;
    width: 30px;
    height: 30px;
}

.family-wrap .sns-box li a img {
    display: block;
    max-width: 100%;
}

.copyright .container-inner {
    background: url('../img/common/ci_footer.png') no-repeat left center;
    color: #8a8a8a;
    font-size: 0.94rem;
    padding: 15px 0 15px 80px
}

.copyright span {
    display: inline-block;
    padding: 0 5px
}

.copyright span:first-child {
    padding-left: 0
}

.goTop {
    position: fixed;
    right: -100px;
    bottom: 183px;
    transition: all .8s ease;
    z-index: 100
}

.goTop.active {
    position: fixed;
    right: 82px;
}

.depthNavi {
}

.depthNavi .container-inner {
    background: #fff;
    border-left: 1px solid #e9e9e9;
    border-right: 1px solid #e9e9e9;
    border-bottom: 1px solid #979797;
    height: 50px;
    line-height: 50px;
    transition: all .3s ease
}

.depthNavi .container-inner > ul > li {
    float: left;
    position: relative;
    height: 49px;
    line-height: 49px;
    border-right: 1px solid #e9e9e9
}

.depthNavi .container-inner > ul > li:not(:first-child) {
    min-width: 200px
}

.depthNavi .container-inner > ul > li:not(:first-child):after {
    content: url('../img/common/arrow_toggle2.png');
    position: absolute;
    top: 0;
    right: 0;
    padding-right: 15px
}

.depthNavi .container-inner > ul > li:not(:first-child):hover:after {
    content: url('../img/common/arrow_toggle.png')
}

.depthNavi .container-inner > ul > li > a {
    display: block;
    height: 100%;
    position: relative;
    padding: 0 30px 0 15px
}

.depthNavi .container-inner > ul > li:first-child a {
    padding-right: 15px
}

.depthNavi .container-inner > ul > li a:before {
    content: "";
}

.depthNavi ul ul {
    opacity: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid #979797;
    border-top: 0px none;
    transition: all .3s ease
}

.depthNavi li li {
    height: 0px
}

.depthNavi li li a {
    display: block;
    font-weight: 300;
    color: #666
}

.depthNavi li li a:hover {
    background: #f6f6f6;
    color: #000
}

.depthNavi li:hover ul {
    opacity: 1;
    height: auto;
    margin-top: 0
}

.depthNavi li:hover li {
    height: auto;
    line-height: 30px
}

.depthNavi li:hover li a {
    padding: 0 15px
}

.depthNavi li.current a {
    background: #2650b4 ! important;
    color: #fff ! important
}

/* gnb : topFixed(wide) */
.scroll .header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0
}

.scroll .header .innerWrap {
    max-width: 100%
}

.scroll .gnb {
    margin-top: 0;
    /* min-width: 1270px; */
    height: 60px
}

.scroll .gnbMenu {
    right: 348px
}

.scroll .etcMenu {
    right: 230px;
    text-align: center
}

.scroll .gnb .etcMenu {
    width: 120px
}

.scroll .mbMenu a {
    height: 60px;
    float: left;
    display: block;
    text-align: center;
    width: 20%
}

.scroll .mbMenu {
    overflow: hidden;
    top: 0;
    right: 0;
    width: 220px
}

.scroll .mbMenu span {
    width: 34px;
    height: 34px;
    display: block;
    margin: 0 auto;
    margin-top: 2px
}

.scroll .mbMenu em {
    display: none
}

.scroll .depthNavi {
    position: fixed;
    top: 60px;
    left: 0;
    right: 0;
    z-index: 100
}

.scroll .depthNavi .container-inner {
    max-width: 100%
}

.scroll .depthNavi img {
    max-width: 15px
}

.scroll .snbBg {
    background: #fff;
    position: fixed;
    top: 60px;
    left: 0;
    right: 0;
    border-left: 0px none;
    border-right: 0px none
}

.scroll .gnbMenu > ul > li {
    height: 60px
}

.scroll .gnbMenu > ul > li:nth-child(5):after {
    top: 21px
}

.scroll .gnbMenu > ul > li > ul {
    top: 60px
}

.scroll .gnb .etcMenu li {
    line-height: 60px;
    width: 60px
}

.scroll .gnb .etcMenu li a img {
    max-width: 25px
}

.scroll .gnb .etcMenu li a.close img {
    max-width: 20px
}

.scroll .searchBox .innerWrap {
    margin-top: 156px
}

.scroll .gnbMenu.active .fmaSection {
    right: -180px;
    width: 180px;
}

.scroll .gnb .siteName {
    position: absolute;
    top: 16px;
    left: 15px
}

.scroll .gnb .siteName img {
    max-width: 130px
}

/* main*/
.mainSliderWrap {
    background: url('../img/common/mainslider_bg.gif') repeat-y center top;
    margin-top: -154px;
}

.mainSliderWrap .item {
    /*display: table;*/
    display: flex;
    align-items: center;
    width: 100%
}

.mainSliderWrap .item .bookSet, .mainSliderWrap .item .bookinfo {
    display: table-cell;
    vertical-align: middle;
    /* padding: 240px 0 120px 0 */
    padding: 200px 0 91px 0;
}

.mainSliderWrap .item .bookSet {
    text-align: center;
    width: 690px;
    text-align: right;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    gap: 26px;
}

/*20231121 추가*/
.mainSliderWrap .item .bookSet .img-wrap{
    position: relative;
    /* padding-top: 34.5%;
    max-width: 168px;
    width: 168px; */
    padding-top: 29.248%;
    max-width: 142.8px;
    width: 142.8px;
}

.mainSliderWrap .item .bookSet img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    max-width: 100%;
    box-shadow: 10px 20px 25px rgba(0,0,0,0.3);    
}
.mainSliderWrap .item .bookSet .img-wrap.small {
    padding-top: 25.8%;
    width: 126px;
    max-width: 126px;
}

/* .mainSliderWrap .item .bookSet img {
    margin: 0 15px;
    max-width: 140px;
    height: auto;
    box-shadow: 10px 20px 25px rgba(0,0,0,0.3)
}

.mainSliderWrap .item .bookSet img.small {
    max-width: 100px;
    height: auto;
    vertical-align: bottom
} */

.mainSliderWrap .item .bookinfo {
    padding-left: 50px
}

.mainSliderWrap .item .bookinfo h1 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    /* font-size: 2rem; */
    font-size: 1.8rem;
    line-height: 2.5rem;
    color: #272c38;
    font-weight: 900;
    position: relative;
    padding-left: 35px
}

.mainSliderWrap .item .bookinfo h1:before {
    content: url('../img/common/double_quotes.png');
    position: absolute;
    top: -18px;
    left: 0
}

.mainSliderWrap .item .bookinfo .desp {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    /* font-size: 1.5rem;
    line-height: 1.95rem; */
    font-size: 1.2rem;
    line-height: 1.7rem;
    color: #272c38;
    /* margin-top: 20px; */
    margin-top: 17px;
    max-width: 500px
}

.mainSliderWrap .item .bookinfo .goLaunch {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    display: inline-block;
    background: #272c38;
    color: #fff;
    width: 150px;
    height: 46px;
    line-height: 46px;
    text-align: center;
    font-size: 1.2rem;
    margin-top: 20px
}

/*
.mainSliderWrap .bx-controls { position:absolute; left:0; bottom:20px; width:100% }
.mainSliderWrap .bx-pager { text-align:center }
.mainSliderWrap .bx-pager .bx-pager-item { display:inline-block }
.mainSliderWrap .bx-pager .bx-pager-item a { display:inline-block; text-indent:-9999px; width:8px; height:8px; background:rgba(39,44,56, 0.45); margin:0 10px; transition:all .3s ease }
.mainSliderWrap .bx-pager .bx-pager-item a.active { background:rgba(39,44,56, 1); width:72px }
*/
.mainSliderWrap .swiper-pagination {
    bottom: 50px
}

.mainSliderWrap .swiper-pagination-bullet {
    border-radius: 0;
    background: rgba(39,44,56,0.3);
    opacity: 1;
    transition: all .3s ease;
    outline: none
}

.mainSliderWrap .swiper-pagination-bullet-active {
    background: rgba(39,44,56, 1);
    width: 50px
}

.mainSliderWrap .swiper-button-next, .mainSliderWrap .swiper-button-prev {
    display: none;
    border: 1px solid #eaeaea;
    width: 40px;
    height: 40px;
    overflow: hidden;
    padding: 4px 15px;
    background: url('../img/common/swiper_arrow.png') no-repeat center center / 15px auto #fff;
    text-indent: -9999px;
    position: absolute;
    top: 84px;
    outline: none
}

.mainSliderWrap .swiper-button-prev {
    transform: rotate(-180deg)
}

.mSectionA {
    overflow: hidden;
    margin-top: 30px;
    /* height: 190px; */
}

.mSectionA .container-inner{
    display: flex;
    gap: 20px;
}

.bnSliderWrap {
    position: relative;
    width: 955px;  
    border: 1px solid #ECECEC;
}

/*
.bnSliderWrap .bx-controls { position:absolute; right:10px; bottom:10px }
.bnSliderWrap .bx-pager { text-align:center }
.bnSliderWrap .bx-pager .bx-pager-item { display:inline-block }
.bnSliderWrap .bx-pager .bx-pager-item a { display:inline-block; text-indent:-9999px; width:8px; height:8px; background:rgba(255,255,255, 0.45); margin:0 10px; transition:all .3s ease }
.bnSliderWrap .bx-pager .bx-pager-item a.active { background:rgba(39,44,56, 1); width:72px }
*/
.bnSliderWrap .swiper-wrapper {
    height: 190px;
}
.bnSlider .item {
    height: 100%;
}

.bnSlider .item a {
    height: 100%;
    display: block;
    position: relative;
    overflow: hidden;
}
.bnSlider .item a img{
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    height: 100%;
}

.bnSliderWrap .swiper-pagination {
    position: inherit;
    width: auto;
    font-size: 16px;
}

.bnSliderWrap .swiper-pagination span {
    font-size: 16px;
}

.bnSliderWrap .swiper-pagination-bullet {
    border-radius: 0;
    background: rgba(39,44,56,0.3);
    opacity: 1;
    transition: all .3s ease;
    outline: none
}

.bnSliderWrap .swiper-pagination-bullet-active {
    background: rgba(39,44,56, 1);
    width: 50px
}

.bnSliderWrap .indicator {
    display: flex;
    gap: 12px;
    height: 50px;
    align-items: center;
    background-color: #FAFAFA;
    border-top: 1px solid #ECECEC;
    padding: 0 20px;
}
.bnSliderWrap .indicator .more-btn {
    margin-left: auto;
}
.bnSliderWrap .indicator .swiper-button-prev {
    display: block;
    background: url('../img/common/ico_arrow_active_next.svg') no-repeat center / contain;
    transform: rotate(-180deg);
    position: inherit;
    width: 24px;
    height: 24px;
    margin-top: 0;
}
.bnSliderWrap .indicator .swiper-button-prev::after,
.bnSliderWrap .indicator .swiper-button-next::after {
    display: none;
}
.bnSliderWrap .indicator .swiper-button-next {
    display: block;
    background: url('../img/common/ico_arrow_active_next.svg') no-repeat center / contain;
    position: inherit;
    width: 24px;
    height: 24px;
    margin-top: 0;
}
.bnSliderWrap .indicator .swiper-button-prev.swiper-button-disabled {
    background: url('../img/common/ico_arrow_disabled_prev.svg') no-repeat center / contain;
    transform: rotate(0);
    opacity: 1;
}
.bnSliderWrap .indicator .swiper-button-next.swiper-button-disabled {
    background: url('../img/common/ico_arrow_disabled_prev.svg') no-repeat center / contain;
    transform: rotate(-180deg);
    opacity: 1;
}
.bnSliderWrap .indicator .swiper-button-play {
    text-indent: -9999px;
    background: url('../img/common/ico_play.svg') no-repeat center / contain;
    width: 24px;
    height: 24px;
    display: none;
    margin-left: -8px;
}
.bnSliderWrap .indicator .swiper-button-pause {
    text-indent: -9999px;
    background: url('../img/common/ico_stop.svg') no-repeat center / contain;
    width: 24px;
    height: 24px;
    margin-left: -8px;
}
.bnSliderWrap .indicator .more-btn {
    font-size: 16px;
    font-weight: 500;
    display: flex;
    align-items: center;
}
.bnSliderWrap .indicator .more-btn::before {
    content: '';
    display: block;
    background: url('../img/common/ico_hamberger.svg') no-repeat center / contain;
    width: 24px;
    height: 24px;
}

.listDownload {
    font-family: 'NanumSquare', 'MalgunGothic', 'Dotum', 'Gulim', 'Arial', sans-serif;
    margin-left: auto;
    width: 305px;
    box-sizing: border-box;
    background-color: #2C93E8;

}
.listDownload h2 {
    font-family: 'NanumSquare', 'MalgunGothic', 'Dotum', 'Gulim', 'Arial', sans-serif;
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-left: 20px;
    line-height: 50px;
}
.listDownload h2::after {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    background-color: rgba(0,0,0,0.3);
    background-image: url('../img/common/ico_arrwo_next.svg');
    background-position: center;
    background-repeat: no-repeat;
}
.listDownload ul {
    background-color: rgba(0,0,0,0.25);
}
.listDownload ul li {
}
.listDownload ul li:not(:first-child) a{
    border-top: 1px solid rgba(255,255,255,0.25);
}
.listDownload ul li a {
    font-family: 'NanumSquare', 'MalgunGothic', 'Dotum', 'Gulim', 'Arial', sans-serif;
    font-size: 1.04rem;
    font-weight: 700;
    display: block;
    color: #fff;
    padding: 9.5px 40px 9.5px 30px;
    position: relative;
}
.listDownload ul li a::before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 28px;
    height: 28px;
    margin-right: 15px;
}
.listDownload ul li:first-child a::before {
    background-image: url('../img/common/ico_down_file.svg');
}
.listDownload ul li:nth-child(2) a::before {
    background-image: url('../img/common/ico_down_ppt.svg');
}
.listDownload ul li:nth-child(3) a::before {
    background-image: url('../img/common/ico_down_sheet.svg');
}
.listDownload ul li:nth-child(4) a::before {
    background-image: url('../img/common/ico_down_test.svg');
}
.listDownload ul li a::after {
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 100%;
    background-color: rgba(255,255,255,0.2);
    background-image: url('../img/common/ico_arrwo_next.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 6px;
    position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
}


/*smartCenter*/
.smartCenter {
    font-family: 'NanumSquare', 'MalgunGothic', 'Dotum', 'Gulim', 'Arial', sans-serif;
    transform: skew(-0.03deg);
    padding: 30px 0 40px;
}
.smartCenter h2 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 2.5rem;
    line-height: 2.815rem;
    font-weight: 500;
    position: relative;
    padding-bottom: 10px
}
.smartCenter h2:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 48px;
    height: 4px;
    background: #272c38
}
.smartCenter .flex-wrap {
    display: flex;
    gap: 20px;
    padding-top: 30px;
}
.smartCenter .flex-wrap .col.left {
    width: calc(100% - 305px);
}
.smartCenter .flex-wrap .col.left ul {
    display: flex;
    gap: 15px;
}
.smartCenter .flex-wrap .col.left ul li {
    flex: 1;
}
.smartCenter .flex-wrap .col.left ul li a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: #F7F7F7;
    padding: 0 2vw;
    border-radius: 12px;
    min-height: 193px;
}
.smartCenter .flex-wrap .col.left ul li a p {
    font-size: 20px;
    font-weight: 700;
    padding-bottom: 20px;
}
.smartCenter .flex-wrap .col.right {
    margin-left: auto;
    width: 305px;
}
.smartCenter .flex-wrap .col.right a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 193px;
    border-radius: 8px;
    background-color: #FF5C5C;
    background-image: url('../img/data/img_smart_Bg.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.smartCenter .flex-wrap .col.right a p {
    background-color: rgba(255,255,255,0.65);
    font-size: 17px;
    font-weight: 700;
    line-height: 39px;
    color: #444;
    border-radius: 20px;
    padding: 0 14px;
    margin-bottom: 10px;
}
.smartCenter .flex-wrap .col.right a p span {
    color: #EC4848;
    font-weight: 800;
}


/*mainContents*/
.mainContents {
    font-family: 'NanumSquare', 'MalgunGothic', 'Dotum', 'Gulim', 'Arial', sans-serif;
    transform: skew(-0.03deg);
    padding: 40px 0;
    background-color: #F0F4F6;
}
.mainContents h2 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 2.5rem;
    line-height: 3rem;
    font-weight: 500;
    position: relative;
    padding-bottom: 10px
}
.mainContents h2:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 48px;
    height: 4px;
    background: #272c38
}
.mainContents .flex-wrap {
    display: flex;
    gap: 30px;
    padding-top: 30px;
}
.mainContents .flex-wrap .col.left {
    width: calc(100% - 320px);
}
.mainContents .flex-wrap .col.left h3 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 24px;
    line-height: 1.125;
    font-weight: 700;
}
.mainContents .flex-wrap .col.left ul {
    display: flex;
    gap: 20px;
    margin-top: 20px;
}
.mainContents .flex-wrap .col.left ul li {
    width: 33.33%;
}
.mainContents .flex-wrap .col.left ul li a {
    display: block;
    border-radius: 12px;
    border: 1px solid #E3E3E3;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position: top;
    background-size: 100% 75px;
    background-color: #fff;
}
.mainContents .flex-wrap .col.left ul li.eng a {
    background-image: url('../img/data/img_thumb_eng.png');
}
.mainContents .flex-wrap .col.left ul li.chn a {
    background-image: url('../img/data/img_thumb_chn.png');
}
.mainContents .flex-wrap .col.left ul li.japan a {
    background-image: url('../img/data/img_thumb_japan.png');
}
.mainContents .flex-wrap .col.left ul li a .desc-box {
    margin-top: 75px;
    padding: 30px 20px;
    position: relative;
}
.mainContents .flex-wrap .col.left ul li a .desc-box .flag {
    position: absolute;
    top: -22.5px;
    right: 22px;
    width: 45px;
    height: 45px;
    border-radius: 100%;
    background-color: #fff;
    box-shadow: 0 2px 8px 0 rgba(0,0,0,0.15);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 28px;
}
.mainContents .flex-wrap .col.left ul li.eng a .desc-box .flag {
    background-image: url('../img/common/ico_flag_eng.svg');
}
.mainContents .flex-wrap .col.left ul li.chn a .desc-box .flag {
    background-image: url('../img/common/ico_flag_chn.svg');
}
.mainContents .flex-wrap .col.left ul li.japan a .desc-box .flag {
    background-image: url('../img/common/ico_flag_japan.svg');
}
.mainContents .flex-wrap .col.left ul li a .desc-box p {
    font-size: 20px;
    font-weight: 700;
}
.mainContents .flex-wrap .col.left ul li a .desc-box span {
    font-size: 18px;
    width: 100%;
    display:-webkit-box;
    -webkit-line-clamp:1; /* 라인수 */
    -webkit-box-orient:vertical;
    white-space:normal;    
    overflow:hidden;
    text-overflow:ellipsis;
    margin-top: 10px;
    line-height: 1.28;
}
.mainContents .flex-wrap .col.right h3 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 24px;
    font-weight: 700;
}
.mainContents .flex-wrap .col.right h3 span {
    font-size: 24px;
    font-weight: 800;
}
.mainContents .flex-wrap .col.right a {
    display: block;
    margin-top: 30px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}
.mainContents .flex-wrap .col.right a::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.1);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    transition: 0.3s all;
    visibility: hidden;
    opacity: 0;
}
.mainContents .flex-wrap .col.right a::after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 56px;
    height: 56px;
    background-color: rgba(255,255,255,0.8);
    border-radius: 100%;
    background-image: url('../img/common/ico_play_blue.svg');
    background-repeat: no-repeat;
    background-position: center;
    transition: 0.3s all;
    visibility: hidden;
    opacity: 0;
}
.mainContents .flex-wrap .col.right a:hover::before,
.mainContents .flex-wrap .col.right a:focus::before {
    visibility: visible;
    opacity: 1;    
}
.mainContents .flex-wrap .col.right a:hover::after,
.mainContents .flex-wrap .col.right a:focus::after {
    visibility: visible;
    opacity: 1;    
}


/*bestSeller*/
.bestSeller {
    position: relative;
    max-width: 1280px;
    margin: 0 auto;
    padding: 50px 0;
    height: 447px;
}

.bestSeller .container-inner {
    height: 460px
}

.bestSeller h2 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 2.5rem;
    line-height: 3rem;
    font-weight: 500;
    position: relative;
    padding-bottom: 10px
}

.bestSeller h2:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 48px;
    height: 4px;
    background: #272c38
}

.bestSeller .desp {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    position: absolute;
    top: 90px;
    font-size: 2rem;
    line-height: 2.8rem;
    /*text-shadow:3px 5px 2px rgba(0,0,0,0.15)*/
    letter-spacing: -1px;
}

.bestSeller .bestSliderWrap {
    position: absolute;
    top: 70px;
    right: 0;
    width: 900px
}

.bestSliderWrap .item {
    width: 190px
}

.bestSliderWrap .item a {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.04rem;
    line-height: 1.3rem;
    font-weight: 500
}

.bestSliderWrap .item img {
    display: block;
    margin: 0 0 10px;
    height: 270px;
    width: 190px;
    transition: all .3s ease
}

.bestSliderWrap .item a:hover img {
    box-shadow: 8px 8px 0 rgba(0,0,0,0.15)
}

.bestSeller .swiper-buttons {
    position: absolute;
    left: 0;
    top: 384px;
    z-index: 100
}

.bestSeller .swiper-buttons .swiper-button-next, .bestSeller .swiper-buttons .swiper-button-prev {
    display: inline-block;
    width: 90px;
    height: 65px;
    text-align: center;
    line-height: 65px;
    color: #111;
    border: 1px solid #e9e9e9;
    font-size: 1.8rem;
    font-weight: 100;
    right: 0;
    left: 0;
    transition: all .6s ease;
    position: relative;
    background: url('../img/common/swiper_arrow.png') no-repeat center center / 30px auto #fff;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    outline: 0px none
}

.bestSeller .swiper-buttons > div:hover {
    border-color: #272c38
}

.bestSeller .swiper-buttons .swiper-button-prev {
    transform: rotate(-180deg)
}

.bestSeller .swiper-buttons .swiper-button-disabled {
    opacity: 0.6;
    background-color: #e3e3e3
}

/* material */
/* .material {
    font-family: 'NanumSquare', 'MalgunGothic', 'Dotum', 'Gulim', 'Arial', sans-serif;
    transform: skew(-0.03deg);
    background: #fcfcfc;
    padding: 56px 0;
    margin: 50px 0 0 0
}

.material:after {
    content: '';
    clear: both;
    display: block;
}

.material-Left {
    float: left;
    width: 58.5%;
    position: relative;
}

.material-Left:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background-color: #dcdcdc;
}

.material-Right {
    float: right;
    width: 39%;
} */

.teacherTitle {
    position: relative;
    margin-bottom: 30px;
}

.teacherTitle:after {
    content: '';
    clear: both;
    display: block;
}

.teacherTitle > p {
    float: left;
    padding-right: 7px;
    font-size: 24px;
    font-weight: bold;
    color: #272c38;
}

.teacherTitle img {
    cursor: pointer;
}

/* .question-Tbox {display: flex; justify-content: center; align-items: center; position: absolute; left: 27%; bottom: -80%; background: url(../img/common/speech_bubble.png) no-repeat center center; background-size: cover; width: 257px; height: 103px; text-align: center;} */
.teacherTitle img:hover ~ div {
    display: block;
    transition: 0.3s;
}

.teacherTitle > div {
    display: none;
}

.question-Tbox {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    text-align: center;
    width: 100%;
    height: 100%;
    text-align: left;
}

.question-Tbox p {
    position: absolute;
    font-size: 16px;
    color: #454545;
    font-weight: bold;
    line-height: 24px;
    bottom: 17px;
    left: 34%;
    z-index: 1;
}

.question-Tbox img {
    position: absolute;
    bottom: -15px;
    left: 28%;
}

.material h2 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 2.5rem;
    line-height: 3rem;
    font-weight: 500;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 50px
}

.material h2:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 58px;
    height: 4px;
    background: #272c38
}

.material-Icon:after {
    content: "";
    display: block;
    clear: both
}

.material-Icon li {
    float: left;
    text-align: center;
    position: relative
}

.material-Icon li a {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    display: block;
    font-size: 1.04rem
}

.material-Icon li a span {
    display: block;
    margin: 0 auto 14px;
    background-color: #fff;
    border: 1px solid #d3d7de;
    width: 96px;
    height: 96px;
    border-radius: 500px;
    line-height: 96px;
    position: relative;
    z-index: 10
}

.material-Icon li a span img {
    margin: 0 auto;
    max-width: 60px;
    transition: all .4s ease
}

.material-Icon li a:hover span img {
    transform: scale(0.85)
}

.material-Icon li a em {
    opacity: 0;
    display: block;
    width: 96px;
    height: 96px;
    background: #495164;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -48px;
    transform: scale(1.2);
    border-radius: 500px;
    transition: all .4s ease
}

.material-Icon li a:hover em {
    transform: scale(1.2);
    opacity: 1
}

.material-Icon .swiper-container {
    overflow: visible
}

.material-Icon {
    font-weight: bold;
}

.material-Icon li:last-child {
    margin-right: 0;
}

.material-Left .material-Icon1 li {
    width: 15%;
    margin-right: 10px;
}

.material-Right .material-Icon2 li {
    width: 22%;
    margin-right: 10px;
}

.material-Right > p {
    font-size: 24px;
    font-weight: bold;
    color: #272c38;
}

.material-Icon.material-Icon2 {
    margin-top: 30px;
}

.material-Icon li:nth-child(5) a span img, .material-Icon li:nth-child(6) a span img {
}

.material-Icon li:nth-child(5) a span, .material-Icon li:nth-child(6) a span {
    border: none;
}

.material-Icon li:nth-child(5) a span {
    background: url(../img/common/data_icon_12_2.png) no-repeat center center;
    background-size: cover;
}

.material-Icon li:nth-child(6) a span {
    background: url(../img/common/data_icon_13_2.png) no-repeat center center;
    background-size: cover;
}

.notice {
    padding: 90px 0 50px 0;
    height: 468px;
}

.notice h2 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 2.5rem;
    line-height: 3rem;
    font-weight: 500;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 50px
}

.notice h2:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 52px;
    height: 4px;
    background: #272c38
}

.notice ul {
    border-top: 2px solid #bdbec2;
    border-bottom: 2px solid #bdbec2
}

.notice li {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    display: table;
    width: 100%;
    font-size: 1.2rem
}

.notice li a:hover {
    color: #e8463e
}

.notice li span {
    display: table-cell;
    vertical-align: middle;
    padding: 25px 0
}

.notice li span:nth-child(1) {
    width: 20%;
    padding-left: 60px;
    font-weight: 900
}

.notice li span:nth-child(3) {
    width: 20%;
    text-align: right;
    padding-right: 60px;
    color: #9da1a5
}

.notice .moreview {
    position: absolute;
    display: inline-block;
    width: 90px;
    height: 65px;
    line-height: 65px;
    font-size: 1.8rem;
    text-align: center;
    top: 0;
    right: 0;
    background: #272c38;
    color: #fff;
    /*box-shadow:5px 7px 10px rgba(0,0,0,0.15)*/
}

.support {
    background: #746aff;
    margin-bottom: -80px;
    padding: 80px 0 100px 0;
    color: #fff;
    height: 488px
}

.support h2 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 2.5rem;
    line-height: 3rem;
    font-weight: 500;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 50px;
    color: #fff
}

.support h2:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 48px;
    height: 4px;
    background: #fff
}

.suppertSet {
    /* background: url('../img/common/csmenu_bg.gif') repeat-y center top; */
    position: relative;
}
.suppertSet .container-inner{
    display: flex;
    justify-content: space-between;
    gap: 40px;
    align-items: flex-start;
}

.suppertSet .csinfo {
    position: relative;
    width: 380px;
    height: 200px;
    background-color: #272c38;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 24px;
    z-index: 1;
}
.suppertSet .csinfo::before{
    content: '';
    display: block;
    width: 300%;
    height: 100%;
    background-color: #272c38;
    position: absolute;
    top: 0;
    left: -299%;
    z-index: -1;
}

.suppertSet .csinfo h3 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.6rem;
    line-height: 1.6rem;
    font-weight: 900;
    color: #fff;
}

.suppertSet .csinfo strong, .suppertSet .csinfo span {
    display: block
}

.suppertSet .csinfo strong {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.7rem;
    line-height: 1.7rem;
    font-weight: 500;
}

.suppertSet .csinfo a {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-80%);
    display: inline-block;
    height: 65px;
    line-height: 65px;
    padding: 0 20px;
    background: #fff;
    color: #272c38;
    font-size: 1.1rem;
    font-weight: 700
}

.suppertSet .csMenu {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    width: calc(100% - 380px - 40px);
}
.suppertSet .csMenu ul {
    display: flex;
    gap: 10px 20px;
}
.suppertSet .csMenu li {
    width: 200px;
    height: 200px;
    transition: all .3s ease
}

.suppertSet .csMenu li:first-child {
    margin: 0
}

.suppertSet .csMenu li:nth-child(1) {
    background: url('../img/common/csmenu_1.png') no-repeat left top /contain
}

.suppertSet .csMenu li:nth-child(2) {
    background: url('../img/common/csmenu_2.png') no-repeat left top /contain
}

.suppertSet .csMenu li:nth-child(3) {
    background: url('../img/common/csmenu_3.png') no-repeat left top /contain
}

.suppertSet .csMenu li:nth-child(4) {
    background: url('../img/common/csmenu_4.png') no-repeat left top /contain
}

.suppertSet .csMenu li a {
    display: block;
    height: 99%;
    transition: all .3s ease
}

.suppertSet .csMenu li a:hover {
    background: rgba(255,255,255,0.1)
}

.suppertSet .csMenu li a span {
    display: block;
    padding: 30px 0 0 20px;
    font-size: 1.4rem;
    line-height: 1.4rem
}

.suppertSet .csMenu li:hover {
    transform: scale(1.1)
}

/* item details */
.itemDetails {
    display: table;
    width: 100%
}

.itemDetailsTop {
    display: table;
    width: 100%;
    margin-top: 24px;
    margin-bottom: 50px
}

.itemDetails .table-cell {
    display: table-cell;
    vertical-align: top
}

.itemDetails .mContents {
    padding-right: 50px
}

.itemDetailsTop .thumbsSet {
    width: 260px
}

.itemDetailsTop .iteminfo {
    padding: 0 0 0 60px
}

.thumbsSet .image img {
    border-radius: 6px;
    box-shadow: 0 0 14px rgba(0,0,0,0.2);
    width: 260px;
    height: 368px
}

.thumbsSet .etcLink {
    text-align: center;
    position: relative
}

.thumbsSet .etcLink > ul > li {
    display: inline-block;
    position: relative
}

.thumbsSet .etcLink > ul > li > a {
    margin: 30px 3px 0 3px;
    display: block;
    border-radius: 500px;
    height: 48px;
    line-height: 48px;
    border: 1px solid #111;
    font-weight: 500;
    color: #111;
    letter-spacing: -1px
}

.thumbsSet .etcLink > ul > li.wideBtn > a {
    padding: 0 20px;
    font-size: 0.9rem
}

.thumbsSet .etcLink > ul > li > a img {
    vertical-align: top
}

.shareBox {
    display: none;
    position: absolute;
    top: 80px;
    left: 0;
    width: 350px;
    background: #fff;
    border: 1px solid #e4e4e4;
    padding: 15px;
    text-align: center;
    z-index: 10
}

.shareBox li {
    display: inline-block;
    vertical-align: middle;
    margin: 0 5px
}

.shareBox:before {
    content: url('../img/common/tooltip_arrow.png');
    position: absolute;
    top: -17px;
    left: 18px;
    width: 18px;
    height: 11px
}

.thumbsSet .etcLink > ul > li.openShareBox:hover .shareBox {
    display: block
}

.shareBox li a.copyUrl {
    display: inline-block;
    background: url('../img/common/icon_urlcopy.png') no-repeat center top;
    padding-top: 38px;
    font-size: 0.8rem;
    line-height: 1rem;
    color: #666;
    height: 50px;
    width: 50px;
    text-align: center
}

.shareBox li a.copyUrl br {
    display: none
}

.iteminfo .hash span {
    display: inline-block;
    font-size: 0.82rem;
    height: 28px;
    line-height: 28px;
    border: 1px solid #327194;
    padding: 0 15px;
    color: #327194;
    margin-bottom: 4px
}

.iteminfo .hash span:before {
    content: "#"
}

.iteminfo .itemName h1 {
    font-family: "NanumSquareRound";
    color: #272c38;
    font-size: 2.65rem;
    line-height: 3.2rem;
    font-weight: 600;
    margin: 24px 0 10px 0;
    letter-spacing: -2px;
}

.iteminfo .subScript {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.04rem;
}

.iteminfo .subScript:before {
    content: "|";
    font-weight: 900;
    color: #272c38;
    padding-right: 10px
}

.iteminfo .pinfo {
    display: inline-block;
    border-radius: 500px;
    padding: 0 20px;
    height: 28px;
    margin: 10px 0;
    line-height: 28px;
    background: #a0a0a0;
    color: #fff;
    font-size: 0.9rem;
    font-weight: 400
}

.iteminfo .pinfo span {
    position: relative;
    padding: 0 10px 0 5px
}

.iteminfo .pinfo span:not(:last-child):after {
    content: "";
    position: absolute;
    top: 5px;
    right: 0;
    width: 1px;
    height: 13px;
    background: rgba(255,255,255,0.75)
}

.iteminfo .rtSection {
    position: relative;
    border-top: 1px solid #b9babe;
    border-bottom: 1px solid #b9babe;
    padding: 10px 0 6px 0
}

.iteminfo .rtSection strong {
    position: absolute;
    top: 14px;
    left: 0;
    font-weight: 500
}

.iteminfo .rtSection ul {
    margin-left: 100px
}

.iteminfo .rtSection li {
    display: inline-block;
    margin-right: 4px;
    margin-bottom: 4px
}

.iteminfo .rtSection li a {
    display: block;
    font-size: 0.88rem;
    height: 28px;
    line-height: 26px;
    padding: 0 15px;
    border-radius: 500px;
    border: 1px solid #004f7a;
    background: #004f7a;
    color: #fff
}

.iteminfo .rtSection li a.classMov {
    display: block;
    font-size: 0.88rem;
    height: 28px;
    line-height: 26px;
    padding: 0 15px;
    border-radius: 500px;
    border: 1px solid #e8463e;
    background: #e8463e;
    color: #fff
}

.itemPrice {
    margin-top: 30px;
    position: relative;
    padding-left: 100px
}

.itemPrice:before {
    content: "가격";
    position: absolute;
    top: 3px;
    left: 0;
    color: #999
}

.itemPrice .salePrice strong {
    vertical-align: top;
    display: inline-block;
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.8rem;
    line-height: 1.8rem;
    font-weight: 800;
    margin-right: 20px
}

.itemPrice .hasCoupon a {
    vertical-align: top;
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0 15px;
    border: 1px solid #e8463e;
    color: #e8463e;
    border-radius: 500px;
    height: 28px;
    line-height: 24px
}

.itemPrice .originalPrice {
    margin-top: 14px
}

.itemPrice .originalPrice p {
    display: inline-block;
    font-weight: 700
}

.itemPrice .originalPrice p:first-child {
    opacity: 0.5
}

.itemPrice .originalPrice p strong {
    text-decoration: line-through
}

.itemPrice .originalPrice p:not(:first-child):before {
    content: "/";
    padding-right: 5px
}

.ctrlOption {
    margin-top: 15px
}

.ctrlCount {
    position: relative;
    display: inline-block;
    vertical-align: top;
    padding-left: 100px
}

.ctrlCount:before {
    content: "수량";
    position: absolute;
    top: 10px;
    left: 0;
    color: #999
}

.ctrlCount a {
    display: inline-block;
    width: 44px;
    height: 44px;
    border: 2px solid #ededed
}

.ctrlCount a:hover {
    background: #ededed
}

.ctrlCount input {
    background: transparent none;
    border: 0px none;
    border-top: 2px solid #ededed;
    border-bottom: 2px solid #ededed;
    height: 44px;
    line-height: 44px;
    text-align: center;
    width: 60px;
    margin: 0 -5px
}

td .ctrlCount {
    padding: 0
}

td .ctrlCount:before {
    content: ""
}

.ctrlSeries {
    position: relative;
    display: inline-block;
    vertical-align: top;
    padding-left: 90px;
    margin-left: 20px
}

.ctrlSeries .toggleSeries {
    display: block;
    position: relative;
    height: 44px;
    width: 250px;
    text-indent: 15px;
    line-height: 40px;
    border: 2px solid #ededed
}

.ctrlSeries .toggleSeries span {
    width: 12px;
    height: 7px;
    background: url('../img/common/arrow_toggle.png');
    position: absolute;
    top: 15px;
    right: 15px;
    transform: rotate(0);
    transition: all .3s ease
}

.ctrlSeries.active .toggleSeries span {
    transform: rotate(-180deg)
}

.ctrlSeries .toggleSeries p {
    font-size: 13px;
    color: #666
}

.ctrlSeries .toggleSeries p strong {
    font-size: 15px
}

.ctrlSeries:before {
    content: "시리즈 도서";
    position: absolute;
    top: 10px;
    left: 0;
    color: #999
}

.seriesListContent {
    display: none;
    position: absolute;
    bottom: 42px;
    right: 0;
    min-width: 340px;
    background: #fff;
    border: 2px solid #ededed;
    z-index: 90
}

.selectedTotal {
    border-bottom: 1px solid #ddd;
    margin: 0 15px;
    padding: 15px 0;
    position: relative
}

.seriesList {
    max-height: 180px;
    overflow: auto
}

.seriesList li {
    margin: 10px 15px;
    position: relative
}

.seriesFooter {
    padding: 10px 15px;
    border-top: 1px solid #e3e3e3;
    position: relative;
    text-align: right
}

.seriesFooter span {
    color: #e8463e
}

.seriesFooter span:before {
    content: "선택한 교재";
    font-size: 13px;
    color: #797979;
    padding-right: 5px
}

.ctrlMyStat {
    margin-top: 21px
}

.ctrlMyStat a {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    display: inline-block;
    vertical-align: top;
    font-size: 1.1rem;
    height: 48px;
    line-height: 48px;
    padding: 0 50px;
    color: #fff;
    font-weight: 700;
    margin-right: 8px
}

.ctrlMyStat a.addWish {
    border: 1px solid #909298;
    padding: 0
}

.ctrlMyStat a.addWish img {
    max-width: 50px
}

.ctrlMyStat a.addCart {
    background: #272c38
}

.ctrlMyStat a.goPayment {
    background: #e8463e
}

.ctrlMyStat a:last-child {
    margin-right: 0;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: -webkit-calc(100% - 72px);
    max-width: calc(100% - 72px);
    max-width: -moz-calc(100% - 72px);
}

.seriesListContent input[type="checkbox"]:not(.cssbrowser) {
    display: none;
}

.seriesListContent input[type="checkbox"]:not(.cssbrowser) + label {
    display: block;
    padding-left: 30px;
}

.seriesListContent input[type="checkbox"]:not(.cssbrowser) + label:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 24px;
    height: 24px;
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 0;
}

.seriesListContent input[type="checkbox"]:not(.cssbrowser):checked + label:before {
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 -24px;
    font-weight: 900
}

.seriesListContent input[type="checkbox"]:not(.cssbrowser):disabled + label:before {
    opacity: 0.5
}

.seriesListContent .selectedTotal input[type="checkbox"]:not(.cssbrowser) + label:before {
    top: 15px
}

.whBox {
    background: #fff;
    border: 1px solid #e4e4e4
}

.itemDetails .whBox {
    margin-bottom: 15px; /* DOUB modify 20240829 */
}

.openNewLayerA {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    position: relative;
    display: block;
    height: 72px;
    line-height: 72px;
    font-size: 1.4rem;
    font-weight: 900;
    text-indent: 20px;
    background: #DCDCFF;
    display: flex;
    align-items: center;
    gap: 10px;
}


.openNewLayerA span {
    position: absolute;
    top: 26px;
    right: 35px;
    transition: all .3s ease
}

.openNewLayerA .pointRed {
    color: #E8463E;
    position: static;
    top: unset;
    right: unset;
    transition: unset;
}

.addtooltip{
    position: relative;
    z-index: 2;
}
.addtooltip .ico{
    display: block;
    background: url("../img/common/icon_question2.png") no-repeat center / contain;
    width: 25px;
    height: 25px;
}
.addtooltip .conts{
    position: absolute;
    left: 0;
    top: -220%;
    z-index: 1;
    display: none;
}
.addtooltip .conts .inner{
    font-size: 17px;
    color: #fff;
    line-height: 1.2;
    text-align: left;
    min-width: 400px;
    background-color: rgba(0,0,0,0.7);
    padding: 12px;
    z-index: 2;
    box-sizing: border-box;
    text-indent: 1px;
    position: relative;
}
.addtooltip .conts .inner::before{
    content: '';
    display: block;
    border-top: 10px solid rgba(0,0,0,0.7);
    border-bottom: 0 solid transparent; 
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    position: absolute;
    left: 8px;
    top: 100%;
    z-index: -1;
}
.addtooltip:hover .conts{
    display: block;
}

/*.openNewLayerA:hover span { right:20px }*/
.whBox h2 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.4rem;
    height: 72px;
    line-height: 72px;
    font-weight: 900;
    text-indent: 20px
}

.listTypeA table {
    width: 100%
}

.listTypeA thead th {
    background: #272c38;
    color: #fff;
    font-weight: 700;
    height: 46px;
    line-height: 46px;
    text-align: center;
    position: relative
}

.listTypeA thead th:before {
    content: "|";
    position: absolute;
    top: 0;
    left: 0;
    color: rgba(255,255,255,0.2);
    font-weight: 100
}

.listTypeA thead th:first-child:before {
    content: ""
}

.listTypeA tbody td {
    border-bottom: 1px solid #e5e5e5;
    padding: 0 10px
}

.listTypeA thead th input[type="checkbox"]:not(.cssbrowser) {
    display: none;
}

.listTypeA thead th input[type="checkbox"]:not(.cssbrowser) + label {
    display: inline-block;
    margin-top: 10px;
    height: 24px;
    line-height: 24px;
    background: url("../img/common/ic_checkbox_b.png") no-repeat 0 0 ;
    vertical-align: top;
    padding-left: 24px;
    text-indent: -9999px;
    opacity: 0.3
}

.listTypeA thead th input[type="checkbox"]:not(.cssbrowser):checked + label {
    opacity: 1
}

.listTypeA thead th input[type="checkbox"]:not(.cssbrowser):disabled + label {
    opacity: 0.5
}

.listTypeA tbody td input[type="checkbox"]:not(.cssbrowser) {
    display: none;
}

.listTypeA tbody td input[type="checkbox"]:not(.cssbrowser) + label {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 0;
    vertical-align: top;
    padding-left: 24px;
    text-indent: -9999px
}

.listTypeA tbody td input[type="checkbox"]:not(.cssbrowser):checked + label {
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 -24px;
}

.listTypeA tbody td input[type="checkbox"]:not(.cssbrowser):disabled + label {
    opacity: 0.5
}

.listTypeA th a span {
    font-size: 0.3rem;
    display: inline-block;
    margin-left: 15px;
    vertical-align: 2px;
    opacity: 0.7
}

.boardList.paddingTable td {
    padding: 15px
}

.listTypeA tr.on td {
    background: rgba(73,81,100,0.1)
}

.listTypeA .boardNoticeArticle td a {
    font-weight: 600
}

.itemListA .hash {
    padding-right: 110px
}

.boardList input[type=radio]:not(.cssbrowser) {
    display: none;
}

.boardList input[type=radio]:not(.cssbrowser) + label {
    display: inline-block;
    height: 23px;
    line-height: 23px;
    background: url("../img/popup/icon_radio.png") no-repeat 0 0;
    /* color:#818385; */
    vertical-align: middle;
    padding-left: 23px;
    text-indent: -9999px
}

.boardList input[type=radio]:not(.cssbrowser):checked + label {
    background: url("../img/popup/icon_radio.png") no-repeat 0 -23px;
}

.boardList input[type=radio]:not(.cssbrowser):disabled + label {
    opacity: 0.5
}

.boardList input[type=radio] + label + input[type=radio] + label {
    margin-left: 15px;
}

.whBox .ctrlData {
    background: #f7f7f7;
    padding: 20px
}

.detailsTab ul {
    overflow: hidden
}

.detailsTab li {
    float: left;
    width: 33%;
    height: 74px;
    line-height: 74px
}

.detailsTab li:first-child {
    width: 34%
}

.detailsTab li a {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    position: relative;
    display: block;
    text-align: center;
    font-size: 1.4rem;
    font-weight: 700;
    background: #efefef;
    color: #a0a1a4
}

.detailsTab li a strong {
    font-size: 1.2rem
}

.detailsTab li:not(:last-child) a:after {
    content: "";
    width: 2px;
    height: 25px;
    background: #e3e3e3;
    position: absolute;
    top: 24px;
    right: 0
}

.detailsTab li.active a {
    background: #fff;
    color: #272c38
}

.detailsTab li.active a:before {
    content: "";
    width: 100%;
    height: 4px;
    background: #272c38;
    position: absolute;
    top: 0;
    left: 0
}

.detailsTab li.active a:after {
    background: transparent none
}

.tabContent h2 {
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0 0 10px 0;
    text-indent: 0;
    height: 40px;
    line-height: 40px
}

.tabContent .inner {
    padding: 60px;
    line-height: 1.7rem;
    word-break: keep-all
}

.regReview {
    position: relative;
    margin-top: -10px
}

#review h2 strong {
    color: #e8463e
}

.regReview input[type="text"] {
    height: 60px;
    border: 2px solid #ededed;
    line-height: 60px;
    text-indent: 10px;
    width: 100%;
    padding-right: 230px;
    box-sizing: border-box
}

.regReview input[type="submit"] {
    background: #495164;
    color: #fff;
    border: 0px none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100px;
    cursor: pointer
}

.regReview span {
    position: absolute;
    top: 0;
    right: 110px;
    color: #999;
    line-height: 90px;
    pointer-events: none;
}

.regReview .textarea {
    background: #fff;
    border: 2px solid #e9e9e9;
    padding: 10px;
    position: relative;
    height: 90px;
    padding-right: 200px;
}

.regReview .textarea textarea {
    background: transparent;
    padding: 0;
    border: 0px none;
    width: 100%;
    height: 100%;
    resize: none
}

.reviewList .article {
    border-bottom: 1px solid #ebebeb
}

.reviewList .article .postinfo {
    padding-top: 20px;
    position: relative
}

.reviewList .article .postinfo span {
    margin-left: 20px;
    color: #999
}

.reviewList .article .postinfo .editArticle {
    position: absolute;
    top: 20px;
    right: 0
}

.reviewList .article .postinfo .editArticle a {
    font-size: 0.88rem;
    text-decoration: underline;
    margin-left: 8px;
    color: #999
}

.reviewList .article .text {
    line-height: 1.6rem;
    margin: 16px 0;
    height: 50px;
    overflow: hidden
}

.reviewList .article .text.open {
    height: auto;
    overflow: auto
}

.reviewList .article .ctrlArticle {
    position: relative;
    padding-bottom: 20px
}

.reviewList .article .ctrlArticle .toggle {
    position: absolute;
    right: 0;
    bottom: 24px
}

.reviewList .article .ctrlArticle .toggle a {
    font-size: 0.88rem;
    text-decoration: underline;
    margin-left: 8px;
    color: #999
}

/* 댓글의 댓글 */
.reviewList .article .article {
    padding: 0 40px 0 40px;
    border-top: 1px solid #d6d6d6;
    background: #f6f6f6
}

.reviewList .article .article .text {
    height: auto
}

/* .reviewList .article .article .ctrlArticle .btnDefault { background:#495164; color:#fff; border-color:#495164 }*/
.sContents {
    width: 300px;
    padding-top: 24px
}

.sContents .box {
    border: 2px solid #e4e4e4;
    background: #fff;
    position: relative;
    margin-bottom: 22px
}

.sContents .bnBox .box img {
    width: 296px ! important;
    height: auto ! important
}

.sContents .box .goCuration {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    display: block;
    font-size: 1.4rem;
    height: 100px;
    line-height: 100px;
    font-weight: 700;
    text-indent: 20px
}

.sContents .box .goCuration span {
    position: absolute;
    top: 40px;
    right: 35px;
    transition: all .3s ease
}

.sContents .box h2 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.2rem;
    font-weight: 700;
    margin: 25px 20px;
    text-indent: 0
}

.sContents .box .sideSlider {
    margin: 0 0 0 18px
}

.sContents .box .sideSlider .item {
    padding-bottom: 20px
}

.sContents .box .sideSlider .item a {
    font-size: 0.80rem;
    line-height: 1.1rem;
    display: block;
    color: #666;
    word-break: break-all;
    width: 74px
}

.sContents .box .sideSlider .item img {
    display: block;
    margin-bottom: 8px;
    width: 74px;
    height: 108px
}

.sContents .bx-controls-direction {
    position: absolute;
    top: 20px;
    right: 10px
}

.sContents .bx-controls-direction a {
    display: inline-block;
    width: 36px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    color: #111;
    border: 1px solid #e9e9e9;
    margin: 0 0 0 2px;
    transition: all .8s ease
}

.sContents .bx-controls-direction a.bx-prev:hover {
    box-shadow: inset -3em 0 0 rgba(39,44,56,1);
    color: #fff;
    border-color: #272c38
}

.sContents .bx-controls-direction a.bx-next:hover {
    box-shadow: inset 3em 0 0 rgba(39,44,56,1);
    color: #fff;
    border-color: #272c38
}

.sContents .bx-controls-direction a.disabled, .sContents .bx-controls-direction a.disabled:hover {
    cursor: default;
    color: #ccc ! important;
    box-shadow: none ! important;
    border-color: transparent;
    background: #f6f6f6
}

.box.boxCs {
    background: #272c38;
    color: #fff
}

.box.boxCs h2 {
    color: #fff
}

.boxCs strong {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 2.2rem;
    line-height: 2.6rem;
    font-weight: 400;
    display: block;
    padding: 0 0 0 20px;
    margin-top: -10px
}

.boxCs span {
    display: block;
    padding: 0 0 0 20px;
    font-size: 0.85rem
}

.boxCs ul {
    overflow: hidden;
    margin: 10px 20px 20px 20px
}

.boxCs li {
    float: left;
    width: 33.333%
}

.boxCs li a {
    display: block;
    margin: 0 0.5px;
    background: #fff;
    color: #272c38;
    text-align: center;
    height: 48px;
    line-height: 48px;
    font-weight: 700
}

.bnBox p {
    text-align: center;
    line-height: 150px
}

/* item list (book submain) */
.bnHori {
    background: #fff;
    padding: 30px 0;
    box-sizing: border-box;
    text-align: center;
    color: #999;
    font-size: 2rem;
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-weight: 100
}

.bnHori .container-inner {
}

.smainSlider {
    position: relative
}

.sliderContentWrap .smContent {
    display: none
}

.sliderContentWrap .smContent > div {
    line-height: 500px;
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 2.5rem;
    font-weight: 100;
    color: #999;
    text-align: center;
    height: 500px
}

.sliderTabs {
    position: absolute;
    top: 80px;
    right: 0;
    z-index: 10
}

.sliderTabs li {
    margin-bottom: 10px;
    position: relative
}

.sliderTabs li a {
    display: block;
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.1rem;
    font-weight: 700;
    height: 70px;
    line-height: 70px;
    width: 400px;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.15);
    position: relative;
    color: #666
}

.sliderTabs li a em {
    position: absolute;
    top: 0;
    left: 20px;
    display: inline-block;
    width: 70px
}

.sliderTabs li a em:after {
    content: "";
    position: absolute;
    top: 25px;
    right: 0;
    width: 1px;
    height: 20px;
    background: #ccc
}

.sliderTabs li a span {
    display: block;
    padding-left: 100px;
    letter-spacing: -0.5px
}

.sliderTabs li.active a {
    background: #2650b4;
    color: #fff;
    border-color: #2650b4
}

.sliderTabs li.active:before {
    content: url('../img/common/active_arrow.png');
    position: absolute;
    top: 22px;
    left: -8px
}

.goList {
    position: fixed;
    top: 187px;
    right: -140px;
    z-index: 30;
    transition: all .8s ease
}

.goList img {
    transform: rotate(-180deg)
}

.goList.active {
    right: 82px;
}

.subMainSectionA {
    background-image: linear-gradient(to right, #f1faff, #f1faff, #f1faff, #f1faff, #fff, #fff, #fff, #fff)
}

.subMainSectionA .container-inner::after {
    content: "";
    display: block;
    clear: both
}

.subMainSectionA .bestSeller {
    background: #f1faff;
    width: 940px;
    float: left;
    margin: 0;
    padding: 80px 70px 70px 0;
    height: 545px;
}

.subMainSectionA .bestSeller h2 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 2.2rem;
    line-height: 2.2rem
}

.subMainSectionA .bestSeller h2 span {
    display: inline-block;
    font-size: 1.1rem;
    line-height: 1.1rem;
    vertical-align: middle;
    border-left: 1px solid #ccc;
    padding-left: 20px;
    margin-left: 20px
}

.subMainSectionA .bestSeller h2:after {
    width: 62px
}

.subMainSectionA .bestSeller .bsBookWrap ul {
    margin: 0 -20px;
    padding: 40px 0 0 0
}

.subMainSectionA .bestSeller .bsBookWrap li {
    width: 25%;
    float: left
}

.subMainSectionA .bestSeller .bsBookWrap li a {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    display: block;
    margin: 0 20px;
    font-size: 1.04rem;
    line-height: 1.3rem;
}

.subMainSectionA .bestSeller .bsBookWrap li a img {
    display: block;
    margin-bottom: 10px;
    width: 180px;
    height: 260px;
    transition: all .3s ease
}

.subMainSectionA .bestSeller .bsBookWrap li:hover img {
    box-shadow: 8px 8px 0 rgba(0,0,0,0.15)
}

.subMainSectionA .mxWrap {
    background: #fff;
    width: 340px;
    float: right
}

.depthCategorySet h2 {
    position: relative;
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 2.2rem;
    line-height: 2.2rem;
    font-weight: 500;
    padding-bottom: 10px;
    margin-bottom: 20px
}

.depthCategorySet h2 span {
    display: inline-block;
    font-size: 1.1rem;
    line-height: 1.1rem;
    vertical-align: middle;
    border-left: 1px solid #ccc;
    padding-left: 20px;
    margin-left: 20px
}

.depthCategorySet h2:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 48px;
    height: 4px;
    background: #272c38;
    width: 62px
}

.mxWrap .launchSet {
    padding: 80px 30px 23px 30px
}

.mxWrap .launchSet h2 {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.8rem;
    line-height: 1.8rem;
    font-weight: 700
}

.mxWrap .launchSet ul {
    overflow: hidden;
    margin: 0 -8px;
    padding: 50px 0 30px 0
}

.mxWrap .launchSet li {
    width: 33.333%;
    float: left;
    text-align: center;
    position: relative
}

.mxWrap .launchSet a {
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    display: block;
    font-size: 1rem
}

.mxWrap .launchSet a span {
    display: block;
    margin: 0 auto 10px;
    background: #fff;
    border: 1px solid #d3d7de;
    width: 80px;
    height: 80px;
    border-radius: 500px;
    line-height: 76px;
    position: relative;
    z-index: 10
}

.mxWrap .launchSet a span img {
    margin: 0 auto;
    max-width: 40px;
    transition: all .4s ease
}

.mxWrap .launchSet a:hover span img {
    transform: scale(0.85)
}

.mxWrap .launchSet a em {
    display: block;
    opacity: 0;
    width: 78px;
    height: 78px;
    background: #495164;
    position: absolute;
    top: 1px;
    left: 50%;
    margin-left: -39px;
    border-radius: 500px;
    transition: all .4s ease
}

.mxWrap .launchSet a:hover em {
    transform: scale(1.2);
    opacity: 1
}

.mxWrap .curation {
    background: #2c93e8;
    color: #fff;
    height: 222px;
    position: relative
}

.mxWrap .curation a {
    display: block;
    height: 100%
}

.mxWrap .curation strong {
    display: block;
    padding: 30px 0 0 30px;
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.6rem;
    line-height: 1.6rem;
    font-weight: 700
}

.mxWrap .curation span {
    display: block;
    padding: 20px 30px 0 30px;
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.05rem;
    line-height: 1.6rem
}

.mxWrap .curation .atGo {
    position: absolute;
    right: 30px;
    bottom: 30px;
    width: 151px;
    height: 28px;
    background: url('../img/common/go_wh.png')
}

.mxWrap .curation .atGo em {
    font-size: 1.2rem;
    position: absolute;
    left: 0;
    bottom: -3px;
    transition: all .3s ease
}

.mxWrap .curation:hover em {
    left: 15px
}

.depthCategorySet {
    background: #fafafa;
    padding: 40px 0
}

.depthCategorySet li {
    display: inline-block;
    margin: 5px 3px;
    position: relative
}

.depthCategorySet li a {
    display: block;
    background: #fff;
    border: 1px solid #979797;
    border-radius: 500px;
    padding: 10px 30px
}

.depthCategorySet li a:hover {
    background: #f6f6f6
}

.depthCategorySet li.active a {
    background: #004f7a;
    border-color: #004f7a;
    color: #fff
}

.depthCategorySet li span.deleteThisKeyword {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 24px;
    height: 24px;
    border-radius: 500px;
    background: #fff;
    border: 1px solid #d6d6d6;
    text-align: center;
    line-height: 20px;
    cursor: pointer
}

.depthCategorySet li span.deleteThisKeyword img {
    max-width: 13px;
    height: auto
}

.itemListWrap {
    display: table;
    width: 100%;
    background: url('../img/common/bg_line.gif') repeat-x left 74px #fff;
    margin-bottom: -80px
}

.itemListWrap .listHeader {
}

.itemListWrap .table-cell {
    display: table-cell;
    vertical-align: top
}

.itemListWrap .table-cell.checkArea {
    vertical-align: middle;
    width: 40px
}

.itemListWrap .mContents {
    width: 940px;
    margin-right: 40px;
    border-right: 1px solid #ececec;
    padding-bottom: 20px
}

.itemListWrap .sContents {
    padding-left: 40px;
    padding-top: 40px;
    width: 340px;
    background: #fff
}

.sortingWrap {
    padding: 20px 40px 20px 0;
    position: relative
}

.sortingWrap .orderBy .btn {
    height: 34px;
    line-height: 32px;
    font-weight: 400
}

.sortingWrap .orderBy .btn.active {
    background: #004f7a;
    color: #fff;
    border-color: #004f7a
}

.sortingWrap .viewType {
    position: absolute;
    right: 40px;
    bottom: 20px
}

.sortingWrap .viewType select {
    border: 2px solid #ededed
}

.sortingWrap .viewType a {
    display: inline-block;
    border: 1px solid #cfd0d0;
    width: 34px;
    height: 34px;
    text-align: center;
    line-height: 34px;
    overflow: hidden;
    vertical-align: middle
}

.sortingWrap .viewType a span {
    display: block;
    width: 11px;
    height: 11px;
    margin: 11px auto
}

.sortingWrap .viewType .vtByList span {
    background: url('../img/common/view_type_a.png')no-repeat 0 0
}

.sortingWrap .viewType .vtByGallery span {
    background: url('../img/common/view_type_b.png')no-repeat 0 0
}

.sortingWrap .viewType a:hover {
    background: #f6f6f6
}

.sortingWrap .viewType a.active {
    background: #fff
}

.sortingWrap .viewType a.active span {
    background-position: 0 -11px
}

.sortingWrap .viewType .selectric .label {
    height: 32px;
    line-height: 32px
}

.itemListA {
    padding-bottom: 80px
}

.itemListA .article {
    display: table;
    width: 100%;
    border-bottom: 1px solid #ededed;
    padding: 25px 0;
    position: relative;
    table-layout: fixed;
}

.itemListA .article .thumbs {
    width: 170px
}

.itemListA .article .thumbs img {
    transition: all .3s ease;
    width: 170px;
    height: 240px
}

.itemListA .article .thumbs:hover img {
    box-shadow: 8px 8px 0 rgba(0,0,0,0.15)
}

.itemListA .article .iteminfo {
    padding: 0 40px
}

.itemListA .itemName {
    font-family: 'NanumSquareRound';
    color: #272c38;
    font-size: 1.2rem;
    line-height: 1.5rem;
    font-weight: 900;
    margin-top: 16px;
    color: #111;
    letter-spacing: -1px
}

.itemListA .subScript {
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1rem;
    line-height: 1.2rem;
    margin: 6px 0;
    color: #797979;
    height: 38px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.itemListA .subScript:before {
    content: "";
    padding: 0
}

.itemListA .iteminfo .pinfo {
    background: #e3e3e3;
    color: #666;
    margin: 6px 0
}

.itemListA .iteminfo .pinfo span:after {
    background: #999
}

.itemListA .itemPrice {
    padding: 0;
    margin: 16px 0 0 0
}

.itemListA .itemPrice:before {
    content: "";
    padding: 0
}

.itemListA .itemPrice .salePrice strong {
    font-size: 1.3rem
}

.itemListA .iteminfo .rtSection {
    border: 0px none;
    padding: 0;
    color: #999;
    font-size: 0.85rem
}

.itemListA .iteminfo .rtSection span {
    display: inline-block;
    margin-right: 15px;
    margin-top: 10px
}

.itemListA .iteminfo .rtSection .rticon_s {
    display: inline-block;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    vertical-align: middle
}

.itemListA .ctrlUser {
    position: absolute;
    top: 25px ;
    right: 40px
}

.itemListA .ctrlUser a {
    float: left;
    border: 1px solid #e1e1e1;
    background: #fff;
    margin: 0 0 0 -1px;
    width: 32px
}

.itemListA .ctrlUser a.buy, .itemListA .ctrlUser a.buy2, .itemListA .ctrlUser a.buy3 {
    background: #e9463f;
    border-color: #e9463f;
    color: #fff
}

.itemListA .ctrlUser a.soldout {
    background: #ccc;
    border-color: #ccc;
    color: #fff;
    text-align: center;
    height: 32px;
    line-height: 30px;
    width: 50px;
    font-weight: 300;
    font-size: 0.85rem
}

.itemListA .ctrlUser img {
    max-width: 30px;
    height: auto
}

.rticon_s.iconA {
    background: url('../img/common/data_icon_1.png') no-repeat center center / contain
}

.rticon_s.iconB {
    background: url('../img/common/data_icon_2.png') no-repeat center center / contain
}

.rticon_s.iconC {
    background: url('../img/common/data_icon_3.png') no-repeat center center / contain
}

.rticon_s.iconD {
    background: url('../img/common/data_icon_4.png') no-repeat center center / contain
}

.rticon_s.iconE {
    background: url('../img/common/data_icon_5.png') no-repeat center center / contain
}

.rticon_s.iconF {
    background: url('../img/common/data_icon_6.png') no-repeat center center / contain
}

.rticon_s.iconG {
    background: url('../img/common/data_icon_7.png') no-repeat center center / contain
}

.rticon_s.iconH {
    background: url('../img/common/data_icon_8.png') no-repeat center center / contain
}

.rticon_s.iconOnlineClass {
    background: url('../img/common/icon_global.png') no-repeat center center / contain
}

.itemListA {
    padding-bottom: 20px;
}

.itemListA.arrGallery {
    overflow: hidden;
    width: 920px;
    margin: 0 -10px
}

.itemListA.arrGallery .article {
    display: block;
    width: 50%;
    float: left;
    border-bottom: 1px solid #ededed;
    padding: 25px 0;
    position: relative
}

.itemListA.arrGallery .article .hash {
    height: 45px;
    overflow: hidden;
    padding-right: 0
}

.itemListA.arrGallery .article .hash span {
    padding: 0;
    border: 0px none;
    height: auto;
    line-height: 0
}

.itemListA.arrGallery .article .hash span:not(:last-child):after {
    content: ","
}

.itemListA.arrGallery .article .itemName {
    height: 46px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.itemListA.arrGallery .article .thumbs {
    display: block;
    text-align: center;
    width: auto;
    overflow: hidden;
    height: 290px;
    position: relative;
    background: #f6f6f6;
    margin: 0 10px
}

.itemListA.arrGallery .article .thumbs img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    max-height: 90%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.itemListA.arrGallery .article .iteminfo {
    display: block;
}

.itemListA.arrGallery .article .iteminfo {
    padding: 20px 10px
}

.itemListA.arrGallery .article .rtSection {
    display: none
}

.itemListA.arrGallery .article .ctrlUser {
    position: relative;
    top: 16px;
    left: 0;
    bottom: 0;
}

.itemListA.arrGallery .ctrlUser a {
    position: relative;
    width: 31.5%;
    margin: 0 4px;
    height: 50px;
    line-height: 50px;
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.1rem;
    font-weight: 700
}

.itemListA.arrGallery .ctrlUser a img {
    vertical-align: -9px;
    margin: 0 5px 0 15px
}

.itemListA.arrGallery .ctrlUser a.wish:after {
    content: "관심 교재"
}

.itemListA.arrGallery .ctrlUser a.cart:after {
    content: "장바구니"
}

.itemListA.arrGallery .ctrlUser a.buy:after {
    content: "바로구매"
}

.itemListA.arrGallery .ctrlUser a.buy2 {
    width: 36%
}

.itemListA.arrGallery .ctrlUser a.buy2:after {
    content: "구입처 안내"
}

.itemListA.arrGallery .ctrlUser a.buy3 {
    width: 45%
}

.itemListA.arrGallery .ctrlUser a.buy3:after {
    content: "온라인 서점 구매"
}

.scBookList {
    margin: -10px 20px 20px 20px
}

.scBookList .item {
    display: table;
    width: 100%;
    margin-bottom: 20px
}

.scBookList .thumbs {
    width: 80px
}

.scBookList .thumbs img {
    transition: all .3s ease;
    width: 80px;
    height: 114px
}

.scBookList .thumbs:hover img {
    box-shadow: 5px 5px 0 rgba(0,0,0,0.15)
}

.scBookList .bookinfo {
    padding: 0 0 0 20px;
    word-break: break-all
}

.scBookList .bookinfo .itemName {
}

.scBookList .bookinfo .pbName {
    color: #999;
    font-size: 0.9rem
}

.scBookList .bookinfo strong {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif ;
    font-size: 1.08rem
}

/* board */
.boardSubMenu {
    margin-top: 40px;
}

.boardSubMenu ul {
    height: 58px;
    display: flex;
    border-left: 1px solid #dcdcdc
}

.boardSubMenu li {
    /* float: left; */
    height: 58px;
}

.boardSubMenu li a {
    display: block;
    line-height: 58px;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    background: #fff;
    border-right: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
    border-top: 1px solid #dcdcdc;
    color: #868686;
    text-align: center;
    position: relative
}

.boardSubMenu li.active a {
    background: #ffc600;
    border-color: #ffc600;
    color: #fff;
    font-weight: 900;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.15)
}

.boardSubMenu li.active a:after {
    content: url('../img/common/schtab_active2.png');
    position: absolute;
    bottom: -5px;
    left: 48%;
    line-height: 5px
}

.boardSubMenu.memberA li {
    /* width: 16.66% */
   flex: 1;
}

.boardSubMenu.memberB li {
    /* width: 16.66% */
    flex: 1;
}

.boardSubMenu .subTab {
    height: auto;
    padding: 30px 0 10px;
    border: 0;
    gap: 20px;
}

.boardSubMenu .subTab li {
    height: 52px;
}

.boardSubMenu .subTab li a {
    line-height: 52px;
    font-weight: 700;
    background: transparent;
    border: 2px solid #E0E0E0;
    border-radius: 30px;
    text-shadow: none;
}

.boardSubMenu .subTab li a span::before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 32px;
    height: 32px;
    margin-right: 10px;
}
.boardSubMenu .subTab li:first-child a span:before {
    background-image:url('../img/common/ic_ybm_book_list.svg');
}
.boardSubMenu .subTab li:nth-child(2) a span:before {
    background-image:url('../img/common/ic_ybm_paper_list.svg');
}

.boardSubMenu .subTab li.active a {
    border-color: #004F7A;
    color: #004F7A;
    background-color: #fff;
}

.boardSubMenu .subTab li.active a::after {
    display: none;
}

.csCenterSubMenu {
    margin-top: 40px;
    border-left: 1px solid #dcdcdc
}

.csCenterSubMenu ul {
    height: 58px
}

.csCenterSubMenu li {
    float: left;
    height: 58px;
    width: calc(100% / 9);
}

.csCenterSubMenu li a {
    display: block;
    line-height: 58px;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    background: #fff;
    border-right: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
    border-top: 1px solid #dcdcdc;
    color: #868686;
    text-align: center;
    position: relative
}

.csCenterSubMenu li.active a {
    background: #2651b4;
    border-color: #2651b4;
    color: #fff;
    font-weight: 900;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.15)
}

.boardSearch {
    margin-top: 20px
}

.boardSearch .schKeyword {
    background: transparent;
    position: relative;
    padding: 13px 0 13px 50px;
    height: 58px;
    box-shadow: none;
    margin-bottom: 16px
}

.schKeyword input[type=text] {
    background: url('../img/common/icon_schbg.png') no-repeat left 15px center #e8eaee;
    position: absolute;
    right: 290px;
    left: 0;
    top: 0;
    height: 58px;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    /*box-shadow:inset 2px 2px 7px rgba(0,0,0,0.04); */
    border: 0px none;
    text-indent: 40px;
    width: 990px
}

.schKeyword input[type=submit] {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    background: #272c38;
    color: #fff;
    border: 0px none;
    position: absolute;
    top: 0;
    right: 190px;
    bottom: 0;
    width: 100px;
    cursor: pointer
}

.boardSearch .schKeyword .toggleBtn {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    background: #272c38;
    color: #fff;
    border: 0px none;
    line-height: 58px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 180px;
    text-align: center
}

.boardSearch .schKeyword .toggleBtn.open:after {
    content: url('../img/common/filter_active.png');
    position: absolute;
    left: 50%;
    margin-left: -13.5px;
    bottom: -11px;
    line-height: 11px
}

.boardSearch .schKeyword .toggleBtn img {
    margin-right: 15px
}

.boardSearch .schKeyword .toggleBtn:after {
    content: ""
}

.boardSearch + .boardDetailsWrap, .csCenterSubMenu + .boardDetailsWrap {
    margin-top: 20px
}

.boardFilter {
    background: #e8eaee;
    /*box-shadow:inset 2px 2px 7px rgba(0,0,0,0.04);*/
    padding: 0 15px
}

.boardFilter table {
    width: 100%
}

.boardFilter th, .boardFilter td {
    position: relative;
    border-bottom: 1px solid #dfdfdf;
    padding: 15px;
    vertical-align: top
}

.boardFilter th {
    font-weight: 500;
    width: 120px;
    line-height: 44px;
    font-size: 1.05rem
}

.boardFilter td:before {
    content: "";
    position: absolute;
    top: 15px;
    left: 0;
    bottom: 15px;
    width: 1px;
    background: #dfdfdf
}

.boardFilter.dnHasTh td:before {
    content: "";
    width: 0
}

.boardFilter a {
    display: inline-block;
    background: #fff;
    border: 1px solid #004f7a;
    border-radius: 500px;
    padding: 5px 20px;
    font-size: 0.9rem;
    letter-spacing: -0.5px;
    text-decoration: none ! important;
    margin: 6px 4px;
    transition: all .1s ease
}

.boardFilter a:hover, .boardFilter a.selected {
    background: #004f7a;
    color: #fff
}

.boardSearch .resultText {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.2rem;
    text-align: center;
    padding: 15px 0;
    color: #111;
    letter-spacing: -0.5px;
    background: #fff;
    box-shadow: 0 0 8px rgba(0,0,0,0.1);
    position: relative
}

.boardSearch .resultText img {
    max-width: 25px;
    margin-right: 5px
}

.resultText .btnReset {
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    position: absolute;
    top: 12px;
    right: 15px;
    font-size: 0.9rem;
    font-weight: 400;
    color: #666;
    padding: 0 10px;
    border-color: #d6d6d6
}

.resultText .btnReset img {
    margin-right: 6px;
    max-width: 18px;
    vertical-align: -2px;
    max-width: 14px;
    opacity: 0.5
}

.boardHeader {
    position: relative;
    margin-top: 30px
}

.sortingWrap.boardHeader {
    margin-top: 0
}

.boardHeader .sorting {
    line-height: 32px
}

.boardHeader .sorting a {
    display: inline-block;
    border: 1px solid #d6d6d6;
    color: #999;
    padding: 0 15px
}

.boardHeader .sorting a.selected {
    background: #004f7a;
    color: #fff;
    border-color: #004f7a
}

.boardHeader .sorting .hash {
    display: inline-block;
    margin-left: 15px;
    padding-left: 15px;
    position: relative
}

.boardHeader .sorting .hash:before {
    content: "";
    width: 1px;
    height: 15px;
    background: #ccc;
    position: absolute;
    top: 14px;
    left: 0
}

.boardHeader .sorting .hash a {
    border: 0px none;
    padding: 4px 8px
}

.boardHeader .sorting .hash a:before {
    content: "#"
}

.boardHeader .sorting .hash a.selected {
    font-weight: 600;
    color: #e8463e;
    background: transparent none
}

.boardHeader .selectric .label {
    height: 32px;
    line-height: 32px
}

.boardHeader .innerSearch {
    position: absolute;
    top: 0;
    right: 0;
    /*background:#e8eaee; position:absolute; height:32px; box-shadow:inset 2px 2px 7px rgba(0,0,0,0.04); border:0px none; width:300px*/
}

.boardHeader .innerSearch input {
    vertical-align: middle
}

.boardHeader .innerSearch input[type=text] {
    /*border:0px none; background:transparent; text-indent:10px; width:100%;*/
    padding-right: 50px;
    height: 34px
}

.boardHeader .innerSearch input[type=image] {
    position: absolute;
    top: 7px;
    right: 10px;
    width: 20px
}

.boardHeader .viewTranslation {
    position: absolute;
    top: 5px;
    right: 0
}

.boardHeader .viewTranslation input[type="checkbox"]:not(.cssbrowser) {
    display: none;
}

.boardHeader .viewTranslation input[type="checkbox"]:not(.cssbrowser) + label {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 0;
    vertical-align: top;
    padding-left: 30px
}

.boardHeader .viewTranslation input[type="checkbox"]:not(.cssbrowser):checked + label {
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 -24px;
}

.boardHeader .viewTranslation input[type="checkbox"]:not(.cssbrowser):disabled + label {
    opacity: 0.5
}

.boardList {
    margin-top: 20px
}

.boardList .article {
    border-bottom: 1px solid #d6d6d6
}

.boardList.listTypeB {
    border-top: 2px solid #272c38
}

.boardList.listTypeB .article {
    display: table;
    width: 100%;
    position: relative
}

.boardList.listTypeB .article .thumbs, .boardList.listTypeB .article .info {
    display: table-cell;
    vertical-align: middle
}

.boardList.listTypeB .article .thumbs {
    width: 100px;
    padding: 15px
}

.boardList.listTypeB .article .thumbs img {
    transition: all .3s ease;
    width: 70px;
    height: auto
}

.boardList.listTypeB .article .thumbs:hover img {
    box-shadow: 5px 5px 0 rgba(0,0,0,0.15)
}

.boardList.listTypeB .article .info .subject {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    color: #000;
    font-size: 1.2rem;
    font-weight: 700
}

.boardList.listTypeB .article .info .shortcut {
    color: #999
}

.boardList.listTypeB .article .info .etc {
    display: inline-block;
    background: #e3e3e3;
    font-size: 0.9rem;
    color: #666;
    border-radius: 500px;
    padding: 0 20px;
    height: 28px;
    line-height: 28px;
    margin-top: 10px
}

.boardList.listTypeB .article .info .etc span:not(:last-child):after {
    content: "|";
    padding: 0 5px 0 10px;
    color: #ccc
}

.boardList.listTypeB .article .btnSet {
    position: absolute;
    top: 50%;
    right: 15px;
    margin-top: -32px
}

.boardList.listTypeB .article .btnSet a {
    display: inline-block;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 700;
    font-size: 1.1rem;
    height: 65px;
    line-height: 64px;
    padding: 0 20px;
    background: #51bee8;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
    transition: all .3s ease
}

.boardList.listTypeB .article .btnSet a:hover {
    box-shadow: inset 15em 0 0 rgba(0,0,0,0.1)
}

.book {
    display: table
}

.book .thumbs, .book .info {
    display: table-cell;
    vertical-align: middle
}

.book .thumbs {
    width: 90px;
    padding: 15px;
    padding-left: 0
}

.book .info {
    padding: 20px 0
}

.book .thumbs img {
    transition: all .3s ease;
    width: 75px;
    height: 106px
}

.book .thumbs:hover img {
    box-shadow: 5px 5px 0 rgba(0,0,0,0.15)
}

.book .info .subject {
    width: 390px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.book .info .shortcut {
    color: #999;
    margin: 4px 0
}

.book .info .etc {
    display: inline-block;
    background: #e3e3e3;
    font-size: 0.9rem;
    color: #666;
    border-radius: 500px;
    padding: 0 20px;
    height: 28px;
    line-height: 28px;
    margin-top: 10px
}

.on .book .info .etc {
    background: #fff
}

.book .info .etc span:not(:last-child):after {
    content: "|";
    padding: 0 5px 0 10px;
    color: #ccc
}

.boardList.listTypeC {
    border-top: 2px solid #272c38
}

.boardList.listTypeC .article {
    padding-bottom: 20px
}

.boardList.listTypeC .article .section {
    background: #f7f2e3;
    color: #111;
    padding: 10px 15px;
    font-weight: 600
}

.boardList.listTypeC .article .sts {
    margin: 20px 15px 0 15px
}

.boardList.listTypeC .article .sts strong {
    text-decoration: underline
}

.boardList.listTypeC .article .translation {
    /*display:none; */
    font-size: 0.85rem;
    margin-left: 72px;
    margin-top: 0
}

.boardList.listTypeD {
    border-top: 2px solid #272c38
}

.boardList.listTypeD .article {
    display: table;
    width: 100%;
    position: relative
}

.boardList.listTypeD .article .thumbs, .boardList.listTypeD .article .info {
    display: table-cell;
    vertical-align: middle
}

.boardList.listTypeD .article .thumbs {
    padding: 25px 15px 25px 15px;
    width: 250px
}

.boardList.listTypeD .article .thumbs a {
    display: block;
    width: 240px;
    height: 160px;
    overflow: hidden;
    position: relative
}

.boardList.listTypeD .article .thumbs a img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all .3s ease
}

.boardList.listTypeD .article .thumbs:hover img {
    box-shadow: 5px 5px 0px rgba(0,0,0,0.08)
}

.boardList.listTypeD .article .info {
    padding: 30px 15px
}

.boardList.listTypeD .article .info .subject {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    color: #000;
    font-size: 1.2rem;
    font-weight: 700
}

.boardList.listTypeD .article .info .shortcut {
    color: #999;
    margin: 10px 0;
    max-height: 46px;
    overflow: hidden;
    word-break: keep-all
}

.boardList.listTypeD .article .info .etc {
    padding: 0;
    position: relative;
    background: none;
    color: #737373
}

.boardList.listTypeD .article .info .etc span:after {
    content: "";
    padding: 0
}

.boardList.listTypeD .article .info .etc span:last-child {
    position: absolute;
    top: 0;
    right: 0
}

.boardList.listTypeD .article .info .etc span img {
    max-width: 25px
}

.boardReply > h2 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.2rem;
    line-height: 1.2rem;
    margin: 30px 0;
    font-weight: 700
}

.miniList {
    border-top: 2px solid #272c38
}

.miniList li {
    display: table;
    width: 100%;
    border-bottom: 1px solid #d6d6d6
}

.miniList li span {
    display: table-cell;
    vertical-align: middle;
    padding: 15px
}

.miniList li span:nth-child(1) {
    width: 120px;
    text-align: center;
    color: #777
}

.miniList li span:nth-child(1):after {
    content: url('../img/common/arrow_toggle.png');
    opacity: 0.3;
    padding-left: 15px
}

.miniList li:nth-child(2) span:nth-child(1):after {
    content: url('../img/common/arrow_toggle2.png');
    opacity: 0.3;
    transform: rotate(-180deg)
}

.boardFooter {
    position: relative;
    margin-top: 20px;
    margin-bottom: 80px;
    min-height: 56px
}

.boardFooter .ctrlData {
    position: absolute;
    top: 6px;
    left: 0
}

.boardFooter .listBtnSet {
    position: absolute;
    top: 6px;
    right: 0
}

/* 마이페이지 */
.myMain .whBox {
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0 0 10px rgba(0,0,0,0.08);
    position: relative
}

.myMain .whBox h2 {
    display: inline-block;
    font-size: 1.2rem;
    padding: 0;
    text-indent: 0;
    height: 66px;
    line-height: 66px;
}

.myMain .whBox .boxHeader {
    position: relative;
    border-bottom: 1px solid #d6d6d6;
    margin: 0 20px;
    height: 60px;
    line-height: 60px;
}

.myMain .whBox a.moreview {
    position: absolute;
    top: 11px;
    right: 20px;
    width: 50px;
    height: 36px;
    line-height: 36px;
    font-size: 1rem;
    text-align: center;
    background: #272c38;
    color: #fff
}

.mySubMenu {
    margin-top: 40px;
    border-left: 1px solid #dcdcdc;
}

.mySubMenu ul {
    height: 58px
}

.mySubMenu li {
    float: left;
    height: 58px
}

.mySubMenu li a {
    display: block;
    line-height: 58px;
    background: #fff;
    border-right: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
    border-top: 1px solid #dcdcdc;
    color: #868686;
    text-align: center;
    position: relative
}

.mySubMenu li.active a {
    background: #e8463e;
    border-color: #e8463e;
    color: #fff;
    font-weight: 600
}

.mySubMenu.memberA li {
    width: 11.11%
}

.mySubMenu.memberB li {
    width: 12.5%;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.08rem
}

.mySectionA {
    margin: 24px 0 20px 0;
    position: relative
}

.mySectionA .whBox {
    padding: 20px
}

.mySectionA .welcomeTxt {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.5rem;
    color: #666;
    letter-spacing: -1px;
    margin-left: 10px
}

.mySectionA .welcomeTxt strong {
    color: #111
}

.mySectionA .welcomeTxt a {
    border-radius: 500px;
    margin-right: 10px;
}

.mySectionA .myBtn {
    position: absolute;
    top: 0;
    right: 20px
}

.mySectionA .myBtn a {
    position: relative;
    display: inline-block;
    line-height: 70px;
    margin-left: 15px;
    text-decoration: underline
}

.mySectionA .myBtn a.btnAlarm em {
    position: absolute;
    top: 15px;
    right: -5px;
    width: 8px;
    height: 8px;
    border-radius: 500px;
    background: #e8463e
}

.sectionBA .myPointNum {
    display: inline-block;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    background: #eee;
    border: 1px solid #d6d6d6;
    height: 30px;
    line-height: 30px;
    border-radius: 500px;
    margin-left: 10px;
    color: #004f7a;
    font-weight: 700;
    font-size: 1.2rem
}

.sectionBA .myPointNum a {
    display: block;
    padding: 0 20px
}

.sectionBA .myPointNum span {
    display: inline-block;
    vertical-align: 2px;
    margin-left: 5px;
    font-size: 0.8rem
}

.sectionBA .goGiftMall {
    position: absolute;
    top: 17px;
    right: 0;
    background: #004f7a;
    color: #fff;
    height: 30px;
    line-height: 30px;
    padding: 0 20px;
    border-radius: 500px
}

.sectionBA .goGiftMall span {
    vertical-align: -2px;
    margin-right: 5px
}

.mySectionB {
    overflow: hidden;
    margin: 0 -10px
}

.mySectionB .whBox {
    float: left;
    margin: 0 10px;
    height: 225px
}

.mySectionB .whBox.sectionBA {
    width: 560px
}

.mySectionB .whBox.sectionBB {
    width: 700px
}

.mySectionC {
    margin: 20px 0
}

.mySectionD {
    overflow: hidden;
    margin: 10px -10px
}

.mySectionD .whBox {
    float: left;
    margin: 0 10px;
    height: 330px
}

.mySectionD .whBox.sectionDA {
    width: 760px
}

.mySectionD .whBox.sectionDB {
    width: 500px
}

.myActList ul {
    overflow: hidden;
    margin: 0 10px;
    padding: 20px 0
}

.myActList li {
    width: 33.33%;
    float: left;
    text-align: center;
    position: relative
}

.myActList li a {
    display: block;
    font-size: 0.95rem;
    color: #666
}

.myActList li:not(:last-child):after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background: #ededed
}

.myActList li span {
    display: block;
    margin: 0 auto;
    transition: all .3s ease
}

.myActList li p {
    background: #f1f1f1;
    padding: 5px 10px;
    text-align: center;
    margin: 20px 10px 0 10px;
    font-size: 0.85rem
}

.myActList li p strong {
    color: #111
}

.myActList li a:hover span {
    transform: rotate(-15deg) scale(0.9)
}

.latestNotice ul {
    margin: 15px 20px
}

.latestNotice li a {
    display: block;
    position: relative;
    overflow: hidden;
    padding: 10px 0
}

.latestNotice li a:hover span:nth-child(2) {
    text-decoration: underline
}

.latestNotice li span {
    float: left
}

.latestNotice li span:nth-child(1) {
    width: 20%;
    font-weight: 600
}

.latestNotice li span:nth-child(2) {
    width: 65%;
    color: #666
}

.latestNotice li span:nth-child(3) {
    width: 15%;
    text-align: right;
    color: #999;
    font-size: 0.85rem
}

.latestWishitem ul {
    overflow: hidden;
    padding: 20px 20px 25px 20px
}

.latestWishitem li {
    display: inline-block;
    margin: 0 47px;
    width: 150px;
    vertical-align: top;
    text-align: center
}

/*.latestWishitem li:not(:last-child):after { content:""; position:absolute; top:0; right:0; width:1px; height:100%; background:#ededed }*/
.latestWishitem li a img {
    width: 150px;
    height: 210px;
    margin: 0 auto 10px;
    display: block;
    transition: all .3s ease
}

.latestWishitem li a:hover img {
    box-shadow: 5px 5px 0 rgba(0,0,0,0.15)
}

.latestTable {
    margin: 10px 20px
}

.latestTable thead {
    display: none
}

.latestTable td {
    border-bottom: 1px solid #ededed
}

.latestTable tr:last-child td {
    border: 0px none
}

.latestTable.myWorditem td {
    padding: 13px 0
}

.latestViewitem .ellipsis {
    width: 150px;
    color: #999
}

.latestViewitem .ellipsis.dataName {
    width: 380px;
    color: #333
}

.myWorditem .ellipsis {
    width: 150px;
    color: #999
}

.alarmBox {
    display: none;
    background: #fff;
    border: 1px solid #495164;
    box-shadow: -10px 10px 10px rgba(0,0,0,0.08);
    position: absolute;
    top: 60px;
    right: 0;
    width: 600px;
    z-index: 5
}

.alarmBox .alarmHeader {
    background: #495164;
    position: relative
}

.alarmBox .alarmHeader h3 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.2rem;
    color: #fff;
    font-weight: 700;
    height: 50px;
    line-height: 50px;
    text-indent: 20px
}

.alarmBox .alarmHeader .closeAlarmBox {
    position: absolute;
    top: 12px;
    right: 20px;
    width: 20px;
    height: 20px
}

.alarmBox .alarmBody {
    height: 360px;
    overflow: auto;
    margin: 20px;
    padding-right: 25px
}

.alarmBox .alarmBody .article {
    background: url('../img/common/icon_megaphone.png') no-repeat left top;
    padding: 0 0 0 70px;
    position: relative;
    margin-bottom: 20px
}

.alarmBox .alarmBody .article .txt {
    background: #ececec;
    padding: 15px;
    border-radius: 30px;
    width: 370px;
    position: relative;
    word-break: break-all
}

.alarmBox .alarmBody .article .txt:before {
    content: url('../img/common/icon_pointer.png');
    position: absolute;
    top: 15px;
    left: -12px
}

.alarmBox .alarmBody .article .postDate {
    color: #999;
    font-size: 0.85rem;
    position: absolute;
    right: 0;
    bottom: 0
}

.mySub input[type="checkbox"]:not(.cssbrowser) {
    display: none;
}

.mySub input[type="checkbox"]:not(.cssbrowser) + label {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 0;
    vertical-align: top;
    padding-left: 24px;
    text-indent: -9999px
}

.mySub input[type="checkbox"].hasLabel + label {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 0;
    vertical-align: top;
    padding-left: 30px;
    text-indent: 0
}

.mySub input[type="checkbox"]:not(.cssbrowser):checked + label {
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 -24px;
}

.mySub input[type="checkbox"]:not(.cssbrowser):disabled + label {
    opacity: 0.5
}

.mySub .listHeader input[type="checkbox"]:not(.cssbrowser) + label {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 0;
    vertical-align: middle;
    padding-left: 30px;
    text-indent: 0;
    margin-right: 20px
}

.mySub .listHeader input[type="checkbox"]:not(.cssbrowser):checked + label {
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 -24px;
}

.mySub .listHeader input[type="checkbox"]:not(.cssbrowser):disabled + label {
    opacity: 0.5
}

.mySub .listHeader {
    position: relative;
    min-height: 36px;
    line-height: 36px
}

.mySub .listHeader .btnSet {
    background: #f1f1f1;
    padding: 15px;
    margin-top: 16px;
    position: relative
}

.mySub .listHeader .btnSet .downZip {
    position: absolute;
    top: 15px;
    right: 15px
}

.mySub .listHeader .goWrite {
    position: absolute;
    top: 4px;
    right: 0
}

.mySub .pageTitle {
    position: relative
}

.mySub .pageTitle h1 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.6rem;
    line-height: 2rem;
    margin: 30px 0 -10px 0;
    font-weight: 700
}

.mySub .whBox {
    margin-top: 24px;
    box-shadow: none
}

.mySub .itemListWrap {
    background: transparent none
}

.mySub .itemListWrap {
    background: #fff;
    /*border:1px solid rgba(0,0,0,0.1);box-shadow:0 0 10px rgba(0,0,0,0.08);*/
    position: relative;
    margin: 0;
    padding: 0px
}

/*.mySub .itemListA { padding-bottom:0; border-top:2px solid #272c38; margin-top:16px }*/
.mySub .itemListA .ctrlUser {
    right: 0
}

.mySub .itemListA .ctrlUser a.deleteThisitem {
    margin-left: 10px;
}

.mySub .itemListA .ctrlUser a.deleteThisitem img {
    transform: rotate(-45deg)
}

.mySub .boardHeader {
    margin-top: 0
}

.mySub .listTypeA a.deleteThisitem img {
    transform: rotate(-45deg)
}

.mySub .boardDetailsWrap {
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0 0 15px rgba(0,0,0,0.1);
    padding: 20px
}

.postHeader {
    position: relative
}

.postHeader h2 {
    font-size: 1.4rem;
    border-bottom: 2px solid #272c38;
    height: 60px;
    line-height: 60px;
    text-indent: 0;
    font-weight: 500;
    letter-spacing: -1px
}

.postHeader .btn {
    position: absolute;
    top: 0;
    right: 0
}

.postHeader .postDate {
    position: absolute;
    top: 0;
    right: 0;
    height: 30px;
    line-height: 30px;
    color: #999
}

.postHeader .postinfo {
    position: absolute;
    top: 0;
    right: 0;
    height: 46px;
    line-height: 46px;
    color: #999
}

.postHeader .postinfo span {
    display: inline-block;
    padding: 0 15px 0 10px;
    position: relative
}

.postHeader .postinfo span:not(:last-child):after {
    content: "";
    position: absolute;
    top: 16px;
    right: 0;
    height: 14px;
    width: 1px;
    background: #ccc
}

.postFiles {
    background: #f6f6f6;
    /*max-height:155px;*/
    overflow-y: auto
}

.postFiles .group {
    position: relative;
    padding: 3px 20px;
    border-bottom: 1px solid #e1e1e1;
    font-size: 0.9rem;
    color: #666;
    margin: 0 ! important
}

.postFiles .group:last-child {
    border: 0px none
}

.boardDetailsWrap .postFiles {
    height: auto;
    overflow: hidden
}

.postContents {
    padding: 40px 20px;
    border-bottom: 1px solid #e1e1e1
}

.boardDetailsWrap .reply {
    background: #eff6f8;
    padding: 40px 20px;
    position: relative;
    padding-left: 80px;
    word-break: keep-all
}

.boardDetailsWrap .reply .icReply {
    position: absolute;
    top: 40px;
    left: 20px
}

.mySub .myinfoWrap {
    /*border:1px solid rgba(0,0,0,0.1); box-shadow:0 0 15px rgba(0,0,0,0.1); */
    padding: 20px
}

.pwCheckForm {
    width: 580px;
    margin: 60px auto 100px
}

.pwCheckForm .h2 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    line-height: 1.5rem;
    word-break: keep-all
}

.pwCheckForm .innerForm {
    border-top: 2px solid #272c38;
    margin: 20px 0 0 0
}

.pwCheckForm .innerForm .group {
    margin: 20px 0;
    display: table;
    width: 100%
}

.pwCheckForm .innerForm .group label, .pwCheckForm .innerForm .group span {
    display: table-cell
}

.pwCheckForm .innerForm .group label {
    width: 100px
}

.pwCheckForm .innerForm .group span input {
    width: 100%
}

.iconSingle {
    margin-bottom: 40px
}

.infoEditWrap {
    width: 780px;
    margin: 40px auto
}

.infoEditWrap.boardWrite {
    width: 100%;
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0 0 15px rgba(0,0,0,0.1);
    padding: 20px 50px 50px 50px;
    background: #fff;
    margin: 20px auto
}

.boardWrite .pageTitle {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.5rem;
    font-weight: 900;
    margin-top: 16px;
    border-bottom: 2px solid #272c38;
    padding-bottom: 16px
}

.myinfoSubMenu ul {
    overflow: hidden
}

.myinfoSubMenu li {
    width: 25%;
    float: left
}

.myinfoSubMenu.selectCerti li {
    width: 50%
}

.myinfoSubMenu li a {
    display: block;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.2rem;
    text-align: center;
    height: 46px;
    line-height: 46px;
    border-bottom: 3px solid #ececec
}

.myinfoSubMenu li.active a {
    border-color: #e8463e;
    color: #111;
    font-weight: 700
}

.infoEditWrap .innerForm .group {
    display: table;
    width: 100%;
    margin: 30px 0
}

.infoEditWrap .innerForm .group > div {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    /*line-height:50px*/
}

.infoEditWrap .innerForm .group > div.multiLine {
    vertical-align: top
}

.infoEditWrap .innerForm .group > div:nth-child(1) {
    width: 140px;
    line-height: 50px
}

.infoEditWrap .innerForm .group > div > p {
    margin: 3px 0
}

.infoEditWrap .innerForm .group > div > p.addedinfo {
    font-size: 0.85rem;
    line-height: 1.2rem;
    margin-top: 5px;
    color: #777
}

.infoEditWrap .innerForm .group > div .textbox {
    display: inline-flex;
    align-items: center;
    height: 50px;
    vertical-align: middle;
}

.infoEditWrap .innerForm .group > div .textbox .result {
    display: block;
    background-color: #eee;
    border-radius: 20px;
    padding: 2px 10px;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #666;
    margin-right: 12px;
}

.infoEditWrap .innerForm .group > div .textbox .result.active {
    background-color: #e9463f;
    color: #fff;
}

.infoEditWrap .innerForm .group > div .textbox .account {
    font-size: 14px;
    color: #666;
}

.infoList {
    margin-top: 10px
}

.infoList li {
    font-size: 0.85rem;
    background: url('../img/common/icon_warning_red.png') no-repeat left 6px ;
    background-size: 15px auto;
    padding-left: 20px;
    line-height: 24px
}

.infoEditWrap .innerForm .group input[type="checkbox"]:not(.cssbrowser) + label {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 0;
    vertical-align: middle;
    padding-left: 30px;
    text-indent: 0;
    margin-right: 20px
}

.infoEditWrap .innerForm .group input[type="checkbox"]:not(.cssbrowser):checked + label {
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 -24px;
}

.infoEditWrap .innerForm .group input[type="checkbox"]:not(.cssbrowser):disabled + label {
    opacity: 0.5
}

/*.infoEditWrap .innerForm .group p { margin:4px 0 0 0 }*/
.infoEditWrap .innerForm .submitGroup {
    margin-top: 20px
}

.infoEditWrap .innerForm .multiSet span {
    margin-right: 20px
}

.infoEditWrap .innerForm .fullWidth {
    width: 100%
}

.infoEditWrap .innerForm .group .tooltipSet {
    display: inline-block;
    position: relative;
    vertical-align: 1px;
    padding: 5px
}

.infoEditWrap .innerForm .group .tooltipSet .icTooltip {
    cursor: pointer
}

.infoEditWrap .innerForm .group .tooltip {
    display: none;
    position: Absolute;
    left: -38px;
    top: 28px;
    z-index: 2
}

.infoEditWrap .innerForm .group .tooltip p {
    margin-bottom: 8px;
}

.infoEditWrap .innerForm .group .tooltipSet:hover .tooltip {
    display: block
}

.infoEditWrap .innerForm .group textarea {
    width: 100%;
    height: 150px;
    resize: none
}

.infoEditWrap .innerForm .group textarea:disabled {
    background: #ededed
}

.infoEditWrap .innerForm .group input.url:before {
    content: "http://"
}

.infoEditWrap .innerForm .groupSet .group {
    display: table-cell;
    width: auto
}

.infoEditWrap .innerForm .groupSet .group:not(:first-child) {
    padding-left: 120px
}

.infoEditWrap .sectionContent {
    margin-top: 30px;
    background: #f6f6f6;
    padding: 15px
}

.infoEditWrap .innerForm .group > div.emailNotice {
    line-height: 22px;
}

.infoEditWrap .innerForm .group > div.emailNotice a {
    text-decoration-line: underline;
    font-weight: bold;
    color: #FF0000;
}

.mTypeBox {
    background: #fff;
    border: 1px solid #ececec;
    color: #666
}

.mTypeBox p.agreeTitle {
    background: #f1f1f1;
    padding: 20px;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.12rem;
    color: #111;
    font-weight: 700
}

.mTypeBox.wrAgreeWrap p.agreeTitle {
    font-size: 1.08rem
}

.mTypeBox span {
    display: block;
    padding: 20px
}

.wrAgreeWrap .multiSet {
    border-top: 1px solid #ececec;
    text-align: center
}

.wrAgreeWrap .multiSet span {
    display: inline-block;
    margin-right: 20px
}

.hiddenTR {
    display: none;
    background: #f6f6f6
}

.hiddenTR td {
    padding: 30px ! important
}

.ShowHide {
    cursor: pointer
}

.ShowHide td {
    position: relative
}

.ShowHide td span {
    position: absolute;
    top: 20px;
    right: 20px;
    transform: rotate(-180deg);
    transition: all .3s ease
}

.ShowHide.on td:nth-child(3) {
    font-weight: 600
}

.ShowHide.on td span {
    transform: rotate(-360deg)
}

.writeHeader {
    border-bottom: 2px solid #272c38;
    padding-bottom: 10px;
    margin-top: 10px
}

.writeHeader .writeTxt {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.27rem;
    line-height: 1.8rem;
    letter-spacing: -1px;
    font-weight: 700;
    color: #000;
}

.writeHeader .writeTxtSub {
    margin-top: 6px;
    color: #999
}

.subPageTitle {
    margin: 30px 0 0 0
}

.subPageTitle h2 span {
    font-weight: 400;
    color: #666
}

.subPageTitle p {
    color: #777
}

.subPageTitle h2 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.5rem;
    line-height: 2.2rem;
    letter-spacing: -1px;
    font-weight: 900;
    color: #000;
}

.searchAddress {
    background: #f1f1f1;
    padding: 15px;
    margin: 0 0 20px 0
}

.pageSectionTitle h3 {
    border-bottom: 2px solid #272c38;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.2rem;
    line-height: 2.4rem;
}

.listTypeE {
    overflow: hidden;
    margin: 10px -10px
}

.listTypeE .article {
    width: 630px;
    float: left;
    margin: 10px;
    border: 1px solid #d9d9d9;
    background: #fff;
    padding: 20px;
    position: relative;
    cursor: pointer;
    transition: all .3s ease
}

.listTypeE .article .addr {
    position: absolute;
    top: 20px;
    right: 20px
}

.listTypeE .article .addr span {
    display: inline-block;
    font-size: 0.9rem;
    border-radius: 3px;
    height: 26px;
    line-height: 24px;
    padding: 0 10px;
    color: #fff
}

.listTypeE .article .addr span:nth-child(1) {
    background: #2651b4;
    border: 1px solid #2651b4;
    color: #fff
}

.listTypeE .article .addr span:nth-child(2) {
    background: #fff;
    border: 1px solid #d9d9d9;
    color: #666
}

.listTypeE .article .marketName {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.2rem;
    line-height: 1.2rem
}

.listTypeE .article .addr2 {
    margin: 20px 0 6px 0
}

.listTypeE .article .marketNumber {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.08rem;
    color: #777
}

.listTypeE .article img {
    max-width: 15px;
    height: auto;
    margin-right: 8px
}

.listTypeE .article:hover {
    border-color: #2651b4;
    box-shadow: 5px 5px 0 rgba(0,0,0,0.15)
}

.loginWrap {
    max-width: 400px;
    margin: 200px auto
}

.loginWrap h1 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.8rem;
    line-height: 2rem;
    margin-bottom: 20px;
}

.loginForm .group {
    background: #fff;
    border: 1px solid #d6d6d6;
    position: relative;
    height: 65px;
    line-height: 65px;
    margin: 10px 0
}

.loginForm .group input {
    border: 0px none;
    height: 65px;
    position: absolute;
    top: 0;
    left: 65px;
    background: transparent
}

.loginForm .group:nth-child(1):before {
    content: url('../img/common/loginform_id.png');
    position: absolute;
    top: 0;
    left: 0;
    border-right: 1px solid #d6d6d6;
    height: 64px;
    padding: 10px 15px
}

.loginForm .group:nth-child(2):before {
    content: url('../img/common/loginform_pw.png');
    position: absolute;
    top: 0;
    left: 0;
    border-right: 1px solid #d6d6d6;
    height: 64px;
    padding: 10px 15px
}

.loginForm .submitGroup {
    position: relative;
    line-height: 60px;
}

.loginForm .submitGroup input[type=submit] {
    border: 0px none;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
}

.boardList input[type="radio"]:not(.cssbrowser) {
    display: none;
}

.boardList input[type="checkbox"]:not(.cssbrowser) + label {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 0;
    vertical-align: middle;
    padding-left: 24px;
    text-indent: -9999px;
    margin-right: 0
}

.boardList input[type="checkbox"]:not(.cssbrowser):checked + label {
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 -24px;
}

.boardList input[type="checkbox"]:not(.cssbrowser):disabled + label {
    opacity: 0.5
}

.loginWrap .etc {
    position: relative;
    line-height: 36px;
    margin-top: 20px
}

.loginWrap .etc a {
    text-decoration: underline
}

.loginWrap .etc .schAccount {
    position: absolute;
    top: 0;
    right: 0;
    color: #999
}

.loginWrap .etc .schAccount a {
    margin: 0 3px
}

.flowTabs {
    border-bottom: 1px solid #d6d6d6;
    margin-bottom: 30px;
    padding-bottom: 20px
}

.flowTabs ol {
    overflow: hidden;
    margin: 0 -80px
}

.flowTabs li {
    float: left;
    position: relative;
    width: 25%;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.08rem;
    letter-spacing: -1px;
    font-weight: 700;
    text-align: center;
    color: #333
}

.flowTabs li .ic {
    width: 70px;
    height: 70px;
    border-radius: 500px;
    margin: 0 auto 3px
}

.flowTabs li:nth-child(1) .ic {
    background: url('../img/common/ic_sign_step1.png') no-repeat center center #d8d8d8
}

.flowTabs li:nth-child(2) .ic {
    background: url('../img/common/ic_sign_step2.png') no-repeat center center #d8d8d8
}

.flowTabs li:nth-child(3) .ic {
    background: url('../img/common/ic_sign_step3.png') no-repeat center center #d8d8d8
}

.flowTabs li:nth-child(4) .ic {
    background: url('../img/common/ic_sign_step4.png') no-repeat center center #d8d8d8
}

.flowTabs li.current .ic {
    background-color: #e8463e ! important
}

.flowTabs li:not(:last-child):after {
    content: url('../img/common/ic_flow_arrow.png');
    position: absolute;
    top: 24px;
    right: 0
}

.flowTabs li span {
    display: block;
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 0.85rem;
    font-weight: 500;
    letter-spacing: 0;
    color: #999
}

.flowTabs li .ic.register {
    background: url('../img/common/ic_sign_step3.png') no-repeat center center #d8d8d8
}

.flowTabs li .ic.end {
    background: url('../img/common/ic_sign_step4.png') no-repeat center center #d8d8d8
}

.signSectionTitle {
    margin: 30px 0 16px 0
}

.signSectionTitle h2 {
    text-indent: 0;
    height: 40px;
    line-height: 40px;
    letter-spacing: -1px;
    margin-top: 16px
}

.signSectionTitle.finish {
    margin: 60px 0
}

.signSectionTitle.finish h2 {
    text-indent: 0;
    height: 40px;
    line-height: 28px;
    letter-spacing: -1px;
    margin-top: 16px
}

.signSectionTitle p {
    color: #999
}

.signSectionTitle + .writeHeader, .signSectionTitle + .writeHeader .writeTxtSub {
    margin-top: 0
}

.signSectionTitle.finish.text-center span {
    display: block;
    font-size: 16px;
    margin-top: 27px;
}

.signSectionTitle.finish.text-center span strong {
    color: #e8463e;
}

.finish_box {
    background: #f6f6f6;
    padding: 40px;
    margin-bottom: 40px;
    line-height: 2rem
}

.finish_box strong {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.4rem;
    font-weight: 900
}

.signWrap {
    max-width: 1235px;
    margin: 160px auto
}

.signWrap h1 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.8rem;
    line-height: 2rem;
    margin-bottom: 20px;
}

.signWrap .infoTxt a {
    text-decoration: underline;
    color: #e8463e
}

.selectMemberType {
    display: table;
    width: 100%;
    table-layout: fixed;
    margin: 30px 0 0 0
}

.selectMemberType .box {
    display: table-cell;
    vertical-align: top;
    background: rgba(38,81,180,1);
    color: #fff;
    transition: all .3s ease
}

.selectMemberType .box:last-child {
    border-left: 0px none
}

.selectMemberType .box h2 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.3rem;
    line-height: 2rem;
    color: #fff
}

.selectMemberType .box p {
    margin-top: 20px;
    word-break: keep-all
}

.selectMemberType .box a {
    padding: 60px 40px;
    display: block
}

.selectMemberType .box:nth-child(2) {
    background: rgba(73,81,100,1)
}

.selectMemberType .box:nth-child(3) {
    background: rgba(73,81,100,0.6)
}

.selectMemberType .box:hover {
    transform: translateY(20px);
    box-shadow: 4px 4px 10px rgba(0,0,0,0.2)
}

.selectMemberType .box:nth-child(2):hover {
    box-shadow: -4px 4px 10px rgba(0,0,0,0.2)
}

.agreeSet input[type="checkbox"]:not(.cssbrowser) {
    display: none;
}

.agreeSet input[type="checkbox"]:not(.cssbrowser) + label {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 0;
    vertical-align: middle;
    padding-left: 30px;
    text-indent: 0;
    margin-right: 20px
}

.agreeSet input[type="checkbox"]:not(.cssbrowser):checked + label {
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 -24px;
}

.agreeSet input[type="checkbox"]:not(.cssbrowser):disabled + label {
    opacity: 0.5
}

.agreeSet.checkAllGroup {
    background: #fff;
    border-top: 1px solid #ededed;
    border-bottom: 1px solid #ededed;
    padding: 20px 0;
    margin-top: 20px
}

.agreeSet {
    background: #f6f6f6;
    padding: 0 30px 30px 30px
}

.agreeSet h3 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.2rem;
    line-height: 1.3rem;
    padding-bottom: 20px
}

.agreeSet:nth-child(2) h3 {
    padding-top: 30px
}

.agreeSet > div {
    border: 1px solid #dcdcdc;
    padding: 15px;
    background: #fff;
    position: relative;
    margin-bottom: 10px
}

.agreeSet > div .viewAllTxt {
    cursor: pointer;
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 0.85rem;
    color: #999
}

.agreeSet > div .viewAllTxt .icToggle {
    display: inline-block;
    opacity: 0.5;
    transform: rotate(-180deg);
    margin-left: 5px;
    width: 8px
}

.agreeSet > div .viewAllTxt.on .icToggle {
    transform: rotate(-360deg)
}

.agreeSet > div .allTxtBox {
    display: none;
    border: 1px solid #ededed;
    padding: 15px;
    height: 250px;
    overflow: auto;
    margin-top: 15px;
    font-size: 0.85rem;
    color: #666
}

.agreeSet .checkSetTitle {
    margin-bottom: 16px
}

.selectCertiType {
    display: table;
    width: 100%;
    table-layout: fixed;
    margin: 30px 0 0 0;
    border: 1px solid #d6d6d6
}

.selectCertiType .box {
    display: table-cell;
    vertical-align: top;
    background: #fff;
    text-align: center;
    padding: 30px
}

.selectCertiType .box:nth-child(1) {
    border-right: 1px solid #eaeaea
}

.selectCertiType .box h3 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.2rem;
    line-height: 1.3rem;
    color: #272c38;
    margin: 20px 0
}

.selectCertiType .box p {
    color: #666;
    word-break: keep-all
}

.selectCertiType .box .btnWarp {
    margin-top: 40px
}

.selectCertiType .box .btnWarp .btn {
    width: 70%;
    padding: 0 ! important
}

.selectCertiType .box:nth-child(1) .btnWarp {
    margin-top: 88px
}

.selectCertiType .box .addFile {
    margin-top: 20px
}

.certiinfo {
    margin-top: 40px
}

.certiinfo h4 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 700;
    font-size: 1.12rem;
    line-height: 1.3rem;
    color: #111;
    margin-bottom: 20px
}

.certiinfo h4 img {
    max-width: 17px;
    margin-right: 8px;
    vertical-align: -2px
}

.certiinfo li {
    color: #666;
    padding: 10px 0 10px 15px;
    position: relative;
    border-bottom: 1px solid #eaeaea
}

.certiinfo li:before {
    content: "-";
    position: absolute;
    top: 10px;
    left: 0
}

/* (s)회원가입 추가  (2022-12-20) */
.signWrap02 {
    /*max-width:1235px;*/
    margin: 0 auto;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
}

.signWrap02 .joinTop {
    background-color: #fff;
    box-shadow: 0px 2px 15px 0px rgba(0, 0, 0, 0.05);
}

.signWrap02 h1 {
    text-align: center;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 700;
    font-size: 42px;
    line-height: 60px;
    padding-top: 40px;
    margin-bottom: 4px;
}

.signWrap02 .infoTxt {
    font-size: 16px;
    line-height: 26px;
    text-align: center;
}

.signWrap02 .infoTxt br.m {
    display: none;
}

.signWrap02 .infoTxt strong.m {
    font-weight: normal;
}

.signWrap02 .tabMember {
    display: flex;
    justify-content: space-between;
    max-width: 1200px;
    padding: 25px 0 50px;
    margin: 0 auto;
}

.signWrap02 .tabMember .box {
    display: block;
    width: 220px;
    height: 60px;
    border-radius: 30px;
    border: 2px solid #e9e9eb;
    /*margin-right:25px;*/
    transition: all .3s ease;
}

.signWrap02 .tabMember .box a {
    display: block;
    text-align: center;
    font-size: 20px;
    line-height: 30px;
    padding: 13px;
}

.signWrap02 .tabMember .box a>span {
    position: relative;
    display: inline-block;
    height: 30px;
    padding-left: 0;
    vertical-align: top;
    white-space: nowrap;
    transition: all .3s ease;
}

.signWrap02 .tabMember .box.active {
    font-weight: 900;
    border-style: dashed;
    border-color: #272c38;
}

.signWrap02 .tabMember .box.active a>span {
    background: url(../img/common/ic_circle_chk.png) no-repeat;
    padding-left: 44px;
}

.signWrap02 .joinTabContainer {
    position: relative;
    padding-top: 40px;
    max-width: 1200px;
    margin: 0 auto;
}

.signWrap02 .joinTabContent {
    display: none;
}

.signWrap02 .joinTabContent:first-child {
    display: block;
}

.signWrap02 .joinTabContent .initTxt {
    position: relative;
    font-size: 18px;
    color: #fa5f60;
    text-align: center;
    padding-top: 130px;
    margin: 70px 0 100px;
}

.signWrap02 .joinTabContent .initTxt:before {
    content: '!';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    width: 100px;
    height: 100px;
    color: #fa5f60;
    font-weight: 700;
    font-size: 40px;
    line-height: 100px;
    font-family: 'Noto Sans KR';
    background-color: #fff;
    border-radius: 100%;
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.05);
}

.signWrap02 .joinTabContent h3 {
    text-align: center;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 700;
    color: #fa5f60;
    font-size: 30px;
    line-height: 48px;
    margin-bottom: 5px;
}

.signWrap02 .joinTabContent .stu-prefix {
    position: absolute;
    top: -38px;
    left: 50%;
    transform: translateX(-50%);
}

.signWrap02 .joinTabContent .stu-prefix > span + span {
    margin-left: 16px;
}

.signWrap02 .joinTabContent .joinService {
    display: flex;
    justify-content: center;
    margin-top: 18px;
}

.signWrap02 .joinTabContent .joinService .ico {
    position: relative;
    width: 333px;
    height: 284px;
}

.signWrap02 .joinTabContent .joinService .ico.icoYcloud {
    background: url(../img/common/ic_join_ycloud.png) no-repeat center;
}

.signWrap02 .joinTabContent .joinService .ico.icoBooksam {
    width: 370px;
    background: url(../img/common/ic_join_booksam.png) no-repeat center;
}

.signWrap02 .joinTabContent .joinService .ico.icoSmartschool {
    background: url(../img/common/ic_join_smartschool.png) no-repeat center;
}

.signWrap02 .joinTabContent .joinService .ico.icoYcloud:after {
    content: '';
    position: absolute;
    right: -25px;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    border-radius: 100%;
    background: #fff url(../img/common/ic_plus_red.png) no-repeat center;
    z-index: 1;
}

.signWrap02 .joinTabContent .joinService .ico.icoBooksam:after {
    content: '';
    position: absolute;
    right: -25px;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    border-radius: 100%;
    background: #fff url(../img/common/ic_plus_blue.png) no-repeat center;
    z-index: 1;
}

.signWrap02 .joinTabContent .joinService .ico:last-child:after {
    display: none;
}

.signWrap02 .joinTabContent .joinCase {
    position: relative;
    display: flex;
    justify-content: center;
    padding-top: 33px;
    margin-top: 22px;
    border-top: 1px dashed #d6d6d6;
}

.signWrap02 .joinTabContent .joinCase:before {
    content: 'JOIN';
    position: absolute;
    top: -12px;
    left: 50%;
    display: block;
    transform: translateX(-50%);
    background: #d6d6d6;
    border-radius: 12px;
    padding: 0 10px;
    line-height: 24px;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    text-align: center;
}

.signWrap02 .joinTabContent .joinCase > a {
    display: inline-block;
    width: 320px;
    height: 60px;
    background-color: #203a63;
    border: 2px solid #203a63;
    border-radius: 30px;
    line-height: 56px;
    font-size: 18px;
    font-weight: 900;
    text-align: center;
    color: #fff;
    margin-right: 20px;
}

.signWrap02 .joinTabContent .joinCase > a:last-child {
    margin-right: 0;
}

.signWrap02 .joinTabContent .joinCase a.ycloudAccount {
    border-color: #fa5f60;
    color: #fa5f60;
    background-color: #fff;
}

.signWrap02 .joinTabContent .joinCase a.smartschoolAccount {
    border-color: #6d379e;
    color: #6d379e;
    background-color: #fff;
}

.signWrap02 .snsJoin {
    display: none;
    margin-top: 45px;
}

.signWrap02 .snsJoin h3 {
    line-height: 25px;
    font-size: 16px;
    font-weight: 700;
    text-align: center;
}

.signWrap02 .snsJoin .snsButtonWrap {
    margin-top: 24px;
    display: flex;
    justify-content: center;
}

.signWrap02 .snsJoin .snsButton {
    display: inline-block;
    vertical-align: middle;
    width: 64px;
    height: 64px;
    margin: 0 8px;
    transition: all .3s ease;
}

.signWrap02 .snsJoin .snsButton:hover, .signWrap02 .snsJoin .snsButton:focus {
    transform: scale(1.25);
}

.signWrap02 .snsJoin .snsButton em {
    display: none;
}

.signWrap02 .snsJoin .snsButton.kakao {
    background: url(../img/common/ic_sns_kakao.png) no-repeat center center / 64px 64px;
}

.signWrap02 .snsJoin .snsButton.facebook {
    background: url(../img/common/ic_sns_facebook.png) no-repeat center center / 64px 64px;
}

.signWrap02 .snsJoin .snsButton.google {
    background: url(../img/common/ico_sns_google.svg) no-repeat center center / 64px 64px;
}

.signWrap02 .snsJoin .snsButton.naver {
    background: url(../img/common/ic_sns_naver.png) no-repeat center center / 64px 64px;
}

.signWrap02 .snsJoin .snsButton.whale {
    background: url(../img/common/ic_sns_whale.png) no-repeat center center / 64px 64px;
}

.signWrap02 .snsJoin .snsButton.apple {
    background: url(../img/common/ic_sns_apple.svg) no-repeat center center / 64px 64px;
}

.cerifyBox {
    max-width: 600px;
    margin: 80px auto;
    background: #fff;
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.05);
    border: 1px solid #d6d6d6;
    padding-bottom: 40px;
}

.cerifyBox h3 {
    background: #f6f6f6;
    color: #1B1D1F;
    font-size: 18px;
    font-weight: 700;
    padding: 20px 30px;
    border-bottom: 1px solid #d6d6d6;
}

.cerifyBox h3 em {
    display: lnline-block;
    line-height: 22px;
    color: #fa5f60;
    font-weight: 700;
    margin-right: 4px;
}

.cerifyBox .guideTxt {
    padding: 25px 25px 40px;
}

.cerifyBox .guideTxt p {
    line-height: 30px;
    font-size: 16px;
}

.cerifyBox .guideTxt p:before {
    content: '※';
    margin-right: 4px;
}

.cerifyBox .btnWrap {
    text-align: center;
}

.cerifyBox .btnWrap a {
    display: inline-block;
    margin: 0 auto;
    width: 154px;
    height: 50px;
    line-height: 50px;
    background: #272c37;
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
}

.mTypeBox02 {
    background: #f6f6f6;
    color: #666;
    padding: 20px;
    margin-bottom: 20px;
}

.mTypeBox02 h4.agreeTitle {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 17px;
    font-weight: 700
}

.mTypeBox02 .agreeCont {
    padding: 15px 0;
}

.mTypeBox02 .agreeCont p {
    position: relative;
    padding-left: 10px;
}

.mTypeBox02 .agreeCont p:before {
    content: "";
    position: absolute;
    top: 8px;
    left: 0;
    width: 3px;
    height: 3px;
    border-radius: 5px;
    background: #0F3653;
}

.myinfoWrap .authNo {
    width: 400px;
}

/* (e)회원가입 추가  (2022-12-20) */
.modalBg {
    display: none;
    background: rgba(0,0,0,0.75);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 200
}

.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 205;
    overflow: auto;
    padding: 100px 0;
    background: rgba(0,0,0,0.75);
}

.modal .modalHeader {
    background: #272c38;
    height: 40px;
    line-height: 40px;
    padding: 10px 15px;
    position: relative
}

.modal .modalHeader h2 {
    color: #fff
}

.modal .modalHeader .closeModal {
    position: absolute;
    top: -2px;
    right: 15px
}

.modal .modalHeader .closeModal img {
    max-width: 20px;
    height: auto
}

.modal .modalBody {
    padding: 40px
}

.modal .modalBody h3 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.2rem;
    line-height: 1.3rem;
    margin-bottom: 10px
}

.modal .modalBody h3:not(:first-child) {
    margin-top: 30px
}

.modal .modalBody .innerTxt {
    color: #666;
    word-break: keep-all;
}

.modal .modalBody .bar {
    margin: 20px 0
}

.modal .modalBody .infoEditWrap {
    width: auto;
    margin: 10px 0 0 0;
    padding: 0;
    border-top: 1px solid #d6d6d6
}

.modal .modalBody .textarea textarea {
    width: 100%;
    height: 100px;
    resize: none
}

.modal .modalFooter {
    background: #f6f6f6;
    padding: 10px;
    border-top: 1px solid #d6d6d6
}

.finCertiA {
    width: 600px;
    margin: 0 auto;
    background: #fff
}

.finCertiB {
    width: 400px;
    margin: 0 auto;
    background: #fff
}

.finCertiC {
    width: 500px;
    margin: 0 auto;
    background: #fff
}

.searchModal {
    width: 700px;
    margin: 0 auto;
    background: #fff
}

.mapModal {
    width: 1080px;
    margin: 0 auto;
    background: #fff;
    position: relative
}

.commonAlert {
    width: 500px;
    margin: 0 auto;
    background: #fff
}

.commonConfirm {
    width: 500px;
    margin: 0 auto;
    background: #fff
}

.commonResult {
    width: 800px;
    margin: auto;
    background-color: #fff;
}

.commonShort {
    width: 800px;
    margin: auto;
    background-color: #fff;
}

.commonTestMake {
    width: 500px;
    margin: auto;
    background-color: #fff;
}

.cancelModal {
    width: 700px;
    margin: 0 auto;
    background: #fff
}

.cancelModal .modalBody {
    max-height: 460px;
    overflow: auto
}

.termModal {
    width: 1280px;
    margin: 0 auto;
    background: #fff
}

.loginModal {
    width: 400px;
    margin: 0 auto;
    background: #fff
}

.caseOrderModal {
    width: 700px;
    margin: 0 auto;
    background: #fff
}

.preOrderModal {
    width: 1000px;
    margin: 0 auto;
    background: #fff
}

.loginModal .loginWrap {
    margin: 0 auto
}

.loginModal .loginWrap h1 img {
    width: 140px;
    height: auto
}

.loginModal .loginForm .submitGroup input[type=submit] {
    position: relative;
    width: 100%;
    margin: 0
}

.loginModal .loginForm .submitGroup input[type=submit]:focus, .loginModal .loginForm .submitGroup input[type=submit]:hover {
    background: #42495a;
    box-shadow: none
}

.termModal .modalBody > p {
    margin-bottom: 10px
}

.termModal .textarea {
    max-height: 560px;
    overflow: auto;
    background: #f1f1f1;
    padding: 20px;
    color: #666;
    font-size: 0.85rem
}

.termModal .textarea strong {
    font-weight: 500;
    color: #000;
    display: block
}

.termModal .textarea .head-tit {
    font-size: 1.2rem
}

.termModal .textarea .tit {
    margin-top: 20px;
    font-size: 1rem
}

.termModal .textarea .sub-tit {
    margin-top: 20px
}

.termModal .textarea .inner > ul > li > ul {
    padding-left: 15px
}

.termModal .textarea .tbl-basic {
    margin: 8px 0
}

.termModal .textarea .tbl-basic th, .termModal .textarea .tbl-basic td {
    font-size: 0.85rem;
    color: #666;
    padding: 8px;
    font-weight: 400
}

.termModal .textarea .tbl-basic th {
    background: #f9f9f9;
    border: 1px solid #ccc;
    color: #111
}

.termModal .textarea .tbl-basic td {
    background: rgba(255,255,255,0.2);
    border: 1px solid #d6d6d6
}

.termModal .textarea .tbl-basic caption {
    color: #111;
    font-weight: 500;
    margin: 16px 0 8px 0
}

.couponDonwModal {
    width: 600px;
    margin: 0 auto;
    background: #fff;
    font-weight: 300;
}

.couponDonwModal .modalBody h3 {
    border-bottom: 1px solid #272c38;
    padding-bottom: 10px;
    margin-bottom: 0
}

.couponDonwModal .modalBody .list {
    display: table;
    width: 100%;
    border-bottom: 1px solid #eaeaea
}

.couponDonwModal .modalBody .list > div {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding: 10px 0
}

.couponDonwModal .modalBody .list > div:first-child {
    text-align: left;
    width: 250px
}

.couponDonwModal .modalBody .list > div:last-child {
    width: 60px
}

.couponDonwModal .modalBody .list > div span {
    margin: 0
}

.couponDonwModal .modalBody .list > div.content {
    font-size: 14px;
    line-height: 18px
}

.couponDonwModal .modalBody .list > div.content span {
    font-size: 13px;
    margin-bottom: 4px
}

.couponDonwModal .modalBody .list > div.content p {
    margin-top: 8px;
    color: #666;
    word-break: keep-all
}

.couponDonwModal .modalBody .list > div.content div {
    font-size: 16px;
    font-weight: 500
}

.couponDonwModal .modalBody .list > div.download a {
    display: inline-block;
    border: 1px solid #eaeaea;
    padding: 10px 15px;
    border-radius: 4px
}

.couponDonwModal .modalBody .list > div.download a:hover {
    border-color: #e8463e
}

.couponDonwModal .modalBody .info {
    font-size: 14px;
    margin-top: 10px;
    font-weight: 300
}

.myCouponModal {
    width: 600px;
    margin: 0 auto;
    background: #fff;
    font-weight: 300;
}

.myCouponModal .modalBody h3 {
    border-bottom: 1px solid #272c38;
    padding-bottom: 10px;
    margin-bottom: 0
}

.myCouponModal .modalBody .list {
    display: table;
    width: 100%;
    border-bottom: 1px solid #eaeaea
}

.myCouponModal .modalBody .list > div {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    padding: 15px 0
}

.myCouponModal .modalBody .list > div:last-child {
    text-align: center;
    width: 80px
}

.myCouponModal .modalBody .scrollArea {
    max-height: 380px;
    overflow: auto
}

.caseOrderModal .alertTxt {
    background: url('../img/common/icon_warning_red.png') no-repeat left center / contain;
    padding-left: 60px
}

.caseOrderModal .orderCaseBtnSet {
    margin: 30px -10px
}

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

.caseOrderModal .orderCaseBtnSet li {
    float: left;
    width: 50%;
    text-align: center;
    padding: 0 10px
}

.caseOrderModal .orderCaseBtnSet li a {
    display: block;
    background: #f6f6f6;
    border-radius: 4px;
    border: 1px solid #d6d6d6;
    padding: 30px 0;
    transition: all .3s ease
}

.caseOrderModal .orderCaseBtnSet li a:hover {
    box-shadow: 8px 8px 0 rgba(0,0,0,0.1);
    border-color: #272c38;
    background: #fff
}

.caseOrderModal .orderCaseBtnSet li a strong, .caseOrderModal .orderCaseBtnSet li a span {
    display: block
}

.caseOrderModal .orderCaseBtnSet li a strong {
    font-size: 21px;
    line-height: 30px
}

.caseOrderModal .infoTxt {
    font-weight: 300;
    font-size: 14px
}

.preOrderModal .alertTxt {
    font-size: 21px;
    line-height: 28px;
    font-weight: 500;
    text-align: center
}

.preOrderModal .alertTxt span {
    display: block;
    font-weight: 300;
    font-size: 14px
}

.preOrderModal .caseOrderTable {
    margin: 40px -20px 0 -20px
}

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

.preOrderModal .caseOrderTable .itemList {
    float: left;
    width: 50%;
    padding: 0 20px
}

.preOrderModal .caseOrderTable .itemList h3 {
    font-size: 18px;
    font-weight: 600;
    border-bottom: 1px solid #272c38;
    padding-bottom: 10px;
    margin: 0
}

.preOrderModal .caseOrderTable .itemList thead th {
    background: #272c38;
    color: #fff;
    padding: 8px 12px;
    font-weight: 300;
    text-align: center
}

.preOrderModal .caseOrderTable .itemList tbody td {
    border-bottom: 1px solid #d6d6d6;
    padding: 8px 12px;
    font-weight: 300
}

.preOrderModal .caseOrderTable .itemList tbody td:nth-child(1), .preOrderModal .caseOrderTable .itemList thead th:nth-child(1) {
    width: 250px
}

.preOrderModal .caseOrderTable .itemList tbody td:last-child, .preOrderModal .caseOrderTable .itemList thead th:last-child {
    width: 120px
}

.preOrderModal .caseOrderTable .itemList tbody td .ellipsis {
    width: 220px
}

.preOrderModal .caseOrderTable .itemList .paySumm {
    display: table;
    width: 100%;
    background: #f6f6f6
}

.preOrderModal .caseOrderTable .itemList .paySumm p {
    display: table-cell;
    vertical-align: middle;
    font-weight: 300;
    text-align: center;
    padding: 15px 0;
    position: relative
}

.preOrderModal .caseOrderTable .itemList .paySumm p span, .preOrderModal .caseOrderTable .itemList .paySumm p strong {
    display: block
}

.preOrderModal .caseOrderTable .itemList .paySumm p span {
    font-size: 12px
}

.preOrderModal .caseOrderTable .itemList .paySumm p strong {
    font-family: 'NanumSquareRound';
    font-weight: 900;
    font-size: 18px
}

.preOrderModal .caseOrderTable .itemList .paySumm p:nth-child(1)::after {
    content: "+";
    font-family: 'NanumSquareRound';
    font-weight: 900;
    position: absolute;
    top: 25px;
    right: -6px;
    font-size: 30px;
    color: #333
}

.preOrderModal .caseOrderTable .itemList .paySumm p:nth-child(2)::after {
    content: "=";
    font-family: 'NanumSquareRound';
    font-weight: 900;
    position: absolute;
    top: 25px;
    right: -6px;
    font-size: 30px;
    color: #333
}

.preOrderModal .caseOrderTable .itemList .sectionBtn {
    margin-top: 20px;
    text-align: center
}

.preOrderModal .caseOrderTable .itemList .sectionBtn a {
    display: block;
    border-radius: 6px
}

.preOrderModal .caseOrderTable .itemList .scrollWrap {
    height: 196px;
    overflow: auto
}

.agreeSet .allTxtBox > p {
    margin-bottom: 10px
}

.agreeSet .allTxtBox {
    max-height: 560px;
    overflow: auto;
    padding: 20px;
    color: #666;
    font-size: 0.85rem
}

.agreeSet .allTxtBox strong {
    font-weight: 500;
    color: #000;
    display: block
}

.agreeSet .allTxtBox .head-tit {
    font-size: 1.2rem
}

.agreeSet .allTxtBox .tit {
    margin-top: 20px;
    font-size: 1rem
}

.agreeSet .allTxtBox .sub-tit {
    margin-top: 20px
}

.agreeSet .allTxtBox .inner > ul > li > ul {
    padding-left: 15px
}

.agreeSet .allTxtBox .tbl-basic {
    margin: 8px 0
}

.agreeSet .allTxtBox .tbl-basic th, .agreeSet .allTxtBox .tbl-basic td {
    font-size: 0.85rem;
    color: #666;
    padding: 8px;
    font-weight: 400
}

.agreeSet .allTxtBox .tbl-basic th {
    background: #f9f9f9;
    border: 1px solid #ccc;
    color: #111
}

.agreeSet .allTxtBox .tbl-basic td {
    background: rgba(255,255,255,0.2);
    border: 1px solid #d6d6d6
}

.agreeSet .allTxtBox .tbl-basic caption {
    color: #111;
    font-weight: 500;
    margin: 16px 0 8px 0
}

/*.modal .modalBody .searchSchoolForm { border-bottom:2px solid #272c38; padding-bottom:16px }*/
.modal .modalBody .boardHeader {
    border: 0px none;
    padding: 0 0 5px 0;
    margin: 0
}

.modal .modalBody .listTypeA {
    max-height: 300px;
    overflow: auto;
    margin-top: 0;
    border-bottom: 1px solid #272c38
}

.modal .modalBody .listTypeA thead th {
    height: 36px;
    line-height: 36px;
    font-weight: 400
}

.modal .modalBody .listTypeA .fixedArea {
    position: fixed;
    width: 620px
}

.modal .modalBody .listTypeA .fixedArea + table {
    margin-top: 36px
}

.modal .modalBody .paddingTable td {
    padding: 8px
}

.searchSchoolForm {
    position: relative;
    margin-bottom: 16px
}

.searchSchoolForm a {
    position: absolute;
    right: 0;
    bottom: 16px;
    text-decoration: underline
}

.modalBody .orderFormWrap {
    margin: 10px auto
}

.modalBody .orderFormWrap th, .modalBody .orderFormWrap td {
    padding: 10px
}

.submitGroup .btn {
    margin: 0 3px
}

.resetPwWrap {
    display: none
}

.mapModal .top h2 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.3rem;
    line-height: 1.3rem;
    display: inline-block;
    margin-right: 20px
}

.mapModal .top .addr {
    display: inline-block
}

.mapModal .top .addr span {
    display: inline-block;
    font-size: 0.9rem;
    border-radius: 3px;
    height: 26px;
    line-height: 24px;
    padding: 0 10px;
    color: #fff
}

.mapModal .top .addr span:nth-child(1) {
    background: #2651b4;
    border: 1px solid #2651b4;
    color: #fff
}

.mapModal .top .addr span:nth-child(2) {
    background: #fff;
    border: 1px solid #d9d9d9;
    color: #666
}

.mapModal .map {
    background: #f6f6f6;
    width: 1000px;
    height: 520px;
    margin: 20px 0
}

.mapModal .bottom {
    position: relative
}

.mapModal .bottom .marketNumber {
    position: absolute;
    right: 0;
    bottom: 0
}

.mapModal .bottom img {
    max-width: 15px;
    height: auto;
    margin-right: 8px
}

.mapModal .closeModal {
    position: absolute;
    top: 30px;
    right: 40px
}

/*** model test result css ***/
.modalTestResult .modalBody {
    padding: 27px;
}

/* modalResult-title */
.modalResult-title {
    position: relative;
    overflow: hidden;
    text-align: center;
}

.modalResult-title h2 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    color: #272c38;
    font-size: 24px;
    font-weight: bold;
}

.modalResult-title p {
    float: right;
    color: #666;
    font-size: 13px;
    line-height: 18px;
}

/* modalResult-top */
.modalResult-score {
    padding-top: 40px;
    overflow: hidden;
    color: #272c38;
}

.modalResult-score p {
    display: inline-block;
    font-size: 16px;
}

.modalResult-score h1 {
    float: right;
    font-size: 24px;
    font-weight: 500;
}

.modalResult-score h1 strong {
    padding-left: 10px;
    font-size: 34px;
}

.modalResult-name {
    padding-top: 15px;
    overflow: hidden
}

.modalResult-name span {
    width: 370px;
    height: 40px;
    color: #808080;
    line-height: 40px;
    text-align: center;
    background-color: #f1f2f7;
}

.modalResult-name span:first-child {
    float: left;
}

.modalResult-name span:last-child {
    float: right;
}

/* modalResult-center */
.modalResult-center {
    padding-top: 30px;
}

.modalResult-center .modalResult-table h3 {
    font-size: 18px;
    color: #272c38;
}

.modalResult-table table {
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.modalResult-table table td {
    width: 125px;
    padding: 10px 15px;
    border: 1px solid #ccc;
    border-right: none;
    border-bottom: none;
}

.modalResult-table table tr:nth-child(odd) {
    background-color: #f2f3f7;
}

.modalResult-table table tr:nth-child(even) {
    background-color: #e8ecfa;
}

.modalResult-table table td:nth-child(even) {
    text-align: center;
    color: #000;
}

.modalResult-table2 {
    margin-top: 30px;
}

/* modalResult-bottom */
.modalResult-bottom p {
    margin-top: 20px;
    color: #666666;
    font-size: 13px;
}

.modalResult-btns {
    text-align: center;
}

.modalResult-btns a {
    display: inline-block;
    margin-top: 30px;
    text-align: center;
    width: 139px;
    height: 40px;
    line-height: 40px;
    color: #fff;
    font-size: 15px;
    border-radius: 5px;
}

.modalResult-btns a:first-child {
    background-color: #e9463f;
}

.modalResult-btns a:last-child {
    background-color: #272c38;
}

/* model 온라인 단어 시험 만들기css */
.commonTestMake .modalBody {
    padding: 0;
}

.modalTestMake .testMake-inner {
    font-family: 'Noto Sans KR',sans-serif;
}

.modalTestMake .testMake-top {
    padding: 20px 25px 0;
    margin-bottom: 15px;
}

.modalTestMake .testMake-top div h2 {
    width: 130px;
    color: #272c38;
    font-size: 19px;
    font-weight: bold;
    display: inline-block;
}

.modalTestMake .testMake-top div i {
    color: #e8463e;
}

.modalTestMake .testMake-top div input {
    width: 316px;
    height: 40px;
    margin: 5px 0;
    border: none;
    background-color: #f1f2f7;
}

.modalTestMake .testMake-top div input::placeholder {
    color: #808080;
    font-size: 15px;
}

.testMake-center {
    position: relative;
    padding: 20px;
}

.testMake-center::before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #d2d2d2;
}

.testMake-center h4 {
    margin-bottom: 20px;
    color: #56595e;
    font-weight: 400;
}

.testMake-center h4 strong {
    color: #272c38;
}

.testMake-center .testMake-url {
    display: flex;
    justify-content: space-between;
}

.testMake-center .testMake-url .testUrl-btn {
    display: inline-block;
    margin-bottom: 20px;
    width: 220px;
    height: 40px;
    line-height: 40px;
    color: #fff;
    border-radius: 10px;
    box-sizing: border-box;
    background-color: #495164;
}

.testMake-center .testMake-url .testUrl-btn img {
    padding: 0 10px;
}

.testMake-center .testMake-url .testUrl-btn p {
    position: relative;
    display: inline-block;
    padding-left: 13px;
}

.testMake-center > p {
    color: #56595e;
}

.testMake-center > p strong {
    color: #272c38;
}

.testMake-center .testMake-url .testUrl-btn p:after {
    content: '';
    position: absolute;
    width: 1px;
    top: 0;
    left: 0;
    height: 100%;
    background-color: #3a4150;
}

.testMake-bottom .testMake-btn a {
    float: left;
    width: 250px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 16px;
    color: #fff;
}

.testMake-bottom .testMake-btn a:first-child {
    background-color: #272c38;
}

.testMake-bottom .testMake-btn a:last-child {
    background-color: #e8463e;
}

.testMake-bottom .testMake-btn:after {
    content: '';
    clear: both;
    display: block;
}

/* (s)1인 다계정 아이디 선택 modal 축 (2022-12-20)*/
.idMultiModal {
    width: 1060px;
    margin: 0 auto;
    background: #fff
}

.idMultiModal .guideTxt01 {
    text-align: center;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 25px;
}

.idMultiModal .guideTxt02 {
    text-align: center;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 35px;
}

.idMultiModal .idList thead th {
    background-color: #f6f6f6;
    color: #272c38;
}

.idMultiModal .modalBody .idList {
    border: 1px solid #979797;
    border-style: solid none;
}

.idMultiModal .modalBody .idList table {
    border: hidden;
    border-collapse: collapse;
}

.idMultiModal .modalBody .idList table th, .idMultiModal .modalBody .idList table td {
    border: 1px solid #d6d6d6;
    text-align: center;
}

.idMultiModal .modalBody .idList table th {
    padding: 4px 8px;
}

.idMultiModal .modalBody .idList table td {
    padding: 8px;
}

/* (e)1인 다계정 아이디 선택 modal 축 (2022-12-20)*/
.toolbar {
    position: fixed;
    right: 0;
    bottom: -120px;
    left: 0;
    border-top: 1px solid #e9e9e9;
    background: #fff;
    transition: all .3s ease;
    z-index: 100
}

.toolbar.active {
    bottom: 0
}

.toolbar .toggleToolbar {
    background: #fff;
    border: 1px solid #e9e9e9;
    border-bottom: 0px none;
    width: 70px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    position: absolute;
    right: 0;
    top: -60px;
    cursor: pointer
}

.toolbar .toggleToolbar img {
    max-width: 30px
}

.toolbar .innerContainer {
    width: 1280px;
    margin: 0 auto;
    overflow: hidden
}

.toolbar-inner {
    height: 120px;
    background: #fff;
    position: relative
}

.toolbar-inner .ts {
    float: left;
    height: 100%;
    width: 140px;
    position: relative;
    transition: all .5s ease
}

.toolbar-inner .ts .innerList {
    display: none;
    height: 100%;
    transition: all .3s ease
}

.toolbar-inner .ts.active {
    width: 1000px
}

.toolbar-inner .ts.active .innerList {
    display: block
}

.toolbar-inner .ts.active .innerList .viewMore {
    position: absolute;
    top: 50%;
    right: 14px;
    margin-top: -15px;
    background: #bfc0c1;
    color: #fff;
    font-size: 1.5rem;
    font-weight: 600;
    width: 46px;
    height: 30px;
    line-height: 30px;
    text-align: center
}

.toolbar-inner .ts h3 {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    color: #fff;
    background: red;
    width: 140px;
    text-align: center;
    cursor: pointer
}

.toolbar-inner .ts.active h3:after {
    content: "▶";
    position: absolute;
    top: 50%;
    right: -13px;
    margin-top: -11px;
    color: #ffd900
}

.toolbar-inner .ts h3 img {
    display: block;
    margin: 25px auto 5px
}

.toolbar .innerList ul {
    width: 94%;
    height: 100%;
    padding: 15px 0 15px 170px;
    overflow: hidden
}

.toolbar .innerList ul::after {
    content: "";
    display: block;
    clear: both
}

.toolbar .innerList li {
    float: left;
    margin-right: 20px;
    margin-bottom: 30px
}

.toolbar .innerList li img {
    max-width: 64px
}

.toolbar-inner .ts.ts1 h3 {
    background: #ffd900;
    color: #272c38;
    font-weight: 500
}

.toolbar-inner .ts.ts2 h3 {
    background: #2c93e8;
    color: #fff;
    font-weight: 500
}

.toolbar-inner .ts.ts3 h3 {
    background: #272c38;
    color: #fff;
    font-weight: 500
}

.toolbar .innerList .noContents {
    width: 94%;
    text-align: center;
    padding-left: 170px;
    line-height: 120px;
    color: #999;
    font-weight: 300
}

.toolbar .innerList .noContents img {
    vertical-align: -2px
}

.toolbar-inner .ts.ts2.active h3:after {
    color: #2c93e8
}

.toolbar-inner .ts.ts3.active h3:after {
    color: #272c38
}

.toolbarMini {
    position: fixed;
    right: 0;
    bottom: -60px;
    left: 0;
    height: 60px;
    transition: all .3s ease;
    z-index: 30
}

.toolbarMini .innerContainer {
    width: 1280px;
    margin: 0 auto;
    overflow: hidden
}

.toolbarMini ul {
    float: right;
    pointer-events: painted;
}

.toolbarMini li {
    float: left;
    height: 60px
}

.toolbarMini li:nth-child(1) {
    background: #ffd900;
    color: #272c38;
}

.toolbarMini li:nth-child(2) {
    background: #2c93e8;
    color: #fff;
}

.toolbarMini li:nth-child(3) {
    background: #272c38;
    color: #fff;
}

.toolbarMini li a {
    display: block;
    line-height: 60px;
    padding: 0 25px
}

.toolbarMini li a img {
    max-width: 25px;
    height: auto;
    margin-right: 10px
}

.toolbarMini.active {
    bottom: 0;
    pointer-events: none;
}

.itemListWrap .sortingWrap .sel_wrap {
    margin-right: 10px
}

.ctrlArticle + .regReview, .text + .regReview, .attachmentCont + .regReview {
    display: none;
    margin-bottom: 20px
}

.regReplyCurrent.active {
    background: #495164 ! important;
    border-color: #495164;
    color: #fff
}

.regReplyCurrent img {
    transition: all .3s ease;
    margin-left: 8px;
    margin-top: -2px
}

.regReplyCurrent.active img {
    transform: rotate(180deg);
    filter: brightness(0) invert(1);
}

.reviewList .article .text.hidden {
    display: none
}

.regReview.editForm {
    margin-top: 10px
}

.gradeWrap {
    position: relative;
    margin: 26px 0 0 0;
    height: 34px
}

.gradeWrap .bar {
    height: 18px;
    border-radius: 500px;
    background-image: linear-gradient(to right, #fecb10, #e8473e)
}

.gradeWrap span {
    position: absolute;
    color: #999;
    background: #fff;
    border: 1px solid #d6d6d6;
    padding: 5px 15px;
    border-radius: 500px;
    top: -8px
}

.gradeWrap span.low {
    left: 10px;
    border-color: #fecb10;
    color: #cfac77
}

.gradeWrap span.high {
    right: 10px;
    border-color: #e8473e;
    color: #e8473e
}

.gradeWrap span.low:before {
    content: "←";
    padding-right: 10px
}

.gradeWrap span.high:after {
    content: "→";
    padding-left: 10px
}

/*.curationTable { max-width:1280px; overflow-x:scroll }*/
/*.curationTable table { min-width:1900px; table-layout:fixed }
.curationTable .thead td { background:#e8eaee; color:#111; font-weight:500; border:1px solid #d6d6d6; padding:8px; text-align:center; border-bottom-color:#aaa }
.curationTable tbody th { background:#f6f6f6; font-weight:500; color:#111; padding:8px; text-align:center; border:1px solid #eaeaea }
.curationTable tbody td { padding:8px; text-align:center; border:1px solid #eaeaea; font-size:0.9rem; color:#666; letter-spacing:-0.5px }
*/
.curationTable {
    width: 1280px ;
    overflow: hidden;
    /*white-space: nowrap;*/
}

.curationTable .thead {
    position: relative;
    z-index: 20
}

.curationTable .thead table {
    table-layout: fixed
}

.curationTable .thead th {
    background: #e8eaee;
    color: #111;
    font-size: 0.85rem;
    font-weight: 500;
    border: 1px solid #d6d6d6;
    padding: 10px 5px;
    text-align: center
}

.curationTable .flexable {
    width: 1280px;
    /*max-height:500px; overflow-y:auto; overflow-x:hidden; */
    margin-top: -1px
}

.curationTable .flexable table {
    table-layout: fixed;
    width: 1280px
}

.curationTable .flexable tr:first-child th, .curationTable .flexable tr:first-child td {
    border-top: 1px solid #aaa
}

.curationTable .flexable th {
    background: #f6f6f6;
    font-weight: 500;
    color: #111;
    padding: 10px 5px;
    text-align: center;
    border: 1px solid #eaeaea
}

.curationTable .flexable td {
    transition: all .2s ease;
    position: relative;
    padding: 10px 5px;
    text-align: center;
    border: 1px solid #eaeaea;
    font-size: 0.85rem;
    line-height: 1.15rem;
    color: #797979;
    letter-spacing: -0.5px;
    word-break: keep-all
}

.curationTable .flexable td a:hover {
    text-decoration: underline;
    color: #000
}

.curationTable .thead.fixed table {
    position: fixed;
    top: 110px;
    width: 1280px
}

.curationTable .thead.typeA.fixed {
    position: fixed;
    top: 110px;
    width: 1280px;
    overflow: hidden
}

.curationTable .thead.typeA.fixed table {
    position: relative;
    top: 0;
    /*width:2200px*/
}

.curationTable.typeA {
    overflow-x: auto
}

/*.curationTable.typeA table { width:2200px ! important }*/
/*테이블 커스텀 */
.curationTable .flexable.typeA th, .curationTable .flexable.typeA td, .curationTable .flexable.typeB th, .curationTable .flexable.typeB td {
    height: 53px
}

/*.curationTable .flexable.typeA table { width:2200px }*/
/* 스크롤 */
/*
.curationTable .flexable.typeB,
.curationTable .flexable.typeC { max-height:570px; overflow-y:auto; border-bottom:1px solid #eaeaea; overflow-x:hidden }
*/
.curationTable .flexable.typeC td em {
    position: absolute;
    height: 20px;
    background: #ffe7c5;
    top: 50%;
    left: -1px;
    right: -1px;
    margin-top: -10px
}

.curationTable .flexable.typeC td {
    text-align: left
}

.curationTable .flexable.typeC tr:nth-child(2n) td em {
    background: #c5dbff
}

/*.curationTable .flexable.typeC tr:nth-child(3n) td em { background:#ffc5c5 }*/
.mbAddedWrap {
    display: table;
    width: 100%;
    margin: 60px 0 0 0;
    border-top: 1px solid #d6d6d6;
    padding-top: 50px
}

.mbAddedWrap .cont {
    display: table-cell;
    padding: 0 20px;
    vertical-align: top
}

.mbAddedWrap .cont p {
    display: table-cell;
    vertical-align: top;
    word-break: keep-all;
    color: #999
}

.mbAddedWrap .cont .ic {
    display: inline-block;
    background: #f6f6f6;
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    border-radius: 500px
}

.mbAddedWrap .cont p:nth-child(2) {
    padding: 0 0 0 20px
}

.mbAddedWrap .cont span strong {
    display: block;
    color: #222;
    margin-bottom: 8px
}

.mbAddedWrap.joinEndWrap {
    width: 90%;
    margin: 60px auto 0;
    padding-bottom: 50px
}

.singYcloud {
    background: #f6f6f6;
    text-align: left;
    padding: 30px 0px 30px 15px;
}

.singYcloud .multiSet {
    /*display:inline-block;*/
    text-align: center;
    margin-left: 10px;
    margin-top: 5px;
}

.agreeYcloudWrap h4 {
    font-weight: 500;
    margin-bottom: 8px
}

.agreeYcloudWrap .agreeSet {
    padding: 0 15px 15px 15px
}

.agreeYcloudWrap .agreeSet > div {
    margin-bottom: 20px
}

/* datepicker custom style */
.searchRange {
    background: #f1f1f1;
    padding: 15px
}

.searchRange + p {
    margin-top: 10px
}

.searchRange input[type="submit"] {
    border: 0px none;
    cursor: pointer
}

.searchRange > span {
    margin-right: 10px
}

.searchRange .btn.selected {
    background: #272c38;
    color: #fff
}

.searchRange .infoTxt {
    font-size: 0.85rem;
    color: #999;
    margin: 0 5px
}

.hBar {
    width: 5px;
    display: inline-block
}

input.hasDatepicker {
    width: 150px;
    height: 30px;
    margin-right: 40px
}

.ui-datepicker * {
    font-size: 12px ;
}

.ui-datepicker {
    padding: 15px;
    width: 272px;
}

.ui-widget-header {
    border: 1px solid transparent;
    background: transparent;
    color: #0d2546;
}

.ui-datepicker-title * {
    font-size: 14px;
    font-weight: bold;
}

.ui-widget-header .ui-icon {
    background-image: url('../img/common/btn_page_arrow.png');
}

.ui-icon-circle-triangle-w {
    background-position: -20px 50%;
}

.ui-icon-circle-triangle-e {
    background-position: -40px 50%;
}

.ui-widget.ui-widget-content {
    border: 1px solid #303235;
    margin-top: 2px;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    border: 2px solid transparent;
    background: transparent;
    color: #8b93a7;
    text-align: center;
    width: 30px;
    height: 30px;
    line-height: 21px;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
    border: 2px solid #2651b4;
    background: transparent;
    color: #2651b4;
    font-weight: bold;
}

.ui-state-hover,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-hover,.ui-state-focus,.ui-widget-content .ui-state-focus,.ui-widget-header .ui-state-focus,.ui-button:hover,.ui-button:focus {
    border: 2px solid #2651b4;
    background: transparent;
    color: #2651b4;
    font-weight: bold;
}

.ui-datepicker th {
    font-size: 13px;
    font-weight: bold;
    color: #567db4;
}

.searchRange img.ui-datepicker-trigger {
    margin-left: -70px;
    opacity: 0.6
}

.txt_wave {
    margin: 0 0 0 10px
}

.myOrderList tbody td {
    padding: 15px 0
}

.myOrderList tbody td p {
    margin-top: 10px
}

.myOrderList td img.thumbs {
    max-width: 80px;
    height: auto;
    border: 1px solid #ededed;
    margin-right: 10px
}

.oainfo {
    background: #f9f9f9;
    border: 1px solid #ededed;
    padding: 15px;
    margin-top: 20px
}

.oainfo ul + p {
    margin-top: 16px
}

.oainfo li {
    position: relative;
    padding-left: 10px;
    color: #666
}

.oainfo li:before {
    content: "-";
    position: absolute;
    top: 0px;
    left: 0
}

.oaTabsWrap {
    margin-top: 20px
}

.oaTabsWrap .tabs {
    border-bottom: 1px solid #495164;
    margin-bottom: 16px
}

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

.oaTabsWrap .tabs li {
    float: left
}

.oaTabsWrap .tabs li a {
    display: block;
    padding: 10px 30px;
    background: #f6f6f6;
}

.oaTabsWrap .tabs li.active a {
    background: #495164;
    color: #fff
}

.oaTabsWrap .tabContent .processGrf::after {
    content: "";
    display: block;
    clear: both
}

.oaTabsWrap .tabContent .processGrf p {
    float: left;
    text-align: center;
    margin-right: 30px;
    color: #999;
    letter-spacing: -1px
}

.oaTabsWrap .tabContent .processGrf p span.ic {
    display: block;
    background: #f1f1f1;
    width: 100px;
    height: 100px;
    text-align: center;
    line-height: 100px;
    margin: 0 auto;
    border-radius: 500px;
    margin-bottom: 8px
}

.lineWrap {
    margin: 20px 0 0 0
}

.lineWrap em {
    display: block;
    width: 230px;
    height: 1px;
    background: #495164;
    position: relative
}

.lineWrap span {
    display: block;
    width: 230px;
    text-align: center;
    padding-top: 8px;
    color: #495164;
    letter-spacing: -1px
}

.lineWrap em:before {
    content: "";
    position: absolute;
    top: -4px;
    left: 0;
    background: url('../img/common/arrow_s.png');
    width: 5px;
    height: 9px;
    transform: rotate(180deg)
}

.lineWrap em:after {
    content: "";
    position: absolute;
    top: -4px;
    right: 0;
    background: url('../img/common/arrow_s.png');
    width: 5px;
    height: 9px
}

.orderFormWrap, .cartWrap {
    max-width: 1200px;
    margin: 40px auto
}

.orderFormWrap h2, .cartWrap h2 {
    font-size: 1.2rem;
    line-height: 1.3rem;
    text-indent: 0;
    font-weight: 600;
    height: auto;
    margin-bottom: 10px;
    position: relative;
    padding-bottom: 10px
}

.orderFormWrap h2:after, .cartWrap h2:after {
    content: "";
    width: 34px;
    height: 2px;
    background: #272c38;
    position: absolute;
    left: 0;
    bottom: 0
}

.orderFormWrap h2:not(:first-child), .cartWrap h2:not(:first-child) {
    margin-top: 40px
}

.orderFormWrap th, .orderFormWrap td {
    padding: 15px
}

.orderFormWrap th {
    background: #f9f9f9;
    border: 1px solid #ededed
}

.orderFormWrap td {
    background: #fff;
    border: 1px solid #ededed
}

.orderFormWrap .myOrderList thead th {
    background: #f9f9f9;
    padding: 10px;
    border: 1px solid #ccc;
    text-align: center
}

.orderFormWrap .myOrderList tbody td {
    padding: 10px;
    border: 1px solid #ededed
}

.cartWrap .listHeader .btnSet {
    padding: 0;
    background: #fff;
    margin-bottom: 10px
}

.myOrderSumm table {
    table-layout: fixed
}

.myOrderSumm td {
    vertical-align: top;
    position: relative;
    padding: 30px;
    border: 1px solid #ccc
}

.myOrderSumm td:not(:last-child) {
    background: #f9f9f9
}

.myOrderSumm td:nth-child(2):after {
    content: "-";
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 40px;
    border-radius: 500px;
    z-index: 50;
    font-size: 1.8rem
}

.myOrderSumm td:nth-child(3):after {
    content: "+";
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 40px;
    border-radius: 500px;
    z-index: 50;
    font-size: 1.8rem
}

.myOrderSumm td:nth-child(4):after {
    content: "=";
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 38px;
    border-radius: 500px;
    z-index: 50;
    font-size: 1.8rem;
    color: #e8463e
}

.myOrderSumm p.ant {
    margin: 10px 0
}

.myOrderSumm p.ant strong {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.7rem
}

.myOrderSumm p.added {
    font-size: 0.85rem;
    line-height: 1rem;
    color: #999;
    word-break: keep-all
}

.myOrderSumm.giftOrder td:nth-child(2):after {
    content: "+";
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 40px;
    border-radius: 500px;
    z-index: 50;
    font-size: 1.8rem
}

.myOrderSumm.giftOrder td:nth-child(3):after {
    content: "=";
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 38px;
    border-radius: 500px;
    z-index: 50;
    font-size: 1.8rem;
    color: #e8463e
}

.myOrderSumm.giftOrder td:nth-child(4):after {
    content: "";
    display: none
}

.myOrderSumm.myPaySumm td:nth-child(1):after {
    content: "-";
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 40px;
    border-radius: 500px;
    z-index: 50;
    font-size: 1.8rem
}

.myOrderSumm.myPaySumm td:nth-child(2):after {
    content: "=";
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 38px;
    border-radius: 500px;
    z-index: 50;
    font-size: 1.8rem;
    color: #e8463e
}

.myOrderSumm.myPaySumm td:nth-child(3):after {
    display: none
}

.myOrderSumm.typeB td:nth-child(2):after {
    content: "-";
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 38px;
    border-radius: 500px;
    z-index: 50;
    font-size: 1.8rem;
    color: #000
}

.myOrderSumm.typeB td:nth-child(3):after {
    content: "=";
    position: absolute;
    top: 50%;
    right: -20px;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 38px;
    border-radius: 500px;
    z-index: 50;
    font-size: 1.8rem;
    color: #e8463e
}

.myOrderSumm.typeB td:nth-child(4):after {
    content: "";
    display: none
}

.myOrderSumm.payCase td {
    background: #fff ! important
}

.myOrderSumm.payCase td:after {
    display: none ! important
}

.myOrderSumm.payCase a.selected {
    background: #272c38;
    color: #fff
}

.myOrderSumm.payCase .desc {
    font-size: 13px;
    color: #666;
    font-weight: 300;
    margin: 0 30px;
    word-break: keep-all;
    line-height: 18px
}

.orderProcessWrap {
    padding-bottom: 30px;
    border-bottom: 1px solid #ededed
}

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

.orderProcessWrap li {
    float: left;
    position: relative;
    height: 50px;
    line-height: 50px;
    padding: 0 20px;
    border-radius: 500px;
    background: #d8d8d8;
    text-align: center;
    margin-right: 38px
}

.orderProcessWrap li img {
    margin-right: 10px
}

.orderProcessWrap li.current {
    background: #e8463e;
    color: #fff
}

.orderProcessWrap li:not(:last-child):after {
    content: url(../img/common/ic_flow_arrow.png);
    position: absolute;
    top: 8px;
    right: -25px;
}

.cartWrap .infoEditWrap {
    width: 100%;
    border: 1px solid #ededed;
    padding: 0 30px;
    background: #f9f9f9;
    margin: 10px 0 0 0
}

.cartWrap .infoEditWrap .group {
    border-bottom: 1px solid #eaeaea;
    margin: 0;
    padding: 15px 0
}

.cartWrap .infoEditWrap .group:last-child {
    border: 0px none
}

.cartWrap h2 p {
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    display: inline-block;
    font-size: 0.85rem;
    font-weight: 400;
    margin-left: 15px
}

.finOrderText {
    text-align: center;
    padding: 40px 0;
    border-bottom: 1px solid #ededed
}

.finOrderText h1 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.1rem;
    font-weight: 500
}

.finOrderText .orderNum {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 700;
    font-size: 1.2rem;
    margin: 16px 0
}

.isPoint {
    margin: -20px -20px 0 -20px;
    background: #f9f9f9;
    padding: 20px;
    border-bottom: 1px solid #eaeaea;
    position: relative;
    font-size: 19px
}

.isPoint p {
    display: inline-block
}

.isPoint .myPointNum {
    display: inline-block;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    color: #e8463e;
    font-weight: 700;
    font-size: 24px;
    vertical-align: middle
}

.isPoint .myPointNum a {
    display: block;
}

.isPoint .myPointNum span {
    display: inline-block;
    vertical-align: 2px;
    margin-left: 5px;
    background: #004f7a;
    border-radius: 500px;
    width: 16px;
    height: 16px;
    line-height: 18px;
    text-align: center;
    color: #fff;
    font-size: 0.75rem
}

.isPoint .goGiftMall {
    font-weight: 300;
    display: inline-block;
    background: #004f7a;
    border: 2px solid #fff;
    color: #fff;
    height: 40px;
    line-height: 34px;
    padding: 0 20px;
    border-radius: 500px;
    margin-left: 10px;
    box-shadow: 2px 2px 0 rgba(0,0,0,0.15);
    font-size: 16px
}

.isPoint .goGiftMall span {
    vertical-align: -2px;
    margin-right: 8px
}

.isPoint .btn {
    position: absolute;
    top: 20px;
    right: 20px
}

.pointSnb {
    margin-top: 20px
}

.pointSnb {
    border-bottom: 2px solid #495164;
    margin-bottom: 16px;
    margin-right: 18px;
}

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

.pointSnb li {
    float: left;
    position: relative
}

.pointSnb li a {
    display: block;
    padding: 10px 30px;
    background: #f6f6f6;
}

.pointSnb li:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 15px;
    background: #ccc;
    top: 15px;
    left: 0
}

.pointSnb li.active a {
    background: #495164;
    color: #fff
}

.pointSnb li.active:after, .pointSnb li:first-child:after {
    width: 0
}

.pointSnb li.active + li:after {
    width: 0
}

.marketSnb {
    margin-top: 20px
}

.marketSnb {
    border-bottom: 1px solid #495164;
    margin-bottom: 16px
}

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

.marketSnb li {
    float: left;
    position: relative
}

.marketSnb li a {
    display: block;
    padding: 10px 30px;
    background: #f6f6f6;
}

.marketSnb li:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 15px;
    background: #ccc;
    top: 15px;
    left: 0
}

.marketSnb li.active a {
    background: #495164;
    color: #fff
}

.marketSnb li.active:after, .marketSnb li:first-child:after {
    width: 0
}

.marketSnb li.active + li:after {
    width: 0
}

.tableHeader {
    position: relative
}

.tableHeader .goGiftMall {
    position: absolute;
    bottom: -7px;
    right: 0;
    background: #004f7a;
    color: #fff;
    height: 36px;
    line-height: 36px;
    padding: 0 25px;
    border-radius: 500px
}

.tableHeader .goGiftMall span {
    vertical-align: -2px;
    margin-right: 8px
}

.scss p {
    margin-top: 14px ! important
}

.scss .etcText {
    display: none
}

.pointSnb {
    margin-bottom: 0
}

.giftMallBox {
    margin-top: 24px;
}

.giftMallBox .isPoint {
    margin: 0;
    padding: 20px;
}

.giftMallBox .marginTop20 ,.giftMallBox .sortingWrap, .giftMallBox .boardHeader {
    padding-left: 20px !important;
}

.giftMallBox .depthCategorySet {
    padding: 20px !important;
}

.giftMallBox .giftMall .depthCategorySet {
    margin-top: 0;
}

.giftMallBox .giftMall .isPoint h3 {
    color: #272c38;
}

.giftMallBox .giftMall-Login {
    margin-left: 10px;
    padding: 5px 18px;
    font-size: 17px;
    border-radius: 5px;
    color: #fff;
    background-color: #272c38;
}

.giftMallBox .itemListWrap {
    background: #fff;
    position: relative;
    margin: 0;
}

.giftMallBox .pointSnb {
    margin-left: 20px;
    margin-bottom: 0;
}

.giftMall .depthCategorySet {
    padding: 0 0 20px 0;
    margin-top: 30px
}

.giftMall .depthCategorySet li {
    float: left;
    margin: 0 8px 0 0
}

.giftMall .depthCategorySet li.active a {
    background: #495164;
    border-color: #495164
}

.giftMall .depthCategorySet li a em {
    display: inline-block;
    font-size: 0.75rem;
    background: #d1d1d1;
    color: #fff;
    font-weight: 600;
    border-radius: 500px;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 16px;
    vertical-align: 2px;
    margin-left: 5px
}

.giftMall .itemListWrap {
    padding: 0
}

.giftMall .boardHeader {
    padding: 0 0 10px 0
}

.giftMall .boardHeader .sorting a {
    background: none;
    border: 0px none;
    color: #666;
    padding: 0
}

.giftMall .boardHeader .sorting a.selected {
    font-weight: 500;
    color: #e8463e
}

.giftMall .boardHeader .sorting a:not(:last-child):after {
    content: "|";
    color: #ccc;
    padding: 0 10px 0 15px
}

.giftMall .itemListWrap .mContents, .giftMall .itemListA.arrGallery {
    width: 100%;
    padding-top: 30px;
    margin: 0 0 5px 0;
    display: block;
    border-right: 0px none
}

.giftMall .itemListA.arrGallery .article {
    width: 33.33%;
    padding: 0 10px 30px 10px;
    height: 530px;
    margin-bottom: 30px;
    border: 1px solid transparent;
    transition: all .4s ease
}

.giftMall .itemListA.arrGallery .article .iteminfo {
    position: relative;
    padding-bottom: 0
}

.giftMall .itemListWrap .itemListA.arrGallery {
    position: relative;
}

.giftMall .itemListWrap .itemListA.arrGallery:before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 97%;
    height: 2px;
    background-color: #495164;
}

.giftMall .itemListA.arrGallery .article .itemName {
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1rem;
    font-weight: 400;
    word-break: keep-all;
    letter-spacing: -0.5px;
    color: #666;
    line-height: 1.4rem;
    height: 44px;
    margin-top: 6px
}

.giftMall .itemListA.arrGallery .itemPrice {
    padding: 10px 0;
    margin: 0;
    font-size: 1.05rem
}

.giftMall .itemListA .itemPrice .salePrice strong {
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 0.95rem;
    line-height: 1.1rem;
    font-weight: 500
}

.giftMall .itemListA.arrGallery .article .etc {
    font-size: 0.85rem;
    color: #666
}

.giftMall .getThis {
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: 230px;
    left: 50%;
    margin-left: -50px;
    transition: all .3s ease
}

.giftMall .getThis a {
    display: table;
    width: 100px;
    height: 100px;
    border-radius: 500px;
    text-align: center;
    background: rgba(73,81,100,0.85);
    color: #fff;
    font-weight: 400;
    transition: all .3s ease
}

.giftMall .getThis.soldout a {
    cursor: default;
    background: rgba(0,0,0,0.2) ! important;
    box-shadow: none ! important
}

.giftMall .getThis a em {
    display: table-cell;
    vertical-align: middle;
    line-height: 1.2rem
}

.giftMall .article:hover .getThis {
    opacity: 1;
    top: 210px
}

.giftMall .article.over .dim {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(209,227,255,0.6)
}

.giftMall .article.over .getThis {
    opacity: 1;
    top: 210px
}

.giftMall .article.over .getThis a {
    background: rgba(0, 0, 0, 0.5) ! important
}

.giftMall .article.over .getThis.result {
    overflow: unset;
}

.giftMall .article.over .getThis.result a {
    background: #e8463e ! important;
    box-shadow: 3px 3px 0 rgba(0,0,0,0.2);
}

.giftMall .itemListA.arrGallery .article:hover {
    border-color: #495164;
    background: #f6f6f6
}

.giftMall .itemListA.arrGallery + .pagenation {
    margin-top: 20px
}

.giftMall .itemListA .article .thumbs img {
}

.giftMall .itemListA.arrGallery .hash span {
    padding: 0;
    color: #999;
    border: 0px none
}

.giftMall .itemListA.arrGallery .hash span:before {
    content: ""
}

.giftMall .itemListA.arrGallery .hash span:not(:last-child):after {
    content: ","
}

.articleSectionName {
    display: inline-block;
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 0.95rem;
    position: relative;
    vertical-align: 2px;
    margin-left: 15px;
    color: #999
}

.articleSectionName:before {
    content: "|";
    padding-right: 15px;
    color: #ccc
}

.articleSectionName:after {
    content: url(../img/common/ic_next.png);
    position: absolute;
    top: 11px;
    right: -40px;
    transition: all .3s ease
}

.articleSectionName:hover {
    text-decoration: underline;
    color: #666
}

.articleSectionName:hover:after {
    right: -50px
}

.isPoint h3 {
    display: inline-block;
    vertical-align: middle;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.2rem;
    font-weight: 600
}

.isPoint .memberType {
    margin-right: 10px
}

.viewPointGuide {
    position: absolute;
    right: 20px;
    bottom: 24px;
    font-size: 15px
}

.viewGiftGuide {
    position: absolute;
    right: 150px;
    bottom: 24px;
    font-size: 15px
}

.pGuideBox {
    display: none;
    position: absolute;
    top: 60px;
    right: 0;
    background: #fff;
    border: 1px solid #495164;
    z-index: 2;
    font-size: 0.9rem;
    width: 470px
}

.pGuideHeader {
    background: #495164;
    position: relative
}

.pGuideHeader h3 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.2rem;
    color: #fff !important;
    font-weight: 700;
    height: 50px;
    line-height: 50px;
    text-indent: 20px
}

.pGuideBody {
    padding: 25px
}

.pGuideBody p {
    font-size: 0.8rem;
    color: #999;
}

.pGuideBody p br {
    display: none
}

.pGuideBody ul {
    margin-bottom: 10px;
}

.pGuideBody li {
    display: table;
    width: 100%;
    border-bottom: 1px solid #ececec
}

.pGuideBody li span, .pGuideBody strong {
    display: table-cell;
    padding: 10px
}

.pGuideBody li span em {
    display: block;
    color: #999;
    font-size: 12px
}

.pGuideBody li strong {
    text-align: right
}

.pGuideBox .closepGuideBox {
    position: absolute;
    top: 12px;
    right: 20px;
    width: 20px;
    height: 20px
}

.giftGuideBox {
    display: none;
    position: absolute;
    top: 60px;
    right: 0;
    background: #fff;
    border: 1px solid #495164;
    z-index: 2;
    font-size: 0.9rem;
    width: 450px
}

.giftGuideHeader {
    background: #495164;
    position: relative
}

.giftGuideHeader h3 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.2rem;
    color: #fff !important;
    font-weight: 700;
    height: 50px;
    line-height: 50px;
    text-indent: 20px
}

.giftGuideBody {
    padding: 15px
}

.giftGuideBody p {
    font-size: 0.8rem;
    color: #999;
    margin-top: 10px
}

.giftGuideBody li {
    display: table;
    width: 100%;
    border-bottom: 1px solid #ececec;
    padding: 8px
}

.giftGuideBody li:last-child {
    border: 0px none
}

.giftGuideBox .closeGiftGuideBox {
    position: absolute;
    top: 12px;
    right: 20px;
    width: 20px;
    height: 20px
}

.viewFmList {
    display: inline-block;
    width: 200px;
    height: 40px;
    line-height: 40px;
    text-indent: 15px;
    background: #fff;
    border: 1px solid #ececec;
    position: relative;
}

.viewFmList img {
    position: absolute;
    top: 17px;
    right: 15px;
    transform: rotate(-180deg);
    transition: all .3s ease
}

.viewFmList.active img {
    transform: rotate(0deg)
}

.fmList {
    display: none;
    position: absolute;
    right: 0;
    bottom: 50px;
    width: 200px;
    background: #fff;
    border: 1px solid #ececec;
    z-index: 50
}

.fmList li {
    display: block;
    padding: 0;
    line-height: 40px
}

.fmList li a {
    display: block;
    text-indent: 15px;
    font-size: 0.85rem
}

.fmList li:first-child {
    border-bottom: 1px solid #ececec
}

.ellipsis.bookList {
    width: 350px
}

.noArticle {
    text-align: center;
    padding: 50px 0;
    color: #999
}

.evHeader h2 {
    margin: 30px 0 0 0;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 1.5rem;
    line-height: 2.2rem;
    letter-spacing: -1px;
    font-weight: 900;
    color: #000;
}

.evBoardList .article {
    display: table;
    width: 100%;
    border-bottom: 1px solid #d6d6d6;
    padding: 30px 0
}

.evBoardList .article .thumbs, .evBoardList .article .info {
    display: table-cell;
    vertical-align: middle
}

.evBoardList .article .thumbs {
    width: 540px
}

.evBoardList .article .thumbs img {
    width: 540px;
    height: 200px;
    transition: all .3s ease
}

.evBoardList .article .thumbs:hover img {
    box-shadow: 8px 8px 0 rgba(0,0,0,0.15)
}

.evBoardList .article .info {
    padding: 0 0 0 40px
}

.evBoardList .article .info .subject {
    font-family: 'NanumSquareRound';
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 600;
    letter-spacing: -0.5px;
    color: #333;
    word-break: keep-all
}

.evBoardList .article .info .desp {
    margin: 20px 0;
    color: #666;
    font-weight: 300;
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.evBoardList .article .info .date {
    display: inline-block;
    background: #eaeaea;
    padding: 5px 25px;
    border-radius: 500px
}

.evBoardDetails .subject {
    position: relative;
    border-bottom: 1px solid #d6d6d6;
    padding-bottom: 20px
}

.evBoardDetails .subject h2 {
    text-align: left;
    margin-top: 30px;
    font-family: 'NanumSquareRound';
    font-size: 1.6rem;
    line-height: 2rem;
    font-weight: 600;
    letter-spacing: -0.5px;
    color: #333;
    word-break: keep-all
}

.evBoardDetails .date {
    position: absolute;
    bottom: 25px;
    right: 0;
    text-align: center;
    margin: 10px 0 0 0
}

.evBoardDetails .date span {
    display: inline-block;
    background: #eaeaea;
    padding: 5px 25px;
    border-radius: 500px
}

[data-tooltip-text]:hover {
    position: relative
}

[data-tooltip-text]:after {
    transition: all .3s ease;
    border-radius: 6px;
    color: #666;
    background: rgba(255,255,255,1);
    border: 1px solid #d6d6d6;
    box-shadow: 0 0 8px rgba(0,0,0,0.1);
    padding: 15px;
    position: absolute;
    width: auto;
    min-width: 50px;
    max-width: 600px;
    top: 40px;
    left: 40px;
    word-wrap: break-word;
    z-index: 9999;
    opacity: 0;
    content: attr(data-tooltip-text);
    font-size: 0.95rem;
    font-weight: 300
}

[data-tooltip-text]:hover:after {
    opacity: 1
}

.ifNecsText {
    margin-top: 30px;
    text-align: center;
    font-size: 16px;
    font-weight: 300;
    letter-spacing: -0.5px
}

.ifNecsText strong {
    font-weight: 400
}

.ifNecsText .simpleBtn {
    display: inline-block;
    margin-top: 20px;
    border: 1px solid #eaeaea;
    background: #f6f6f6;
    padding: 8px 40px 8px 20px;
    position: relative;
    color: #666;
    font-size: 15px;
    letter-spacing: 0
}

.ifNecsText .simpleBtn::after {
    content: ">";
    font-family: dotum, "돋움";
    font-size: 12px;
    position: absolute;
    top: 9px;
    right: 20px
}

.settingWrap {
    max-width: 1000px;
    margin: 0 auto
}

.settingWrap h1 {
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 1.8rem;
    line-height: 2rem;
    margin-bottom: 20px;
    margin-top: 40px
}

.settingWrap .settingCondition {
    background: rgba(22,94,168,0.05);
    padding: 50px
}

.settingWrap .settingCondition p {
    font-size: 1.3rem;
    font-weight: 300
}

.infoTextSetting {
    background: #fff;
    border: 1px solid #eaeaea;
    padding: 15px
}

.infoTextSetting li {
    position: relative;
    padding-left: 12px;
    font-weight: 300
}

.infoTextSetting li strong {
    font-weight: 500
}

.infoTextSetting li::before {
    content: "";
    width: 4px;
    height: 4px;
    background: #495164;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -2px
}

.listTypeA.hasPadding td {
    padding: 10px ! important
}

.listTypeA.hasPadding td p {
    margin: 6px 0
}

.settingWrap .userCondition.yet {
    color: #e8463e
}

.settingWrap .userCondition.done {
    color: #004f7a
}

.settingWrap .selectCertiType .box:nth-child(1) .btnWarp {
    margin-top: 40px
}

/*.evDetailsStamp { background:#82daff; margin-top:30px; padding-bottom:60px }*/
.evStampTop {
    padding: 60px 0 100px 0;
    text-align: center
}

.evStampTop h3, .evStampTop h4 {
    font-family: 'Jalnan', serif;
}

.evStampTop h3 {
    font-size: 30px;
    line-height: 34px;
    color: #284e8b
}

.evStampTop h4 {
    font-size: 70px;
    line-height: 76px;
    color: #fff;
    margin-top: 10px;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.15)
}

.evStampTop .desp {
    font-size: 21px;
    color: #000;
    letter-spacing: -1px;
    margin: 20px 0 40px 0
}

.evStampTop .btnArea a {
    display: inline-block;
    background: #284e8b;
    border: 5px solid #fff;
    padding: 20px 100px;
    font-size: 25px;
    font-weight: 600;
    color: #fff;
    border-radius: 500px
}

.evStampBody {
    background: url('../img/event/ev_stamp_road.png') no-repeat center top;
    height: 982px;
    position: relative
}

.stamp {
    position: absolute
}

.stamp span {
    display: block;
    width: 91px;
    height: 112px;
    text-align: center;
    font-family: 'Jalnan', serif;
    font-size: 17px
}

.stamp:last-child span {
    text-align: right;
    padding-left: 80px;
    padding-top: 40px;
    width: 140px;
    background-position: left center
}

.stamp .default {
    background: url('../img/event/ev_stamp_marker_default.png') no-repeat center top;
    opacity: 0.25
}

.stamp .finish {
    background: url('../img/event/ev_stamp_marker_finish.png') no-repeat center top;
    opacity: 1
}

/* 20일 마커 위치 */
.evStampBody.templete20Days .stamp:nth-child(1) {
    left: 176px;
    top: -50px
}

.evStampBody.templete20Days .stamp:nth-child(2) {
    left: 320px;
    top: 10px
}

.evStampBody.templete20Days .stamp:nth-child(3) {
    left: 500px;
    top: 10px
}

.evStampBody.templete20Days .stamp:nth-child(4) {
    left: 680px;
    top: 10px
}

.evStampBody.templete20Days .stamp:nth-child(5) {
    left: 900px;
    top: 15px
}

.evStampBody.templete20Days .stamp:nth-child(6) {
    left: 880px;
    top: 216px
}

.evStampBody.templete20Days .stamp:nth-child(7) {
    left: 720px;
    top: 216px
}

.evStampBody.templete20Days .stamp:nth-child(8) {
    left: 500px;
    top: 216px
}

.evStampBody.templete20Days .stamp:nth-child(9) {
    left: 300px;
    top: 216px
}

.evStampBody.templete20Days .stamp:nth-child(10) {
    left: 120px;
    top: 270px
}

.evStampBody.templete20Days .stamp:nth-child(11) {
    left: 220px;
    top: 430px
}

.evStampBody.templete20Days .stamp:nth-child(12) {
    left: 400px;
    top: 430px
}

.evStampBody.templete20Days .stamp:nth-child(13) {
    left: 640px;
    top: 430px
}

.evStampBody.templete20Days .stamp:nth-child(14) {
    left: 820px;
    top: 430px
}

.evStampBody.templete20Days .stamp:nth-child(15) {
    left: 1000px;
    top: 440px
}

.evStampBody.templete20Days .stamp:nth-child(16) {
    left: 940px;
    top: 630px
}

.evStampBody.templete20Days .stamp:nth-child(17) {
    left: 800px;
    top: 630px
}

.evStampBody.templete20Days .stamp:nth-child(18) {
    left: 640px;
    top: 630px
}

.evStampBody.templete20Days .stamp:nth-child(19) {
    left: 500px;
    top: 640px
}

.evStampBody.templete20Days .stamp:nth-child(20) {
    left: 420px;
    top: 820px
}

/* 15일 마커 위치 */
.evStampBody.templete15Days .stamp:nth-child(1) {
    left: 176px;
    top: -50px
}

.evStampBody.templete15Days .stamp:nth-child(2) {
    left: 400px;
    top: 10px
}

.evStampBody.templete15Days .stamp:nth-child(3) {
    left: 660px;
    top: 10px
}

.evStampBody.templete15Days .stamp:nth-child(4) {
    left: 900px;
    top: 10px
}

.evStampBody.templete15Days .stamp:nth-child(5) {
    left: 800px;
    top: 216px
}

.evStampBody.templete15Days .stamp:nth-child(6) {
    left: 500px;
    top: 216px
}

.evStampBody.templete15Days .stamp:nth-child(7) {
    left: 350px;
    top: 216px
}

.evStampBody.templete15Days .stamp:nth-child(8) {
    left: 160px;
    top: 240px
}

.evStampBody.templete15Days .stamp:nth-child(9) {
    left: 200px;
    top: 430px
}

.evStampBody.templete15Days .stamp:nth-child(10) {
    left: 380px;
    top: 430px
}

.evStampBody.templete15Days .stamp:nth-child(11) {
    left: 650px;
    top: 430px
}

.evStampBody.templete15Days .stamp:nth-child(12) {
    left: 900px;
    top: 430px
}

.evStampBody.templete15Days .stamp:nth-child(13) {
    left: 880px;
    top: 640px
}

.evStampBody.templete15Days .stamp:nth-child(14) {
    left: 600px;
    top: 640px
}

.evStampBody.templete15Days .stamp:nth-child(15) {
    left: 420px;
    top: 820px
}

/* 10일 마커 위치 */
.evStampBody.templete10Days .stamp:nth-child(1) {
    left: 176px;
    top: -50px
}

.evStampBody.templete10Days .stamp:nth-child(2) {
    left: 600px;
    top: 10px
}

.evStampBody.templete10Days .stamp:nth-child(3) {
    left: 960px;
    top: 80px
}

.evStampBody.templete10Days .stamp:nth-child(4) {
    left: 800px;
    top: 216px
}

.evStampBody.templete10Days .stamp:nth-child(5) {
    left: 400px;
    top: 216px
}

.evStampBody.templete10Days .stamp:nth-child(6) {
    left: 300px;
    top: 430px
}

.evStampBody.templete10Days .stamp:nth-child(7) {
    left: 700px;
    top: 430px
}

.evStampBody.templete10Days .stamp:nth-child(8) {
    left: 930px;
    top: 640px
}

.evStampBody.templete10Days .stamp:nth-child(9) {
    left: 600px;
    top: 640px
}

.evStampBody.templete10Days .stamp:nth-child(10) {
    left: 420px;
    top: 820px
}

.evSubMenu {
    margin: 40px 0 0 0;
    border-bottom: 1px solid #004f7a
}

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

.evSubMenu li {
    float: left
}

.evSubMenu li a {
    display: block;
    border: 1px solid #e8eaee;
    border-bottom: 0px none;
    height: 40px;
    line-height: 40px;
    padding: 0 30px;
    background: #e8eaee
}

.evSubMenu li.current a {
    border-color: #004f7a;
    background: #004f7a;
    color: #fff
}

.relative {
    position: relative
}

.couponGuide {
    position: absolute;
    top: -6px;
    left: 0;
    color: #999;
    text-align: left;
}

.evFloatBn {
    position: absolute;
    width: 150px;
    height: 150px;
    z-index: 500
}

.evFloatBn .close {
    position: absolute;
    right: 0;
    bottom: 10px;
    width: 15px;
    height: 15px
}

.bankinfo {
    background: #f6f6f6;
    border: 1px solid #eaeaea;
    padding: 30px;
    text-align: center;
    border-top: 0px none
}

.bankinfo span {
    display: inline-block;
    margin-top: 10px
}

.bankinfo span:not(:last-child):after {
    content: "|";
    padding: 0 8px 0 10px;
    color: #ccc
}

.orderFormWrap .bankAccount {
    font-size: 21px;
    margin-top: 8px
}

.error {
    text-align: center;
    padding: 150px 0
}

.error .sorry {
    font-size: 100px;
    color: #dfdfdf;
    font-family: "NanumSquareRound",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    line-height: 100px;
    font-weight: 900
}

.error h3 {
    font-size: 30px;
    font-weight: 200;
    line-height: 34px;
    margin-top: 20px;
    letter-spacing: -2px
}

.error .desp {
    margin-top: 20px;
    font-size: 17px;
    letter-spacing: -0.5px;
    color: #666;
    line-height: 24px;
    font-weight: 200
}

.error .desp strong {
    letter-spacing: 0;
    font-weight: 200
}

.appendBill {
    border-top: 1px solid #d6d6d6;
    border-bottom: 1px solid #d6d6d6;
    position: relative
}

.appendBill h3 {
    position: absolute;
    top: 20px;
    left: 20px;
    font-weight: 500;
    font-size: 16px
}

.appendBill .innerForm {
    margin: 20px 20px 20px 180px
}

.appendBill .innerForm .group {
    margin: 10px 0
}

.appendBill .innerForm .group span {
    display: inline-block;
    margin-right: 20px
}

.appendBill .innerForm .caseCheckYes {
    margin-top: 20px
}

.appendBill .innerForm .caseCheckYes p {
    margin: 10px 0
}

.appendBill .innerForm .caseCheckYes p span {
    display: inline-block;
    width: 200px
}

.remoteGuide {
    border: 1px solid #eaeaea;
    border-top: 2px solid #272c38;
    margin-top: 30px;
    padding-bottom: 80px;
    background: #fff
}

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

.remoteGuide .box {
    float: left;
    width: 33.33%;
    margin-top: 60px
}

.remoteGuide .box .inner {
    padding: 0 50px;
    text-align: center
}

.remoteGuide .box .step {
    font-family: "NanumSquareRound",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 900;
    font-size: 17px;
    display: inline-block;
    margin: 0 auto;
    border-top: 1px solid #e8463e;
    border-bottom: 1px solid #e8463e;
    color: #e8463e;
    padding: 5px 0
}

.remoteGuide .box .desp {
    font-size: 16px;
    font-weight: 300;
    margin: 30px 0 20px 0;
    line-height: 26px;
    word-break: keep-all
}

.remoteGuide .contactinfo {
    margin-top: 20px
}

.remoteGuide .contactinfo strong {
    color: #e8463e;
    font-size: 22px
}

.remoteGuide .contactinfo strong, .remoteGuide .contactinfo span {
    display: inline-block
}

.hasFilesWrap {
    margin-top: 20px
}

.hasFilesWrap p {
    display: block
}

.hasFilesWrap p a {
    display: block;
    padding: 8px 15px;
    background: rgba(255,255,255,0.8);
    border: 1px solid #d8e4e8;
    font-size: 14px;
    color: #797979;
    position: relative;
    margin-top: -1px
}

.hasFilesWrap p a:after {
    content: "";
    position: absolute;
    top: 2px;
    right: 5px;
    width: 36px;
    height: 36px;
    background: url('../img/common/ic_download_bk.png') no-repeat center center / contain;
    opacity: 0.6
}

.hasFilesWrap p:hover a {
    border-color: #d8e4e8;
    background: rgba(0,0,0,0.02);
}

.orderSideinfo {
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    display: inline-block;
    font-size: 15px;
    font-weight: 400;
    margin-left: 10px;
    padding-left: 10px;
    border-left: 1px solid #d6d6d6
}

@media screen and (max-width: 1600px) {
    .scroll .mbMenu {
        top:54px;
        z-index: -10
    }

    /*
        .scroll .mbMenu a { width:60px; background:rgba(39,44,56,0.5); border-radius:500px; margin:5px 0 }
        */
    .scroll .gnb .etcMenu {
        right: 0
    }

    .scroll .gnbMenu {
        right: 120px
    }

    .scroll .mbMenu span {
        background-position: 0 -34px ! important;
        opacity: 0.75
    }

    .mSceenIndicator li .bg {
        height: 40px;
        position: absolute;
        top: 50%;
        margin-top: -20px;
        right: 15px;
        width: 74%;
        z-index: 5;
        border-radius: 500px
    }

    .mSceenIndicator li span {
        z-index: 6
    }

    .mSceenIndicator li.on .bg {
        background-color: rgba(255,255,255,0.5)
    }

    .mSceenIndicator li:nth-child(1).on .bg {
        width: 63%
    }

    .mSceenIndicator li:nth-child(3).on .bg {
        background-color: rgba(0,0,0,0.3);
        width: 54%
    }
}

/* 출석이벤트 (확정버전)*/
.evDetailsStamp {
    margin-top: 30px
}

.evDetailsStamp .head {
    background: url('../img/event/ev_stamp_top2_2020.jpg') no-repeat center top;
    height: 629px;
    padding-top: 15px;
    position: relative
}

.evDetailsStamp .head .evName {
    width: 466px;
    height: 466px;
    display: table;
    margin-left: 230px
}

.evDetailsStamp .head .evName h1 {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    font-family: 'BMDOHYEON', 맑은고딕, serif;
    font-size: 47px;
    line-height: 56px
}

.evDetailsStamp .head .evDesp {
    position: absolute;
    left: 50px;
    bottom: 50px
}

.evDetailsStamp .head .evDesp .date {
    font-family: 'BMDOHYEON', 맑은고딕, serif;
    font-size: 24px;
    color: #1d384f;
    letter-spacing: 4px;
    position: relative;
    height: 30px;
    text-align: left;
    border: 0px none
}

.evDetailsStamp .head .evDesp .date::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 32px;
    height: 2px;
    background: #1d384f
}

.evDetailsStamp .head .evDesp .adText {
    font-size: 24px;
    color: #1d384f;
    margin-top: 30px;
    font-weight: 600
}

.evDetailsStamp .head .evDesp .evNotice {
    font-size: 21px;
    color: #bd8d3b;
    margin-top: 10px;
    font-weight: 300
}

.evDetailsStamp .body {
    background: #d8cccc;
    padding: 60px 0 150px 0
}

.evDetailsStamp .body .inner {
    width: 920px;
    margin: 0 auto;
    position: relative
}

.evDetailsStamp .body .inner::before {
    content: "";
    width: 161px;
    height: 402px;
    background: url('../img/event/coin_side_left.png');
    position: absolute;
    left: -120px;
    bottom: -40px
}

.evDetailsStamp .body .inner::after {
    content: "";
    width: 135px;
    height: 160px;
    background: url('../img/event/coin_side_right.png');
    position: absolute;
    right: -80px;
    bottom: -40px
}

.evDetailsStamp .body .inner ul {
    background: #fff8f7
}

.evDetailsStamp .body .inner ul li {
    width: 50%;
    float: left;
    text-align: center;
    font-size: 26px;
    position: relative;
    height: 120px;
    line-height: 120px;
    color: #1d384f
}

.evDetailsStamp .body .inner ul li:first-child::after {
    content: "";
    width: 2px;
    height: 50px;
    position: absolute;
    top: 35px;
    right: 0;
    background: #ece0de
}

.evDetailsStamp .body .inner ul li strong {
    font-weight: 600;
    color: #1d384f
}

.evDetailsStamp .body .inner ul::after {
    content: "";
    display: block;
    clear: both
}

.evDetailsStamp .body .stampArr {
    background: #ece0de;
    padding: 30px
}

.evDetailsStamp .body .stampArr ol li {
    width: 20%;
    float: left;
    text-align: center;
    margin: 20px 0;
    font-size: 22px;
    color: #5b5b5b;
    font-weight: 600
}

.evDetailsStamp .body .stampArr ol li span {
    display: block;
    margin: 0 auto;
    width: 127px;
    height: 126px;
    background: url('../img/event/ic_stamp.png') no-repeat 0 0;
    margin-bottom: 10px
}

.evDetailsStamp .body .stampArr ol li.done span {
    background-position: 0 -126px
}

.evDetailsStamp .body .stampArr ol::after {
    content: "";
    display: block;
    clear: both
}

.evDetailsStamp .body .regStamp {
    margin-bottom: 20px
}

.evDetailsStamp .body .regStamp a {
    display: block;
    width: 400px;
    height: 80px;
    line-height: 84px;
    border-radius: 500px;
    text-align: center;
    margin: 0 auto;
    background: #1d384f;
    color: #fff;
    font-family: 'BMDOHYEON', 맑은고딕, serif;
    font-size: 28px;
    box-shadow: 1px 1px 1px rgba(255,255,255,0.6)
}

/* 룰렛 공통 스타일 */
.evDetailsRoulette {
    font-family: "NanumSquareRound",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    margin-top: 30px;
    background: url('../img/event/roulette_bg2.png') no-repeat center top;
    height: 850px;
    padding: 43px 0 0 90px;
    position: relative
}

.evDetailsRoulette .adText {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    display: inline-block;
    background: #fff;
    padding: 10px 62px;
    font-size: 24px;
    line-height: 30px;
    color: #f8939c;
    font-weight: 700;
    letter-spacing: 5px
}

.evDetailsRoulette h3 {
    font-family: "Jalnan", "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 700;
    font-size: 102px;
    margin-left: -5px;
    color: #fff;
    line-height: 106px;
    margin-top: 16px;
    text-shadow: 8px 8px 0 rgba(255,144,156,1);
    letter-spacing: 10px
}

.evDetailsRoulette .desp {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 700;
    letter-spacing: 1.5px;
    font-size: 18px;
    color: #fff;
    line-height: 26px;
    margin-top: 30px
}

.evDetailsRoulette .evNotice {
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 700;
    padding-top: 240px;
    color: #db7780;
    font-size: 18px;
    text-align: center;
    max-width: 431px
}

.evDetailsRoulette #gameContainer {
    width: 610px;
    height: 610px;
    text-align: center;
    position: absolute;
    top: 110px;
    right: 50px
}

.evDetailsRoulette #gameContainer .obj {
    position: absolute
}

.evDetailsRoulette #gameContainer .board_start {
    width: 170px;
    height: 170px;
    background: url('../img/event/coupon_button.png') no-repeat center center / contain;
    z-index: 5;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    line-height: 170px;
    color: #fff;
    font-size: 28px;
    font-weight: 900;
    cursor: pointer
}

.evDetailsRoulette #gameContainer .board_bg {
    width: 610px;
    height: 610px;
    z-index: 2;
}

.evDetailsRoulette #gameContainer .board_on {
    width: 610px;
    height: 610px;
    z-index: 3
}

.evDetailsRoulette #gameContainer .obj.board_arrow {
    width: 74px;
    height: auto;
    top: -30px;
    left: 50%;
    transform: translate(-50%);
    z-index: 5;
}

.evDetailsRoulette .board_on div {
    font-weight: 900;
    position: absolute;
    font-size: 26px;
    color: #000;
    width: 110px;
    padding-top: 25px;
    text-align: center
}

.evDetailsRoulette .board_on div:before {
    content: "적립금";
    font-size: 16px;
    font-weight: 700;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    color: #878080
}

.evDetailsRoulette .board_on div:after {
    content: "P"
}

.evDetailsRoulette .board_on div:nth-child(2n):before {
    color: #ff919e ! important
}

.evDetailsRoulette .board_on.cont12 div {
    font-weight: 900;
    position: absolute;
    font-size: 20px;
    color: #000;
    width: 90px;
    padding-top: 20px;
    text-align: center
}

.evDetailsRoulette .board_on.cont12 div:before {
    content: "적립금";
    font-size: 13px;
    font-weight: 700;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    color: #878080
}

/* 텍스트 기준 샘플, 8개 짜리. */
.evDetailsRoulette #gameContainer .board_on.cont8 {
    background: url('../img/event/roulette_circle_bg_8ea.png') no-repeat center center / contain
}

.evDetailsRoulette .board_on.cont8 div:nth-child(1) {
    top: 100px;
    left: 250px
}

.evDetailsRoulette .board_on.cont8 div:nth-child(2) {
    top: 150px;
    right: 120px;
    transform: rotate(45deg)
}

.evDetailsRoulette .board_on.cont8 div:nth-child(3) {
    top: 280px;
    right: 70px;
    transform: rotate(90deg)
}

.evDetailsRoulette .board_on.cont8 div:nth-child(4) {
    bottom: 150px;
    right: 120px;
    transform: rotate(135deg)
}

.evDetailsRoulette .board_on.cont8 div:nth-child(5) {
    bottom: 100px;
    left: 250px;
    transform: rotate(180deg)
}

.evDetailsRoulette .board_on.cont8 div:nth-child(6) {
    bottom: 150px;
    left: 120px;
    transform: rotate(-135deg)
}

.evDetailsRoulette .board_on.cont8 div:nth-child(7) {
    top: 280px;
    left: 70px;
    transform: rotate(-90deg)
}

.evDetailsRoulette .board_on.cont8 div:nth-child(8) {
    top: 150px;
    left: 120px;
    transform: rotate(-45deg)
}

/* 텍스트 기준 샘플, 12개 짜리. */
.evDetailsRoulette #gameContainer .board_on.cont12 {
    background: url('../img/event/roulette_circle_bg_12ea.png') no-repeat center center / contain
}

.evDetailsRoulette .board_on.cont12 div:nth-child(1) {
    top: 110px;
    left: 260px;
    transform: rotate(0deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(2) {
    top: 130px;
    right: 170px;
    transform: rotate(30deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(3) {
    top: 195px;
    right: 100px;
    transform: rotate(60deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(4) {
    top: 285px;
    right: 75px;
    transform: rotate(90deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(5) {
    bottom: 195px;
    right: 100px;
    transform: rotate(120deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(6) {
    bottom: 130px;
    right: 170px;
    transform: rotate(150deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(7) {
    bottom: 110px;
    left: 260px;
    transform: rotate(180deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(8) {
    bottom: 130px;
    left: 170px;
    transform: rotate(-150deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(9) {
    bottom: 195px;
    left: 100px;
    transform: rotate(-120deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(10) {
    top: 285px;
    left: 75px;
    transform: rotate(-90deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(11) {
    top: 195px;
    left: 100px;
    transform: rotate(-60deg)
}

.evDetailsRoulette .board_on.cont12 div:nth-child(12) {
    top: 130px;
    left: 170px;
    transform: rotate(-30deg)
}

/* 다운로드 버튼 (툴팁 추가 */
.withTooltipBtn.inLineBtn {
    display: inline-block;
    position: relative;
    vertical-align: top
}

.withTooltipBtn.inLineBtn .infoTooltip {
    display: none;
    position: absolute;
    top: 46px;
    left: 0;
    z-index: 10;
    font-size: 13px;
    background: rgba(0,0,0,0.7);
    color: #fff;
    padding: 10px;
    font-weight: 300;
    width: 200%;
    word-break: keep-all
}

.withTooltipBtn.inLineBtn .infoTooltip li {
    position: relative;
    padding-left: 10px;
    line-height: 18px;
    margin: 6px 0
}

.withTooltipBtn.inLineBtn .infoTooltip li:before {
    content: "-";
    position: absolute;
    left: 0
}

.withTooltipBtn.inLineBtn .infoTooltip h4 {
    color: #fff;
    font-size: 15px;
    font-weight: 600
}

.withTooltipBtn.inLineBtn:hover .infoTooltip {
    display: block
}

/* 장바구니 담긴 상품 없음 */
.noitemWrap {
    text-align: center;
    border: 1px solid #eaeaea;
    border-top: 0px none;
    padding: 60px 0
}

.noitemWrap p::before {
    content: "";
    background: url('../img/common/icon_warning_red.png') no-repeat left center / contain;
    padding-left: 30px
}

/* 2020-02-12 데이터 없음 공통 */
.noitemWrap.onlyTxt {
    border: 0px none ! important;
    width: 100%
}

.myMakeList td .ellipsis {
    max-width: 400px
}

.clmTh {
    width: 250px
}

.myOrderSumm .txt_red {
    color: #ff2020 ! important
}

/* 교재 상세 자료 다운로드영역 툴팁 스타일 */
.mvTooltip {
    position: relative
}

.mvTooltip em {
    display: none;
    background: rgba(255,255,255,0.95);
    padding: 5px 10px;
    color: #797979;
    font-size: 13px;
    line-height: 18px;
    font-weight: 300;
    max-width: 200px;
    border: 1px solid rgba(0,0,0,0.15);
    word-break: keep-all;
    z-index: 10;
}

.mvTooltip:hover em {
    display: block;
    position: fixed;
    overflow: hidden;
}

/* 주문 화면 배송요청 사항 수정 2019-12-12 */
.infoEditWrap .innerForm .group > div {
    position: relative
}

.myMemo {
    position: absolute;
    top: -1px;
    left: 2px;
    bottom: 0;
    width: 700px
}

.myMemo input {
    width: 100%;
    height: 46px;
    border: 0px none
}

.sel_wrap.datalist .selectric-wrapper {
    width: 750px ! important
}

.paymentAlert {
    position: absolute;
    top: -6px;
    right: 0;
    background: url('../img/common/icon_warning_red.png') no-repeat left center / contain;
    padding-left: 30px;
    color: #797979
}

.paymentAlert + .btn {
    margin-top: 30px
}

/* 검색 도움말 2019-12-19 */
.addedinfoTxt {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 190px;
}

.addedinfoTxt em {
    display: block;
    width: 60px;
    height: 100%;
    background: url('../img/common/icon_warning_wh.png') no-repeat center center / 25px auto #495164;
    text-indent: -9999px;
    cursor: pointer
}

.addedinfoTxt .infoTxt {
    display: none;
    width: 250px;
    position: absolute;
    top: -150px;
    right: -90px;
    background: #fff;
    border: 1px solid #d6d6d6;
    padding: 10px;
    font-size: 13px;
    line-height: 18px;
    font-weight: 300;
    color: #666;
    z-index: 500;
    border-radius: 6px;
    box-shadow: 0 0 5px rgba(0,0,0,0.08)
}

.addedinfoTxt + input[type=submit] {
    right: 250px ! important
}

.addedinfoTxt:hover .infoTxt {
    display: block
}

.addedinfoTxt .infoTxt:after {
    content: "";
    position: absolute;
    right: 110px;
    bottom: -11px;
    background: url('../img/common/tooltip_arrow.png');
    width: 18px;
    height: 11px;
    transform: rotate(-180deg)
}

/* 교재 상세 - 딱지 추가 */
.hasDeduction {
    vertical-align: top;
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 400;
    padding: 0 15px;
    border: 1px solid #ccc;
    color: #797979;
    border-radius: 500px;
    height: 28px;
    line-height: 24px;
    margin-left: 4px
}

.trendList td:nth-child(2) {
    width: 260px
}

.trendList td:nth-child(3) {
    width: 56%
}

.repTip {
    background: url('../img/common/icon_warning.png') no-repeat left center;
    font-size: 13px;
    color: #797979;
    padding-left: 20px;
    margin-top: 5px
}

/* 파일첨부 영역 스타일 : 아래로 위치 변경 */
.postFiles .group {
    padding: 8px 20px
}

.postFiles .group div.actThis {
    position: absolute;
    top: 3px;
    right: 15px
}

.postFiles .group .actThis a {
    display: inline-block;
    width: 40px;
    overflow: hidden;
    height: 30px;
    line-height: 30px
}

.postFiles .group .actThis a img {
    max-height: 100%
}

.postFiles .group .actThis a.deleteThisitem img {
    transform: rotate(-45deg)
}

/* 모바일에 동일한 마크업을 사용하면서 pc버전에만 추가된 스타일 */
.ctrlMyStat.ForMobile {
    display: none ! important
}

.finOrderitem th:nth-child(1), .finOrderitem th:nth-child(2), .finOrderitem td:nth-child(1), .finOrderitem td:nth-child(2) {
    display: none
}

.donwAlertM {
    display: none
}

.certiinfoM {
    display: none
}

.mboardA.bbL tbody td.mobileBtnSet, .latestViewitem td.mobileBtnSet, .dataDownloadBoard .listTypeA tbody td.mobileBtnSet {
    display: none
}

.swiper-button-next {
    display: none;
}

/* PC 환경에서 일부 요소 bxslider로 사용하기 위함 */
.swiper-button-prev {
    display: none;
}

/* PC 환경에서 일부 요소 bxslider로 사용하기 위함 */
/* 2020-01-30 회원가입 > 동의항목 안내문구 스타일 교정 */
.mkAgree .benefitTxt {
    color: #999;
    display: inline-block;
    margin-left: 8px
}

/* 2020-03-09 팝업 레이어 */
.popupLayerWrap {
    position: fixed;
    z-index: 9999;
    box-shadow: 0 0 7px rgba(0,0,0,0.23);
    width: 400px;
    left: 50%;
    top: 180px;
    transform: translate(-50%)
}

.popupLayerWrap .popupBody {
    height: 400px;
    overflow: auto
}

.popupLayerWrap .popupBody img {
    max-width: 100%;
    height: auto;
    cursor: pointer
}

.popupFooter {
    background: #fff;
    padding: 5px 10px;
    position: relative;
    font-size: 13px
}

.popupFooter input {
    vertical-align: -2px;
    margin-right: 4px
}

.popupFooter span:last-child {
    position: absolute;
    top: 0;
    right: 0
}

.popupFooter #popClose {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 32px
}

.popupFooter em {
    position: absolute;
    top: 50%;
    left: 22%;
    display: block;
    width: 15px;
    height: 1px;
    background: #666;
    transform: rotate(-45deg)
}

.popupFooter em:last-child {
    transform: rotate(45deg)
}

/* 2020-03-12 플로팅배너 */
.positionWrap {
    position: relative;
    max-width: 1280px;
    margin: 0 auto;
    height: 0px
}

.cmFloatBn {
    position: absolute;
    top: 180px;
    right: -250px;
    z-index: 50;
    width: 230px;
    height: 250px
}

.cmFloatBn .inner {
    position: fixed
}

.cmFloatBn .content img {
    max-width: fit-content
}

.cmFloatBn .close {
    position: absolute;
    top: 0;
    right: 0;
    border: 1px solid #e3e3e3;
    border-radius: 50px;
    width: 30px;
    height: 30px;
    line-height: 24px;
    text-align: center;
    background: #fff
}

.cmFloatBn .close img {
    width: 12px;
    height: auto
}

.main .cmFloatBn {
    top: 100px;
    /* right: -140px */
    right: 0;
}

.positioningWrap {
    position: relative;
    height: 0px
}

/* 2020-08-20 검색결과 시리즈목록*/
ul.seriesCont {
    max-height: unset;
}

ul.seriesCont.collapse {
    max-height: 108px;
    overflow: hidden
}

.seriesViewMore {
    max-width: 1280px;
    margin: 0 auto;
    position: relative;
    margin-top: 10px;
}

.seriesViewMore a {
    width: 100%;
    height: 100%;
    text-align: center;
    border: solid 1px #666666;
    border-radius: 15px;
}

.seriesViewMore a:hover {
    box-shadow: unset !important;
    transition: unset !important;
}

/* 2020-10-12 사은품몰 > 교사용 교재 신청 > 잔여수량 눈에 띄도록 */
.giftMall .itemListA.arrGallery .article .etc span:nth-child(1) strong {
    color: #e8563e;
}

.giftMall .itemListA.arrGallery .article .etc span:nth-child(2) strong {
    color: #2c93e8;
}

.giftMall .itemListA.arrGallery .article .etc span.strong {
    font-family: 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-size: 0.95rem;
    line-height: 1.1rem;
    font-weight: 500;
    color: #272c38
}

.giftMall .itemListA.arrGallery .article .etc span.strong strong {
    color: white;
    background-color: #e8463e;
    border-radius: 4px;
    padding: 0 4px;
    font-weight: 500;
    font-size: 0.9rem;
}

/* 2020-11-11 이벤트 댓글 첨부파일 */
.commentAttachmentCont {
    margin-top: 5px
}

.commentAttachmentCont .addedinfo {
    font-size: 0.85rem;
    line-height: 1.2rem;
    margin-top: 5px;
    color: #777;
    margin-left: 10px;
}

.commentAttachmentCont .postFiles .group {
    width: 100%;
}

.commentAttachmentCont div.fileNameCont {
    display: inline-block
}

.attachmentCont {
    margin-top: 10px;
    margin-left: 10px;
    margin-bottom: 15px;
    border-left: 1px solid #ebebeb;
    padding-left: 4px;
}

.attachmentCont a {
    border-radius: 2px;
    background-color: #e1e1e1;
    padding: 8px;
    color: #666;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.attachmentCont li:not(.disabled) a:hover {
    background-color: #d1d1d1
}

.attachmentCont li.disabled a {
    background-color: #f1f1f1;
    pointer-events: none
}

/*.attachmentCont a:not(:first-child) { margin-top: 20px};*/
.attachmentCont li {
    line-height: 38px
}

.attachmentCont li:not(:first-child) {
    margin-top: 10px
}

.attachmentCont li.disabled span.icDownLoad {
    display: none
}

.attachmentCont li:not(.disabled) span.icDownLoad {
    display: inline-block;
    vertical-align: -6px;
    margin-left: 10px;
    width: 24px;
    height: 24px;
    background: url('../img/common/ic_download_bk.png') no-repeat center center;
    background-size: 36px
}

.editForm + .commentAttachmentCont {
    display: none;
}

.commentAttachmentCont.editForm {
    margin-bottom: 15px
}

/* 2020-12-18 이용약관/개인정보처리방침 강조 스타일 추가 */
.highlight {
    color: #2651b4 !important;
}

/* 2021-01-27 휴면 계정 복구 팝업 스타일 추가 */
.restUserRestoreModal {
    width: 860px;
    margin: 0 auto;
    background: #fff;
}

.restUserRestoreModal .alertTxt {
    font-size: 21px;
    line-height: 28px;
    font-weight: 500;
    text-align: center
}

.restUserRestoreModal .alertTxt span {
    display: block;
    font-weight: 300;
    font-size: 14px
}

.restUserRestoreModal .modalBody {
    margin: 0;
}

.restUserRestoreModal .infoEditWrap {
    width: 100%;
}

.restUserRestoreModal .selectCerti ul li.disabled a {
    color: #999999;
}

.restUserRestoreModal .selectCerti ul li a {
    height: 80px;
}

.restUserRestoreModal .selectCerti ul li a p {
    line-height: 22px;
}

.restUserRestoreModal .input_phone_no {
    width: 200px;
}

/* 2021-03-24 미리보기 아이콘 비활성화*/
.btnDisabled {
    opacity: 0.3;
    cursor: default;
}

/* 2021-03-30 토익 구매처 가이드 */
.toeicGuidance {
    border: 1px solid #e1e1e1;
    border-top: 2px solid #e8463e;
    height: 490px;
    width: 100%;
    display: table;
}

.toeicGuidance .inner {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.toeicGuidance .inner .message {
    font-size: 1.3rem;
    display: inline-block;
}

.toeicGuidance .inner a {
    font-size: 1.3rem;
    margin-top: 50px;
    display: inline-block;
    padding: 20px 20px;
    border: solid 1px #e1e1e1;
    border-radius: 8px;
}

/* 2021-04-02 구매버튼 직접입력 + 링크 없는 경우 추가 */
.buyBtnNmWithNoLink {
    display: inline-block;
    height: 48px;
    line-height: 48px;
    font-size: 1.4rem;
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: -webkit-calc(100% - 72px);
    max-width: calc(100% - 72px);
    max-width: -moz-calc(100% - 72px);
    padding: 0 20px;
}

.customBtn .buyBtnNmWithNoLink {
    padding-left: 0px;
}

.customBtn a, .itemListA.arrGallery .ctrlUser .customBtn a {
    background: #e9463f;
    font-family: "NanumSquare",'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    display: inline-block;
    vertical-align: top;
    font-size: 1.1rem;
    height: 48px;
    line-height: 48px;
    padding: 0 30px;
    margin: 10px 0;
    color: #fff;
    font-weight: 700;
    position: relative;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.itemListA:not(.arrGallery) .ctrlUser .customBtn {
    display: none;
}

.itemListA.arrGallery .itemPrice .customBtn {
    display: none;
}

.itemListA.arrGallery .itemPrice .salePrice strong {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.itemListA.arrGallery .ctrlUser {
    height: 50px;
}

.itemListA.arrGallery .ctrlUser .customBtn {
    display: inline-block;
    position: relative;
    width: calc(68.5% - 8px);
    width: -webkit-calc(68.5% - 8px);
    width: -moz-calc(68.5% - 8px);
}

.itemListA.arrGallery .ctrlUser .customBtn .buyBtnNmWithNoLink {
    padding-left: 10px;
    padding-right: 0;
    max-width: 100%;
}

.itemListA.arrGallery .ctrlUser .customBtn a {
    margin : 0;
    height: 50px;
    width: unset;
}

/* 2021-04-13 온라인 수업자료 */
.onlineClass .depthCategorySet {
    padding: 20px 0;
}

.onlineClass .depthCategorySet .title {
    display: none;
}

.onlineClass .seriesImageCont {
    width: 1280px;
    position: relative;
    border: solid 1px #dcdcdc
}

.onlineClass .seriesImageCont img {
    width: 100%;
    height: auto;
}

.onlineClass .brochureCont {
    position: relative;
    height: 40px;
    line-height: 40px;
    text-align: right;
    margin-top: 20px;
    padding-right: 20px;
}

.onlineClass .brochureCont > button {
    height: 40px;
    padding: 0 15px;
    font-size: 1.0rem;
    line-height: 40px;
    margin-left: 15px;
    background: #ffffff;
    border: solid 1px #666666;
    border-radius: 3px;
    position: relative;
    transition: all 0.1s;
}

.onlineClass .brochureCont > button:hover {
    color: #FFFFFF;
    background: #2c2c2c;
    transition: all 0.1s;
}

.onlineClass .prdSwiperTitleCont {
    margin-top: 20px;
    position: relative;
    font-size: 1.5rem;
    padding-left: 40px;
    margin-left: 20px;
    height: 30px;
    line-height: 30px;
}

.onlineClass .prdSwiperTitleCont:before {
    content: '';
    width: 30px;
    height: 30px;
    background: url(../img/common/icon_34_book.png) no-repeat center center;
    position: absolute;
    left: 0;
}

/* 교재(책) 아이콘 제작 및 교체 필요. */
.onlineClass .prdSwiperCont {
    width: 1280px;
    height: auto;
    padding: 30px 0;
    position: relative;
    border: solid 1px #dcdcdc;
    margin-top: 20px;
    text-align: center
}

.onlineClass .prdSwiperCont .swiper-slide {
    position: relative;
    height: 340px;
}

.onlineClass .prdSwiperCont .swiper-slide .group {
    position: relative;
    width: 100%;
    padding: 12px 8px 8px 8px;
    display: inline-block;
    transform: scale(0.9);
    max-height: 95%;
}

.onlineClass .prdSwiperCont .swiper-slide.active .group {
    transform: scale(1.0);
    transition: all 0.3s;
    transition-property: box-shadow, transform
}

.onlineClass .prdSwiperCont .swiper-slide .group .contents {
    border: 1px solid #dcdcdc;
    position: relative;
}

.onlineClass .prdSwiperCont .swiper-slide.active .group .contents {
    box-shadow: 8px 8px 2px 0px #00000033;
}

.onlineClass .prdSwiperCont .swiper-slide .group img {
    margin-bottom: 10px;
}

.onlineClass .prdSwiperCont .swiper-slide .group .prdNm {
    overflow: hidden;
    height: 54px;
    text-overflow: ellipsis;
    padding: 0 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
    line-height: 18px
}

.onlineClass .prdSwiperCont .swiper-slide .group .sampleTag {
    position: absolute;
    top: 0;
    background: #6565ff;
    color: #FFF;
    padding: 6px 12px;
    box-shadow: rgba(0, 0, 0, 0.5) 3px 3px 5px;
    transform: translate(-7px, 0px);
    font-size: 1.2rem;
}

.onlineClass .prdSwiperCont .swiper-slide .group .disableCover {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.1);
    vertical-align: middle;
}

.onlineClass .prdSwiperCont .swiper-slide .group .disableCover div {
    position: relative;
    top: 128px;
    color: #FFF;
    text-shadow: 1px 1px 5px #000;
}

.onlineClass .prdSwiperCont .swiper-container {
    width: 1080px;
    height: 100%;
    display: inline-block;
}

.onlineClass .prdSwiperCont .swiper-button-prev {
    width: 100px;
    display: inline-block;
    outline: none;
    background: url('../img/common/icon_back.png') no-repeat center center / 30px;
    left: 0;
}

/* 좌향 아이콘 제작 및 교체 필요 */
.onlineClass .prdSwiperCont .swiper-button-prev:after {
    content: ''
}

.onlineClass .prdSwiperCont .swiper-button-next {
    width: 100px;
    display: inline-block;
    outline: none;
    background: url('../img/common/icon_forward.png') no-repeat center center / 30px;
    right: 0;
}

/* 우향 아이콘 제작 및 교체 필요 */
.onlineClass .prdSwiperCont .swiper-button-next:after {
    content: ''
}

/*.onlineClass .prdSwiperCont .swiper-scrollbar {z-index: 200}*/
.onlineClass .onlineClassCont {
    position: relative;
    margin-top: 30px;
}

.onlineClass .onlineClassCont .prdTitle {
    margin-top: 20px;
    position: relative;
    font-size: 1.5rem;
    padding-left: 40px;
    margin-left: 20px;
    /*height: 30px;*/
    line-height: 30px;
}

.onlineClass .onlineClassCont .prdTitle:before {
    content: '';
    width: 30px;
    height: 30px;
    background: url(../img/common/icon_34_oline.png) no-repeat center center;
    position: absolute;
    left: 0;
}

/* 교재(책) 아이콘 제작 및 교체 필요. */
.onlineClass .onlineClassCont .tabCont {
    width: 100%;
    height: 60px;
    overflow: hidden;
    margin-top: 30px;
    box-shadow: 0px -1px 0px 0px #999 inset;
}

.onlineClass .onlineClassCont .tabCont ul {
    padding: 0;
    margin: 0;
    list-style: none;
    width: 100%;
    height: auto;
    overflow: hidden;
}

.onlineClass .onlineClassCont .tabCont ul li {
    display: inline-block;
    width: 50%;
    height: 60px;
    float: left;
    line-height: 60px;
    text-align: center;
    cursor: pointer;
    font-size: 1.2rem;
    position: relative;
}

.onlineClass .onlineClassCont .tabCont ul li.full {
    width: 100%
}

.onlineClass .onlineClassCont .tabCont ul li.active {
    font-weight: bold;
}

.onlineClass .onlineClassCont .tabCont ul li.active:after {
    content: '';
    width: 50%;
    position: absolute;
    bottom: 0;
    left: 25%;
    background: #6565ff;
    height: 3px;
}

.onlineClass .onlineClassCont .cont {
    display: none;
    position: relative;
    width: 100%;
    margin-top: 15px;
    border: solid 1px #dcdcdc;
    padding: 20px 20px;
}

.onlineClass .onlineClassCont .cont.active {
    display: block
}

.onlineClass .onlineClassCont .cont .btnCont {
    position: relative;
    text-align: right;
}

.onlineClass .onlineClassCont .cont .btnCont button {
    height: 40px;
    padding: 0 15px 0 40px;
    font-size: 1.0rem;
    line-height: 40px;
    margin-left: 15px;
    background: #ffffff;
    border: solid 1px #666666;
    border-radius: 3px;
    position: relative;
    transition: all 0.1s;
}

.onlineClass .onlineClassCont .cont .btnCont button:hover {
    color: #FFFFFF;
    background: #2c2c2c;
    transition: all 0.1s;
}

.onlineClass .onlineClassCont .cont .btnCont button.btnList:before {
    content: '';
    width: 30px;
    height: 30px;
    background: url(../img/common/icon_20_box_nor.png) no-repeat center center;
    position: absolute;
    left: 10px;
    top: 4px;
    transition: all 0.1s;
}

/* 다운로드 아이콘 제작 및 교체 필요. hover시 흰색 */
.onlineClass .onlineClassCont .cont .btnCont button.btnList:hover:before {
    background: url(../img/common/icon_20_box_hover.png) no-repeat center center;
    transition: all 0.1s;
}

.onlineClass .onlineClassCont .cont .btnCont button.btnDetail:before {
    content: '';
    width: 30px;
    height: 30px;
    background: url(../img/common/icon_20_detail_nor.png) no-repeat center center;
    position: absolute;
    left: 10px;
    top: 4px;
    transition: all 0.1s;
}

/* 펼친 책 아이콘 제작 및 교체 필요. hover시 흰색*/
.onlineClass .onlineClassCont .cont .btnCont button.btnDetail:hover:before {
    background: url(../img/common/icon_20_detail_hover.png) no-repeat center center;
    transition: all 0.1s;
}

.onlineClass .onlineClassCont .cont .btnCont button.btnZipDown:before {
    content: '';
    width: 30px;
    height: 30px;
    background: url(../img/common/icon_20_down_nor.png) no-repeat center center;
    position: absolute;
    left: 10px;
    top: 4px;
    transition: all 0.1s;
}

/* 다운로드 아이콘 제작 및 교체 필요. hover시 흰색 */
.onlineClass .onlineClassCont .cont .btnCont button.btnZipDown:hover:before {
    background: url(../img/common/icon_20_down_hover.png) no-repeat center center;
    transition: all 0.1s;
}

.onlineClass .onlineClassCont .cont .contents {
    margin-top: 20px;
    list-style-type: none;
}

.onlineClass .onlineClassCont .cont .contents li {
    position: relative;
    width: 100%;
    border-bottom: solid 1px #dcdcdc;
}

.onlineClass .onlineClassCont .cont .contents li div.liCont {
    padding: 15px 0 15px 0;
    display: flex;
    align-items: center;
    gap: 8px;
    position: relative;
}

.onlineClass .onlineClassCont .cont .contents li div.title {
    position: relative;
    display: inline-block;
    max-width: calc(100% - 230px);
    color: #000000;
    font-size: 20px;
    line-height: 38px;
    padding-left: 20px;
}

.onlineClass .onlineClassCont .cont .contents li a.link {
    position: relative;
    display: inline-block;
    padding: 7px 10px;
    color: #000000;
    font-size: 16px;
    border: solid 1px #bababa;
    border-radius: 4px;
    float: right;
}

.onlineClass .onlineClassCont .cont .contents li.handle > div.liCont {
    cursor: pointer;
}

.onlineClass .onlineClassCont .cont .contents li:not(.handle) > div.liCont {
    cursor: unset;
}

.onlineClass .onlineClassCont .cont .contents li.handle:after {
    content: '';
    position: absolute;
    background: url(../img/common/arrow_toggle.png) no-repeat center center / contain;
    width: 12px;
    height: 7px;
    top: 32px;
    right: 20px;
    transform: rotate(-180deg);
    transition: all .3s ease
}

.onlineClass .onlineClassCont .cont .contents li.handle.opened {
    padding-bottom: 0;
    border-bottom: unset;
}

.onlineClass .onlineClassCont .cont .contents li.handle.opened > div.liCont {
    background: #f1f1f1
}

.onlineClass .onlineClassCont .cont .contents li.handle.opened:after {
    transform: rotate(-360deg);
}

.onlineClass .onlineClassCont .cont .contents li.handle.opened > ul {
    display: block;
    height: unset;
    border-top: solid 1px #dcdcdc;
}

.onlineClass .onlineClassCont .cont .contents li.handle:not(.opened) > ul {
    display: none;
    height: 0;
    transition: all .3s ease
}

.onlineClass .onlineClassCont .cont .contents li.handle > div.liCont > a.link {
    display: none;
}

.onlineClass .onlineClassCont .cont .contents li > ul {
    padding-left: 30px;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li.handle > div.liCont > button.controlMp3Btn {
    display: none;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li.handle > div.liCont > .btnTitle {
    display: none;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont {
    padding-left: 20px;
    padding-right: 20px;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > div.title {
    display: none;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.audioProgress {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn {
    line-height: 40px;
    font-size: 20px;
    color: #000000;
    position: relative;
    display: inline-block;
    width: 40px;
    height: 40px;
    padding: 0;
    vertical-align: top;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn.stopMp3Btn {
    /* margin-left: 5px; */
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    position: relative;
    border-radius: 40px;
    transition: 100ms all ease
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon > .circle {
    left: 2px;
    top: 2px;
    right: 2px;
    bottom: 2px;
    position: absolute;
    border: solid 2px #000000;
    border-radius: 38px;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon > .hole {
    position: absolute;
    left: 0;
    top: 0 ;
    right: 0;
    bottom: 0;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon > .hole:before {
    content: '';
    position: absolute;
    right: 0;
    width: 4px;
    height: 4px;
    background: #FFFFFF;
    top: 18px;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon.play > .symbol {
    position: absolute;
    left: 16px;
    top: 14px;
    width: 12px;
    height: 12px;
    border-style: solid;
    border-width: 6px 0px 6px 12px;
    border-color: transparent transparent transparent #000000;
    box-sizing: border-box;
    transition: 200ms all ease
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon.play.paused > .symbol {
    border-color: transparent transparent transparent #6565ff;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon.play.paused > .circle {
    border-color: #6565ff;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon.pause > .symbol {
    position: absolute;
    left: 16px;
    top: 14px;
    width: 8px;
    height: 12px;
    border-style: solid;
    border-width: 0 3px 0 3px;
    border-color: #FFFFFF;
    transition: 200ms all ease
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon.stop > .symbol {
    position: absolute;
    left: 14px;
    top: 14px;
    width: 12px;
    height: 12px;
    background: #000000
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon.pause {
    background: #6565FF;
    transition: 100ms all ease
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon.pause > .circle {
    border-color: #FFFFFF;
    transition: 100ms all ease
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn > .icon.pause > .hole {
    -webkit-animation: rotating 2s linear infinite;
    -moz-animation: rotating 2s linear infinite;
    -ms-animation: rotating 2s linear infinite;
    -o-animation: rotating 2s linear infinite;
    animation: rotating 2s linear infinite;
    transition: 100ms all ease
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn:disabled {
    pointer-events: none;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn:disabled > .icon.stop {
    background: #FFFFFF;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn:disabled > .icon.stop > .circle {
    border-color: #acacac;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.controlMp3Btn:disabled > .icon.stop > .symbol {
    background: #acacac;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > div.btnTitle {
    display: inline-block;
    position: relative;
    height: 40px;
    line-height: 40px;
    font-size: 20px;
    margin-left: 4px;
    font-weight: 500;
}

.onlineClass .onlineClassCont .cont.mp3:not(.full) .btnCont > .btnList {
    display: none;
}

.onlineClass .onlineClassCont .cont.mp3:not(.full) .btnCont > .btnDetail {
    display: none;
}

.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont .slide-bar{
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100%;
    height: 6px;
    background-color: #6565ff;
    border: 0;
    cursor: pointer;
}
.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont .slide-bar .ui-slider-handle{
    display: block;
    width: 15px;
    height: 15px;
    border-radius: 100%;
    background-color: #E8463E;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}


/* 20230830 E-BOOK 전소영 */
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox {
    margin-left: auto;
    display: flex;
    gap: 24px;
}

.onlineClass .onlineClassCont .cont .contents li.handle > div.liCont > .btnBox {
    padding-right: 50px;
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns {
    height: 40px;
    padding: 0 15px 0 40px;
    font-size: 1.0rem;
    line-height: 38px;
    background: #ffffff;
    border: solid 1px #666666;
    border-radius: 3px;
    position: relative;
    transition: all 0.1s;
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns.make {
    background-color: #2651B4;
    color: #fff;
    border-color: transparent;
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns:hover {
    background-color: #000;
    color: #fff;
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns.make:hover {
    background-color: #17316c;
    color: #fff;
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns::before {
    content: '';
    width: 30px;
    height: 30px;    
    position: absolute;
    left: 10px;
    top: 4px;
    transition: all 0.1s;
    background-position: center;
    background-repeat: no-repeat;
    transition: 0.2s all;
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns.mp3::before{
    background-image: url(../img/common/ic_play.svg);
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns.ebook::before{
    background-image: url(../img/common/ic_ebook.svg);
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns.make::before{
    background-image: url(../img/common/ic_pen.svg);
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns.movie::before{
    background-image: url(../img/common/icon_shortcut.png);
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns:hover::before {
    filter: brightness(0) invert(1);
}
.onlineClass .onlineClassCont .cont .contents li > div.liCont .btnBox .btns.make:hover {
    filter: none;
}

/* 20230830 E-BOOK 시리즈가 없을때 */
.prdContainWrap .noneContsBox { min-height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15px; border: solid 1px #dcdcdc; box-shadow: 0 0 8px 0 rgba(0,0,0,10%);}
.prdContainWrap .noneContsBox .desc { font-size: 1.3rem; }
.prdContainWrap .noneContsBox .desc span { color: #E8463E;}
.prdContainWrap .noneContsBox .danger { background: url(../img/common/ic_danger_sign.svg) no-repeat center/ contain; width: 36px; height: 36px;} 

/*.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.playMp3Btn > .icon.play:hover > .circle {border-color: #6565ff;}*/
/*.onlineClass .onlineClassCont .cont.mp3 .contents li:not(.handle) > div.liCont > button.playMp3Btn > .icon.play:hover > .symbol {border-color: transparent transparent transparent #6565ff;}*/
.rtSection ul li.onlineClass a {
    background: #6565ff;
    border: 1px solid #6565ff;
}

/* 2021-04-29 1회성 이벤트 기믹 추가 (교재 선택) */
img.selectPrdData {
    display: none;
}

div#selectPrdCont {
    position: relative;
    text-align: center;
    padding: 40px 0;
    border-bottom: 1px solid #e1e1e1;
}

div#selectPrdCont div.group {
    position: relative;
    display: inline-block;
    width: 19%;
    height: auto;
    padding: 10px 20px;
}

div#selectPrdCont div.group:nth-child(n+6) {
    margin-top: 30px;
}

div#selectPrdCont div.group label {
    margin: 20px 0;
    word-break: keep-all;
    text-align: left;
}

div#selectPrdCont div.group img {
    padding: 0 20px;
}

.hwt-container {
    position: relative;
    height: 100%;
}

.hwt-backdrop {
    position: absolute;
    pointer-events: none;
    width: 100%;
    height: 100%;
}

.hwt-backdrop .hwt-content {
    color: transparent;
    white-space: pre-wrap;
    overflow: hidden;
    width: 100%;
    height: 100%;
    word-break: break-all;
}

.hwt-backdrop .hwt-content mark {
    font-weight: inherit;
    background: #ffb441;
    border-radius: 4px;
    color: #272c38;
}

.reviewList mark.tagPrdNm {
    color: #272c38;
    background: #ffb441;
    font-weight: inherit;
    border-radius: 4px;
}

.regReview .textarea textarea {
    word-break: break-all;
}

@-webkit-keyframes rotating /* Safari and Chrome */
{
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotating {
    from {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.rotating {
    -webkit-animation: rotating 2s linear infinite;
    -moz-animation: rotating 2s linear infinite;
    -ms-animation: rotating 2s linear infinite;
    -o-animation: rotating 2s linear infinite;
    animation: rotating 2s linear infinite;
}

/* 2021-06-07 교사용 교재 할인 이벤트 */
.regularPrice {
    position: relative;
    color: rgba(39,44,56,0.5);
}

.regularPrice .evtPrice {
    display: inline-block;
    line-height: 20px;
    color: #272c38;
    padding-left: 15px;
    vertical-align: top;
}

.regularPrice .evtPrice::before {
    content: '';
    position: absolute;
    left: -2px;
    width: 65px;
    height: 20px;
    background: url(../img/common/arr-price.png) no-repeat left 100% top 50%;
}

.regularPrice .evtPrice .strong {
    display: inline-block;
    line-height: 20px;
    color: #fff;
    background-color: #e8463e;
    border-radius: 4px;
    padding: 0 4px;
    font-weight: 500;
    font-size: 12px;
    vertical-align: top;
}

/* 2022-07-01 마케팅 동의 팝업 */
.agreeModal {
    width: 630px;
    margin: 0 auto;
    background: #fff;
}

.agreeModal .modalBody {
    padding: 50px 40px 60px;
}

.agreeModal .tit_agree {
    line-height: 40px;
    font-size: 22px;
    font-weight: 700;
    color: #e54944;
    text-align: center;
    white-space: nowrap;
}

.agreeModal .tit_agree:before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 40px;
    background: url(../img/common/qmark_left.png) no-repeat 0 10px;
    vertical-align: top;
}

.agreeModal .tit_agree:after {
    content: '';
    display: inline-block;
    width: 20px;
    height: 40px;
    background: url(../img/common/qmark_right.png) no-repeat 99% 10px;
    vertical-align: top;
}

.agreeModal .textarea {
    border: 1px solid #cccccc;
    border-radius: 6px;
    background-color: #f6f6f6;
    margin-top: 30px;
    padding: 20px 30px;
    counter-reset: myCounter;
}

.agreeModal .textarea .sub-tit {
    display: block;
    line-height: 32px;
    font-weight: 500;
    font-size: 16px;
    margin-bottom: 10px;
}

.agreeModal .textarea li {
    line-height: 20px;
    font-weight: 300;
    font-size: 16px;
    margin-bottom: 10px;
}

.agreeModal .textarea li:before {
    display: inline-block;
    font-family: 'NanumSquare';
    width: 20px;
    height: 20px;
    line-height: 20px;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    text-align: center;
    background-color: #272c38;
    border-radius: 100%;
    vertical-align: top;
    margin-right: 8px;
    counter-increment: myCounter;
    content: counter(myCounter);
}

.agreeModal .txt_agree {
    text-align: center;
    line-height: 34px;
    font-weight: 500;
    font-size: 16px;
    margin-top: 30px;
}

.agreeModal .btns {
    text-align: center;
    margin: 0 auto;
}

.agreeModal .btnAgree {
    display: inline-block;
    text-align: center;
    width: 220px;
    height: 50px;
    line-height: 50px;
    color: #fff;
    font-size: 15px;
    border-radius: 5px;
    background-color: #272c38;
    margin-top: 20px;
}

.agreeModal .btnLater {
    display: inline-block;
    line-height: 22px;
    border-bottom: 1px solid #666666;
    color: #666666;
    font-size: 14px;
    margin-top: 16px;
}

/* 2022-08-01 주문취소 무통장 입금 환불 계좌 팝업 */
.modal .cancelModal .refundFormWrap .selectric .label {
    height: 32px;
    line-height: 32px
}

.modal .cancelModal .refundFormWrap .selectric {
    border-color: #e0e0e0;
}

.modal .cancelModal .refundFormWrap .selectric-sel {
    width: 100% !important;
}

.modal .cancelModal .refundFormWrap input[type=text] {
    height: 34px;
    border-color: #e0e0e0;
}

.modal .cancelModal .refundInfo {
    color: #7e828b;
    font-weight: 300;
    font-size: 14px;
}

.modal .cancelModal h3 .txt_red {
    font-weight: 400;
    font-size: 16px;
}

.modal .cancelModal .innerTxt .txt01 {
    font-weight: 500;
    font-size: 22px;
    color: #272c38;
}

.modal .cancelModal .innerTxt .txt02 {
    font-size: 16px;
    color: #272c38;
    margin-top: 14px;
}

.modal .cancelModal .innerTxt .txt03 {
    font-size: 16px;
    color: #e54944;
    margin-top: 35px;
}

.modal .cancelModal .refundBox {
    display: table;
    width: 100%;
    background-color: #f6f6f6;
    border: 1px solid #cccccc;
    padding: 27px 30px 13px;
    margin-top: 30px;
}

.modal .cancelModal .refundBox li {
    display: table-row;
}

.modal .cancelModal .refundBox li span {
    display: table-cell;
    font-size: 16px;
    font-weight: 300;
    padding-bottom: 14px;
}

.modal .cancelModal .refundBox li span.tit {
    width: 90px;
    font-weight: 500;
}

.modal .cancelModal .refundBox li span.tit:before {
    content: '';
    background-color: #272c38;
    display: inline-block;
    width: 6px;
    height: 6px;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    vertical-align: 3px;
    margin-right: 8px;
}

@media screen and (max-width: 767px) {
    .modal .cancelModal .refundInfo {
        font-size:12px;
    }

    .modal .cancelModal .modalBody {
        padding-bottom: 50px;
    }

    .modal .cancelModal h3 .txt_red {
        font-size: 13px;
    }

    .modal .cancelModal .innerTxt .txt01 {
        font-size: 16px;
    }

    .modal .cancelModal .innerTxt .txt02 {
        font-size: 13px;
    }

    .modal .cancelModal .innerTxt .txt03 {
        font-size: 13px;
    }

    .modal .cancelModal .refundBox {
        padding: 12px 20px 8px;
    }

    .modal .cancelModal .refundBox li span {
        font-size: 13px;
        padding-bottom: 4px;
    }
}

/* 2022-08-01 주문취소 무통장 입금 환불 계좌 팝업 */
/*어휘출제마법사 (2022-10 추가)*/
.makeList .depthCategorySet {
    padding: 20px 0 0;
}

.makeList .schKeyword.noFilter input[type=text] {
    right: 100px;
    width: 1180px
}

.makeList .schKeyword.noFilter input[type=submit] {
    right: 0;
}

.makeList .boardSearch .schKeyword.noFilter .toggleBtn {
    display: none;
}

.makeList .schKeyword.noFilter ~ .boardFilter {
    display: none;
}

.makeList .schKeyword.noFilter ~ .resultText .btnReset {
    display: none;
}

.makeList .boardMakeListBtn {
    position: relative;
    text-align: right;
    margin-top: 25px;
    margin-bottom: -7px;
}

.makeList .boardMakeListBtn .btnRegWord {
    display: inline-block;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 700;
    font-size: 1rem;
    height: 56px;
    line-height: 54px;
    padding: 0 34px;
    background: #2c579c;
    color: #fff;
}

.makeList .boardMakeListBtn .btnRegWord > img {
    margin-right: 4px;
}

.makeList .boardMakeListBtn .tooltipSet {
    position: relative;
    display: inline-block;
    text-align: left;
    margin-right: 14px;
}

.makeList .boardMakeListBtn .icTooltip {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url(../img/common/icon_help.png) no-repeat center;
}

.makeList .boardMakeListBtn .icTooltip > em {
    display: none;
}

.makeList .boardMakeListBtn .tooltip {
    display: none;
    width: 300px;
    position: absolute;
    left: 50%;
    margin-left: -140px;
    margin-top: 14px;
    z-index: 20;
}

.makeList .boardMakeListBtn .tooltip:before {
    left: 50%;
    margin-left: -15px;
}

.makeList .boardMakeListBtn .icTooltip:hover {
    background: url(../img/common/icon_help_over.png);
}

.makeList .boardMakeListBtn .icTooltip:hover + .tooltip {
    display: block;
    transition: 0.3s;
}

.makeList .boardList.listTypeB .article.myword .btnDelete {
    position: absolute;
    top: 50%;
    right: 280px;
    margin-top: -32px;
}

.makeList .boardList.listTypeB .article.myword .btnDelete a {
    display: inline-block;
    font-family: 'NanumSquare', 'Noto Sans KR', 'Malgun Gothic','맑은 고딕',Helvetica,sans-serif;
    font-weight: 700;
    font-size: 1rem;
    text-align: center;
    width: 65px;
    height: 65px;
    line-height: 63px;
    padding: 0;
    background: #fff;
    color: #e8463e;
    border: 1px solid #dbdbdb;
}

.makeList .boardList.listTypeB .article.myword .thumbs:before {
    content: 'MY';
    position: absolute;
    left: 10px;
    top: 10px;
    width: 34px;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    font-weight: 500;
    text-align: center;
    border-radius: 4px;
    background-color: #ffc600;
}

/*2022-11-05 추가*/
.makeList .makeEditBox {
    margin-top: 24px;
    background: #fff;
    border: 1px solid #e4e4e4;
}

.makeList .makeEditBox .boxHeader {
    background: #fafafa;
    padding: 22px;
    border-bottom: 1px solid #eaeaea;
}

.makeList .makeEditBox .boxHeader h3 .title {
    font-size: 18px;
    font-weight: 600;
}

.makeList .makeEditBox .boxHeader h3 .subTxt {
    font-size: 14px;
    color: #888888;
    margin-left: 10px;
}

.makeList .makeEditBox .boxHeader h3 .warningTxt {
    display: none;
    color: #e8463e;
}

.makeList .makeEditWrap .makeTitle {
    padding: 20px;
    border-bottom: 1px solid #eaeaea;
}

.makeList .makeEditWrap strong {
    display: inline-block;
    width: 110px;
    line-height: 40px;
    font-weight: 500;
    font-size: 16px;
    vertical-align: top;
    white-space: nowrap;
}

.makeList .makeEditWrap .makeTitle input[type=text] {
    height: 40px;
    width: 500px;
    padding-top: 0;
    padding-bottom: 0;
}

.makeList .makeEditWrap .makeEditList {
    padding: 20px;
}

.makeList .makeEditWrap .listHeader {
    position: relative;
    padding-top: 5px;
}

.makeList .makeEditWrap .listHeader .btnSet {
    position: absolute;
    right: 0;
    top: 5px;
}

.makeList .makeEditWrap .boardList {
    margin-top: 15px;
}

.makeList .makeEditWrap .boardList .btnSet {
    padding: 20px 0;
}

.makeList .makeEditWrap .boardList .btn {
    font-weight: 600;
    padding: 0 6px;
    border-radius: 3px;
    margin: 5px 0;
}

.makeList .makeEditWrap .boardList .btnEdit {
    border: 1px solid #cfcfcf;
}

.makeList .makeEditWrap .boardList .btnDel {
    color: #e8463e;
    border: 1px solid #cfcfcf;
}

.makeList .makeEditWrap .boardList tr.editRow td {
    background: #e8eaee;
}

.makeList .makeEditWrap .boardList tr.editRow input[type=text] {
    height: 56px;
    width: 100%;
    text-align: center;
}

.makeList .makeEditWrap .boardList tr.editRow textarea {
    height: 56px;
    width: 100%;
}

.makeList .makeEditWrap .boardList .editForm {
    display: none;
}

.makeList .makeEditWrap .boardList td:nth-child(3) {
    width: 13%;
}

.makeList .makeEditWrap .boardList td:nth-child(4) {
    width: 13%;
}

.makeList .makeEditWrap .boardList td:nth-child(5) {
    width: 27%;
}

.makeList .makeEditWrap .boardList td:nth-child(6) {
    width: 27%;
}

.makeList .makeEditWrap .boardFooter {
    margin-bottom: 0;
}

.makeList .makeEditWrap .noData {
    padding: 160px 0;
    border-bottom: 1px solid #e4e4e4;
    font-size: 16px;
    text-align: center;
}

.makeList .makeEditWrap .tooltipSet {
    display: inline-block;
}

.makeList .makeEditWrap .tooltipSet .tooltip {
    display: none;
    background: #fff;
    box-shadow: 0px 1px 10px 0px rgba(15, 15, 15, 0.1);
    position: absolute;
    top: 50px;
    right: 80px;
    width: 720px;
    z-index: 5;
    border-radius: 0;
    padding: 0;
}

.makeList .makeEditWrap .tooltipSet .tooltip:before {
    left: 50%;
    margin-left: -9px
}

.makeList .makeEditWrap .btnMakeGuide:hover + .tooltip {
    display: block;
}

.makeList .makeEditWrap .tooltipSet .tooltip .tooltipHeader {
    background: #fafafa;
    border-bottom: 1px solid #dbdbdb
}

.makeList .makeEditWrap .tooltipSet .tooltip .tooltipHeader h3 {
    line-height: 53px;
    font-size: 16px;
    font-weight: 700;
    padding-left: 23px;
}

.makeList .makeEditWrap .tooltipSet .tooltip .tooltipBody {
    padding: 23px;
}

.makeList .makeEditWrap .tooltipSet ul {
    counter-reset: list-number;
    border-bottom: 1px solid #efefef;
    padding-bottom: 14px;
    margin-bottom: 24px;
}

.makeList .makeEditWrap .tooltipSet li {
    line-height: 20px;
    color: #272c38;
    font-size: 14px;
    margin-bottom: 10px;
    border-bottom: 0;
}

.makeList .makeEditWrap .tooltipSet li:before {
    display: inline-block;
    width: 20px;
    height: 20px;
    line-height: 20px;
    color: #fff;
    font-size: 12px;
    text-align: center;
    background-color: #808080;
    border-radius: 100%;
    vertical-align: top;
    margin-right: 8px;
    counter-increment: list-number;
    content: counter(list-number);
}

.makeList .makeEditWrap .tooltipSet .roundTitle {
    margin: 20px 0 8px;
}

.makeList .makeEditWrap .tooltipSet .roundTitle span {
    display: inline-block;
    height: 24px;
    line-height: 22px;
    color: #e8463e;
    font-size: 13px;
    border: 1px solid #dbdbdb;
    border-radius: 12px;
    padding: 0 8px;
    vertical-align: top;
}

.makeList .makeEditWrap .tooltipSet p {
    color: #272c38;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 10px;
}

.makeList .makeEditWrap .tooltipSet .sampleBox {
    display: inline-block;
    line-height: 24px;
    border: 1px solid #dbdbdb;
    padding: 10px;
}

.makeList .makeEditWrap .tooltipSet .sampleBox .strong {
    font-weight: 700;
    font-size: 13px;
}

.makeList .makeEditWrap .tooltipSet .sampleBox .fill {
    display: inline-block;
    width: 30px;
    border-bottom: 1px solid #272c38;
}

.makeList .makeEditWrap .tooltipSet .txtRed {
    color: #e8463e
}

.makeList .makeEditWrap .tooltipSet .txtBlue {
    color: #33aee7
}

.makeList .boardFooter .noticeTxt {
    position: absolute;
    left: 0;
    top: 10px;
    color: #888888;
    font-size: 14px;
}

/* 20230830 전소영 E-BOOK 퀵메뉴 */
.quickMenu {
    position: fixed;
    right: 0;
    top: 18%;
    z-index: 20;
    transition: 0.6s all;
}
.quickMenu.hide {
    right: -182px;
}
.quickMenu.hide .inner .arrow::before {
    transform: rotate(-180deg);
}
.quickMenu .inner {
    background-color: #fff;
    border-radius: 20px 0 0 20px;
    border: 1px solid #E3E3E3;
    position: relative;
}
.quickMenu .inner .arrow {
    position: absolute;
    left: -22px;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    height: 50px;
    background-color: #2650B4;
    border-radius: 8px 0 0 8px;    
}
.quickMenu .inner .arrow::before {
    content: '';
    display: block;
    background: url('../img/common/ic_quick_arrow.svg') no-repeat center / contain;
    width: 6px;
    height: 11px;
    position: absolute;
    top: 20px;
    left: 9px;
    transition: 0.4s all;   
}
.quickMenu .inner .top {
    padding: 20px 20px 14px 20px;
    position: relative;
    border-radius: 20px 0 0 20px;
}
.quickMenu .inner .top::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 20px 0 0 20px;
    box-shadow: -4px 4px 15px 0 rgba(0,0,0,7%);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.quickMenu .inner .top .title h2 {
    font-size: 0.87rem;
    font-weight: 500;
    color: #00416C;
    display: flex;
    align-items: center;
    gap: 5px;
}
.quickMenu .inner .top .title h2::after {
    content: '';
    display: inline-block;
    background: url('../img/common/ic_series.svg') no-repeat center / contain;
    width: 15px;
    height: 15px;
    margin-top: 1px;
}
.quickMenu .inner .top .linkBox {
    display: flex;
    gap: 5px;
    flex-direction: column;
    padding: 6px 0;
}
.quickMenu .inner .top .linkBox .btns {
    width: 140px;
    height: 26px;
    background-color: #00416C;
    border-radius: 5px;
    color: #fff;
    font-size: 0.76rem;
    font-weight: 700;
    display: block;
    text-align: center;
    line-height: 26px;
    position: relative;
    padding: 0 6px;
    box-sizing: border-box;
}
.quickMenu .inner .top .linkBox .btns:hover {
    background-color: #00558D;
}
.quickMenu .inner .top .linkBox .btns.oncon {
    font-weight: 500;
    border: 1px solid #ccc;
    height: 34px;
    line-height: 32px;
    background-color: #fff;
    color: #00416C;
    padding-left: 24px;
    margin-top: 4px;
}
.quickMenu .inner .top .linkBox .btns.oncon::before {
    content: '';
    display: block;
    background: url('../img/common/ic_oncon_make.svg') no-repeat center / contain;
    width: 16px;
    height: 16px;
    position: absolute;
    top: 50%;
    left: 6px;
    transform: translateY(-50%);
}
.quickMenu .inner .top .linkBox .btns.oncon:hover {
    background-color: #ccc;
    border-color: #999;
}

.quickMenu .inner .bottom {
    border-radius: 0 0 0 19px;
    overflow: hidden;
}
.quickMenu .inner .bottom a {
    display: block !important;
    background-color: #D2E8FF;
    padding: 10px;
}
.quickMenu .inner .bottom a .inn {
    display: flex;
    align-items: center;
    justify-content: center;
}
.quickMenu .inner .bottom a .inn > div {
   text-align: left;
}
.quickMenu .inner .bottom h3 {
    font-size: 1.2rem;
    font-weight: 500;
    color: #004EA1;
    letter-spacing: -0.5px;
}
.quickMenu .inner .bottom h3 span {
    font-weight: 900;
}
.quickMenu .inner .bottom h4 {
    font-size: 0.76rem;
    font-weight: 700;
    color: #333;
    display: flex;
    align-items: center;
    gap: 3px;
}
.quickMenu .inner .bottom h4::after {
    content: '';
    display: block;
    background: url('../img/common/ic_arrow_go_.svg') no-repeat center / contain;
    width: 24px;
    height: 14px;
    margin-left: 4px;
}
.quickMenu .inner .bottom h4 span {
    color: #E8463E;
}

/*메인 전체보기 팝업*/
body.active-popup { 
    overflow: hidden;
}
.layerpop{ 
    display: none;
    position: fixed; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    width: 100%; 
    height: 100%; 
    background-color: rgba(0,0,0,0.55); 
    z-index: 120;
}
.layerpop.show {
    display: block;
}
.layerpop .popup-content { 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    width: 100%; 
    height: 100%;
}
.layerpop .popup-content .inner { 
    position: relative;
}
.layerpop .popup-content .inner .top-btn-box {
    position: absolute;
    top: -7px;
    right: -40px;
}
.layerpop .popup-content .inner .top-btn-box .close {
    background: url('../img/popup/ico_btn_pop_close.svg') no-repeat center / contain;
    width: 30px;
    height: 30px;
    text-indent: -9999px;
}
.layerpop .popup-content .inner .popup-body {
    max-width: 924px;
    height: 738px;
    overflow: auto;
}
.layerpop .popup-content .flex-wrap-row { 
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}
.layerpop .popup-content .flex-wrap-row .col { 
    width: calc(50% - 12px);
}
.layerpop .popup-content .flex-wrap-row .col a {
    display: block;
    border-radius: 15px;
    overflow: hidden;
}

/**** 20240130 관리자 권한 댓글 ****/
.tag-label-fix{
    display: inline-block;
    background: url('../img/common/ico_scrap.svg') no-repeat center / contain;
    width: 18px;
    height: 18px;
}

/*기본체크박스*/
.check-list-wrap input[type="checkbox"]:not(.cssbrowser) {
    display: none;
}
.check-list-wrap input[type="checkbox"]:not(.cssbrowser) + label {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 0;
    vertical-align: middle;
    padding-left: 30px;
    text-indent: 0;
}
.check-list-wrap input[type="checkbox"]:not(.cssbrowser):checked + label {
    background: url("../img/common/ic_checkbox_a.png") no-repeat 0 -24px;
}
.check-list-wrap input[type="checkbox"]:not(.cssbrowser):disabled + label {
    opacity: 0.5;
}
/*고정라벨*/
/* .check-list-wrap.fix-label {
    display: flex;
    align-items: center;
}
.check-list-wrap.fix-label input[type="checkbox"]:not(.cssbrowser) + label {
    background: url("../img/common/ico_scrap.svg") no-repeat center left / contain;
    width: 20px;
    height: 20px;
    line-height: 20px;
}
.check-list-wrap.fix-label input[type="checkbox"]:not(.cssbrowser):checked + label {
    background: url("../img/common/ico_scrap-click2.svg") no-repeat center left / contain;
}
.check-list-wrap.fix-label input[type="checkbox"]:not(.cssbrowser).readonly + label {
    pointer-events: none;
}
.check-list-wrap.hide{
    display: none;
} */

.reviewList .article .postinfo {
    display: flex;
    align-items: center;
    gap: 20px;
}
.reviewList .article .postinfo span {
    margin-left: 0;
}
.label-admin{
    background-color: #2651b4;
    color: #fff;
    padding: 0 12px;
    line-height: 30px;
    border-radius: 4px;
}
.regReview .check-list-wrap {
    padding-bottom: 10px;
}
.regReview input[type="submit"] {
    top: auto;
    height: 90px;
}
.regReview span {
    height: 90px;
    top: auto;
    bottom: 0;
}


@media screen and (max-width: 1280px) {
    /* .support{
        padding: 80px 20px 100px 0;
    }
    .suppertSet .container-inner{
        gap: 20px;
    }
    .suppertSet .csinfo{
        width: 280px;
        height: 120px;
        gap: 8px;
    }
    .suppertSet .csinfo h3 {
        font-size: 1rem;
    }
    .suppertSet .csinfo strong{
        font-size: 1.2rem;
    }
    .suppertSet .csinfo a{
        height: 50px;
        line-height: 50px;
        padding: 0 15px;
        right: 20px;
        font-size: 0.975rem;
    }
    .suppertSet .csMenu{
        width: calc(100% - 280px - 20px);
        display: flex;
        justify-content: flex-end;
    }
    .suppertSet .csMenu ul{
        gap: 10px 15px;
    }
    .suppertSet .csMenu li{
        width: 120px;
        height: 120px;
    }
    .suppertSet .csMenu li a span{
        font-size: 1rem;
        padding: 20px 10px;
    } */
    
}