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

body.body__khome {
    background-color: #fff;
}

.nodata {
    font-weight: 300;
    font-color: #ddd;
    padding: 0px 10px;
}

._khomeview .header .screen {
    width: 100%;
    display: block;
    z-index: 2;
}

._khomeview[name=_khome_default] .header .screen {
    position: absolute;
    top: 0;
}

._khomeview .header.fixed .screen .wrapheader .mainmnu {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 4;
    background-color: #fff;
    box-shadow: 0 1px 5px rgba(0,0,0,0.1);
}

._khomeview .header .screen .wrapheader .mainmnu .wrapmnu {
    margin: 0 auto;
    position: relative;
    padding: 20px 0;
    max-width: 1120px;
}

._khomeview .header .screen .wrapheader {
    max-width: 1120px;
    margin: 0 auto;
    position: relative;
}

._khomeview .header .mobile .logo {
    top: 5px;
}

._khomeview .header a {
    color: #333;
    font-size: 15px;
}

._khomeview[name=_khome_default] .header .screen a {
    color: #fff;
}

._khomeview .header a.logo {
    padding-top: 0;
}

._khomeview .header a.logo > img {
    width: 120%;
}

._khomeview[name=_khome_default] .header.fixed .mnu a:not(.btn-round) {
    color: #333;
    text-shadow: none !important;
}

._khomeview[name=_khome_default] .header.fixed a.btn {
    color: #fff;
    text-shadow: none !important;
    font-weight: bold;
}

._khomeview .header nav.mnu {
    text-align: center;
    padding-left: 150px;
}

._khomeview .header nav.mnu a {
    display: inline-block;
    font-size: 20px;
    padding: 0px 40px;
    line-height: 33px;
    text-align: center;
    text-shadow: 1px 1px 15px #eee;
}

._khomeview[name=_khome_default] .header nav.mnu a {
    text-shadow: 1px 1px 5px #333;
}

._khomeview .header nav.mnu a.active:not(.btn-round) {
    color: #ee5281;
    font-weight: 600;
    font-size: 20px;
}

._khomeview .header nav.mnu a.btn-round {
    border: 2px solid #ee5281;
    border-radius: 30px;
    margin-left: 30px;
    padding: 0px 20px;
    background-color: #fff;
    color: #ee5281;
    text-shadow: none;
}

._khomeview .header nav.mnu a.btn-round.active,
._khomeview .header nav.mnu a.btn-round:hover {
    background-color: #ee5281;
    color: #fff;
}

._khomeview .header .mainmnu {
    position: relative;
}

._khomeview .header .quickmnu {
    position: relative;
    height: 30px;
    z-index: 1;
}

._khomeview .header .quickmnu .wrapmnu {
    position: absolute;
    margin-top: -32px;
    right: 10px;
}

._khomeview .header .quickmnu .wrapmnu a {
    font-size: 12px;
    position: relative;
    transition: all 0.2s ease-in-out;
    float: left;
    margin: 0 5px;
}

._khomeview .header .quickmnu .wrapmnu a:hover {
  margin-top: 32px;
  transition: all 0.2s ease-in-out;
}

._khomeview .header .quickmnu .wrapmnu a > img {
    width: 80px;
}

._khomeview .header .quickmnu a > span {
    position: absolute;
    bottom: 0px;
    color: #fff;
    font-size: 9px;
    font-family: 'Binggrae';
    font-weight: bold;
    text-align: center;
    width: 80px;
    left: 0px;
    margin-bottom: 8px;
}

/*********** mobile header *************/

._khomeview .header .mobile .wrapheader {
    width: 100%;
    padding: 0px 10px;
    height: 60px;
    line-height: 50px;
    text-align: initial;
    top: 0px;
    left: 0px;
    z-index: 2;
    display: none;
}

._khomeview .header.fixed .mobile .wrapheader {
    position: fixed;
    background-color: #fff;
    box-shadow: 0 1px 5px rgba(0,0,0,0.1);
}

._khomeview .header .mobile .wrapheader {
    position: absolute;
    line-height: 60px;
}

._khomeview .header .mobile .wrapheader .btn-mnu {
    color: #ffce02;
    line-height: 66px;
}

._khomeview[name=_khome_default] .header .mobile .wrapheader .btn-mnu {
}

._khomeview .header.fixed .mobile .wrapheader .btn-mnu {
    color: #ffce02;
    text-shadow: none;
}

._khomeview .header .mobile .wrapheader .logo {
    top: -2px;
    right: 15px;
    left: initial;
    padding: 0px;
    text-align: right;
}

._khomeview .header .mobile .wrapheader .logo > img {
    width: 100%;
}

.mnu-expand ._khomeview .header .mobile .mnubx {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
}

._khomeview .header .mobile .mnubx {
  width: 300px;
  height: 100%;
  display: block;
  position: fixed;
  top: 0;
  background-color: #fff;
  transform: translateX(-100%);
  transition-delay: 0s;
  transition-duration: 0.3s, 0s;
  transition-property: transform, opacity;
  transition-timing-function: ease, ease;
  overflow-y: auto;
  z-index: 102;
  text-align: center;
  padding: 0px;
}

._khomeview .header .mobile .mnubx .logo {
    position: initial;
    margin-top: 30px;
}

._khomeview .header .mobile .mnubx .btns > .btn {
    color: #fff;
    border-radius: 30px;
    padding: 5px 20px;
    margin-top: 30px;
}

._khomeview .header .mobile .mnubx .mnuhead {
    padding: 10px 0px 30px;
    background: #3e5775 url(https://www.dabikids.com/skins/default/images/home/20190812_127.png) no-repeat top left / cover;
}

._khomeview .header .mobile .mnubx .mnu {
    padding: 10px 0px 20px;
    text-align: left;
}

._khomeview .header .mobile .mnubx .mnu:not(:last-child) {
    border-bottom: 1px solid #eee;
}

._khomeview .header .mobile .mnubx .mnu > ul > li {
    margin-top: 10px;
    padding: 10px 15px;
}

._khomeview .header .mobile .mnubx .mnu > ul > li:hover {
    background-color: #EFEFEF;
}

._khomeview .header .mobile .mnubx .mnu > ul > li a > i {
    display: none;
    width: 40px;
    text-align: center;
    color: #2a354f;
}

/*********** banner *************/

.topbanner {
    position: relative;
    background-color: #503073;
    z-index: 2;
}

.wrapbanner {
    width: 1120px;
    margin: 0 auto;
}

.topbanner .close {
    position: absolute;
    top: 50%;
    right: 8px;
    display: block;
    margin: -24px 0 0;
    padding: 12px;
    border: none;
    color: #fff !important;
    background: transparent;
    cursor: pointer;
    width: 48px;
    height: 48px;
    opacity: .9;
}

.topbanner .banner {
    display: block;
    height: 50px;
}

.fullbanner {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 101;
  background: rgba(0,0,0,0.5);
}

.fullbanner .wrap {
    background-color: #fff;
    max-width: 600px;
    max-height: 800px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 1px 1px 5px #333;
}

.fullbanner .wrap .banners {
    min-width: 500px;
    max-width: 600px;
    max-height: 800px;
    margin-bottom: 0px;
}

.fullbanner .wrap .banner {
    display: block;
    height: 100%;
    padding-bottom: 36px;
}

.fullbanner .wrap .banner img {
    width: 100%;
    height: 100%;
}

.fullbanner .close {
    font-size: 50px;
    font-weight: 100;
    position: absolute;
    right: 5px;
}

.fullbanner .btns {
    position: absolute;
    bottom: 0px;
    width: 100%;
    background-color: rgba(0, 0, 0, .8);
    overflow: hidden;
}

.fullbanner .btns > a {
    font-size: 17px;
    color: #fff;
    float: left;
    width: 50%;
    padding: 10px;
    text-align: center;
}

.fullbanner .btns > a+a {
    border-left: 1px solid #fff;
}


/*********** main *************/

._khomeview > .contentpanel {
    padding: 0px;
    min-height: 800px;
    background-color: #fff;
}

._khomeview > .contentpanel .wrap,
._khomeview > .contentpanel > .wrapcontent {
  margin: 0 auto;
  max-width: 1120px;
  position: relative;
  padding: 0 10px;
}

._khomeview > .contentpanel .tab-content .wrapboard {
    margin: 0 50px;
}

._khomeview > .contentpanel .mtabs .wrap {
    padding: 0px;
    white-space: nowrap;
    overflow: auto;
}

._khomeview[name=_khome_default] .header {
    height: 966px;
}

._khomeview[name=_khome_default] .header .bgbanners {
    width: 100%;
}

._khomeview[name=_khome_default] .header .bgbanners .bgbanner {
    height: 966px;
    position: relative;
}

._khomeview[name=_khome_default] .header .bgbanners .bgbanner01 {
    background: url('/skins/default/images/kids/kidsmainbg01.jpg') no-repeat center center/cover;
}

._khomeview[name=_khome_default] .header .bgbanners .bgbanner02 {
    background: url('/skins/default/images/kids/kidsmainbg02.jpg') no-repeat center center/cover;
}

._khomeview[name=_khome_default] .header .bgbanners .bgbanner03 {
    background: url('/skins/default/images/kids/kidsmainbg03.jpg') no-repeat center center/cover;
}

._khomeview[name=_khome_default] .header .bgbanners .bgbanner {
    width: 100%;
    object-fit: cover;
}

._khomeview[name=_khome_default] .header video.fullscreen { 
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translate(-50%, -50%);
}

._khomeview .header .bgbanners .titlebx {
    color: #fff;
    position: absolute;
    top: 50%;
    left: 40%;
    transform: translate(-50%, -50%);
}

._khomeview[name=_khome_default] .header .bgbanners .titlebx {
    display: inline-block;
}

._khomeview .header .bgbanners .titlebx h1 {
    line-height: 45px;
    text-shadow: 1px 1px 5px #333;
}

._khomeview .header .bgbanners .titlebx h1 > span {
    display: block;
}

._khomeview .header .bgbanners .titlebx p {
    font-size: 20px;
    line-height: 30px;
    text-shadow: 1px 1px 5px #333;
}

._khomeview .header .bgbanners .titlebx .btn {
    margin-top: 15px;
    background-color: #ef5382;
    color: #fff;
    padding: 10px 25px;
    border-radius: 30px;
    font-size: 20px;
}

._khomeview[name=_khome_default] > .contentpanel > .section {
}

._khomeview[name=_khome_default] > .contentpanel > .section > .wrap {
    padding: 20px 0;
}

._khomeview[name=_khome_default] > .contentpanel > .section > .wrap p {
    font-size: 15px;
    line-height: 30px;
}

._khomeview[name=_khome_default] > .contentpanel > .section > .wrap > h2 {
    text-align: center;
}

._khomeview[name=_khome_default] > .contentpanel > .section.introduce {
}

._khomeview[name=_khome_default] > .contentpanel > .section.introduce .wrap {
    background: #fff url(/skins/default/images/kids/kids_dabisu_info01.jpg) no-repeat bottom left;
    height: 600px;
    position: relative;
}

._khomeview[name=_khome_default] > .contentpanel > .section.introduce .wrap .content {
    position: absolute;
    top: 200px;
    right: 0px;
    width: 500px;
}

._khomeview[name=_khome_default] > .contentpanel > .section.dabisu::before {
    content: '';
    width: 100%;
    background-image: url(/skins/default/images/kids/program_baseline_darkblue.png);
    background-repeat: repeat-x;
    display: block;
    position: absolute;
    height: 38px;
    top: -38px;
}

._khomeview[name=_khome_default] > .contentpanel > .section .wrap .content h3 {
    line-height: 45px;
    font-size: 27px;
    font-family: "Binggrae";
    font-weight: bold;
}

._khomeview[name=_khome_default] > .contentpanel > .section .wrap .content h3 > b {
    font-size: 33px;
}

._khomeview[name=_khome_default] > .contentpanel > .section.introduce .wrap .content h3 > b {
    color: #F44336;
}

._khomeview[name=_khome_default] > .contentpanel > .section.dabisu .wrap .content h3 > b {
    color: #FFC107;
}

._khomeview[name=_khome_default] > .contentpanel > .section.hangul .wrap .content h3 > b {
    color: #03A9F4;
}

._khomeview[name=_khome_default] > .contentpanel > .section .btndetail {
    background-color: #fff;
    display: inline-block;
    margin-top: 10px;
    padding: 5px 20px;
    line-height: 30px;
    color: #00b1ef;
    border-radius: 25px;
    text-shadow: none;
    text-decoration: none;
    font-weight: bold;
}

._khomeview[name=_khome_default] > .contentpanel > .section.dabisu .logo {
    width: 150px;
    display: inline-block;
    position: relative;
    left: 0px;
}

._khomeview[name=_khome_default] > .contentpanel > .section.dabisu {
    background-color: #4c5e96;
    position: relative;
    color: #fff;
}

._khomeview[name=_khome_default] > .contentpanel > .section.dabisu .content {
    text-shadow: 1px 1px 5px #333;
}


._khomeview[name=_khome_default] > .contentpanel > .section.dabisu > .wrap {
    position: relative;
    height: 600px;
    background: url(/skins/default/images/kids/20200602_002.png) no-repeat left top/auto 110%;
}

._khomeview[name=_khome_default] > .contentpanel > .section.dabisu .wrap .content {
    position: absolute;
    top: 50%;
    right: 100px;
    transform: translateY(-50%);
    width: 500px;
}

._khomeview[name=_khome_default] > .contentpanel > .section.hangul {
    background: #e4e4ec url('/skins/default/images/kids/hangul_bg.jpg') no-repeat center center/cover;
}

._khomeview[name=_khome_default] > .contentpanel > .section.hangul .logo {
    width: 150px;
    display: inline-block;
    position: relative;
    left: 0px;
}

._khomeview[name=_khome_default] > .contentpanel > .section.hangul .btndetail {
    color: #f05382;
}

._khomeview[name=_khome_default] > .contentpanel > .section.hangul .wrap {
    position: relative;
    height: 600px;
}

._khomeview[name=_khome_default] > .contentpanel > .section.hangul .wrap .content {
    position: absolute;
    bottom: 50px;
    left: 100px;
    width: 500px;
    text-shadow: 1px 1px 5px #fff;
}

._khomeview[name=_khome_default] > .contentpanel > .section.hangul .wrap .content h3 {
    line-height: 40px;
    font-family: "Binggrae";
    font-weight: bold;
    color: #f05382;
}

._khomeview[name=_khome_default] > .contentpanel > .section.hangul .wrap .content h3 > b {
    color: #2b5da2;
}

._khomeview[name=_khome_default] > .contentpanel > .section.guide {
}

._khomeview[name=_khome_default] > .contentpanel > .section.guide > .wrap {
    min-height: 200px;
    position: relative;
}

._khomeview[name=_khome_default] > .contentpanel > .section.guide > .wrap .content {
    margin: 70px auto;
    padding-left: 200px;
}

._khomeview[name=_khome_default] > .contentpanel > .section.guide > .wrap .app_logo {
    margin-top: 30px;
    padding: 0px;
    border-radius: 50%;
    width: 170px;
    height: 170px;
    overflow: hidden;
    background: #00bcd4 url(/common/images/app_logo_woodongsam.png) no-repeat center center/75% auto;
    float: left;
}


._khomeview[name=_khome_default] > .contentpanel > .section.guide > .wrap .desc {
    margin-left: 220px;
    overflow: hidden;
}

._khomeview[name=_khome_default] > .contentpanel > .section.guide > .wrap .desc h3 > span {
    color: #02bcd5;
}

._khomeview[name=_khome_default] > .contentpanel > .section.guide > .wrap .desc ul > li {
    display: inline-block;
}

._khomeview[name=_khome_default] > .contentpanel > .section.guide > .wrap .btn-app {
    border: 1px solid #000;
    padding: 10px 20px;
    border-radius: 30px;
    display: inline-block;
    margin-right: 20px;
    margin-bottom: 10px;
}

._khomeview[name=_khome_default] > .contentpanel > .section.guide > .wrap .btn-app img {
    width: 20px;
}

/*********** intro *************/

._khomeview .intropanel {
}

._khomeview .intropanel > .banner {
    text-align: center;
    background: #eb8fa0 url(/skins/default/images/kids/bg_header_kids.jpg) no-repeat center bottom -30px/auto 130%;
}

._khomeview .intropanel > .banner > .wrap {
    min-height: 200px;
    position: relative;
}

._khomeview .intropanel .wrapcontent {
    max-width: 960px;
    min-height: 1000px;
}

._khomeview .intropanel .wrapcontent p {
    font-size: 15px;
    line-height: 22px;
    font-weight: 300;
}

._khomeview .intropanel .wrapcontent .map {
    min-height: 500px;
    background-color: #F9F9F9;
    margin-bottom: 20px;
}

/*********** info *************/

._khomeview .infopanel {
}

._khomeview .infopanel > .banner {
    text-align: center;
    background: #19c299 url(/skins/default/images/kids/bg_header_teacher.jpg) no-repeat center bottom -30px/auto 130%;
}

._khomeview .infopanel > .banner > .wrap {
    min-height: 200px;
    position: relative;
}

._khomeview .infopanel .wrapcontent {
    max-width: 960px;
    min-height: 1000px;
}

._khomeview .infopanel .wrapcontent > .title {
    text-align: center;
}

._khomeview .infopanel .wrapcontent p {
    font-size: 15px;
    line-height: 22px;
    font-weight: 300;
}

/*********** help *************/

._khomeview .helppanel {
}

._khomeview .helppanel > .banner {
    text-align: center;
    background: #b285c0 url(/skins/default/images/kids/bg_header_mall.jpg) no-repeat center bottom -30px/auto 130%;
    /*background: #8c579d url(/skins/default/images/home/20190812_096.png) no-repeat center bottom/100% auto*/
}

._khomeview .helppanel > .banner > .wrap {
    min-height: 200px;
    position: relative;
}

._khomeview .helppanel > .banner .box {
    position: absolute; 
    top: 50%;
    left: 10%;
    transform: translateY(-50%);
    background-color: rgba(130, 85, 145, .7);
    color: #fff;
    border: none;
    padding: 10px;
    width: 250px;
}

._khomeview .helppanel > .banner h3 {
    margin: 5px 0;
    font-size: 22px;
}

._khomeview .helppanel > .banner h1 {
    margin: 7px 0;
    font-size: 33px;
    font-weight: bold;
    color: #fcc046;
}

._khomeview .helppanel > .banner .box > p {
    line-height: 22px;
}

._khomeview .contentpanel.helppanel > .mtabs {
    background-color: #825591;
}

._khomeview .contentpanel.helppanel .wrapboard {
    max-width: 900px;
    margin: 0 auto;
}

/*********** dcode *************/

._khomeview .lecturepanel.dcode .intro {
    background: #fff url(/skins/default/images/kids/dcode_bg.jpg) no-repeat center center/auto 100%;
}

._khomeview .lecturepanel.dcode .intro .section1 {
    padding: 20px 0px 20px 80px;
    width: 500px;
    text-align: left;
}

._khomeview .lecturepanel.dcode .characterpanel {
    padding: 10px;
}

._khomeview .lecturepanel.dcode .characterpanel > h2 {
    font-family: 'Binggrae';
    font-weight: bold;
    font-size: 22px;
}

/*********** dabisu *************/

._khomeview .lecturepanel {
}

._khomeview .lecturepanel .intro {
    text-align: center;
    min-height: 300px;
}

._khomeview .lecturepanel.dabisu .intro {
    background: #d9f0f6 url(/skins/default/images/kids/dabisukids_bg.jpg) no-repeat center center/auto 100%;
}

._khomeview .lecturepanel.hangul .intro {
    background: #efeff7 url(/skins/default/images/kids/hangul_bg.jpg) no-repeat center center/100% auto;
}

._khomeview .lecturepanel.dabisu .intro .section1 {
    width: 600px;
    padding: 20px 50px 20px;
    text-align: left;
    float: right;
}

._khomeview .lecturepanel.hangul .intro .section1 {
    padding: 20px 0px 20px 80px;
    width: 500px;
    text-align: left;
}

._khomeview .lecturepanel .intro .section1 h1 {
    font-family: "Binggrae";
    font-weight: bold;
    font-size: 27px;
    margin-bottom: 20px;
}

._khomeview .lecturepanel .intro .section1 h1 > span {
    color: #f25252;
    font-size: 33px;
}

._khomeview .lecturepanel .intro .section1 h5 {
    font-size: 17px;
    line-height; 278px;
    margin-bottom: 10px;
}

._khomeview .lecturepanel .intro .section1 p {
    font-size: 15px;
    line-height: 25px;
    font-weight: 300;
    margin: 10px 0;
}

._khomeview .lecturepanel .intro .section1 .checkin {
    margin-top: 20px;
}

._khomeview .lecturepanel .intro .section1 .checkin .btn {
    border-radius: 30px;
}

._khomeview .lecturepanel .wrap > h3 {
    text-align: center;
    margin: 10px 0px 20px;
}

._khomeview .lecturepanel .wrap > h5 {
    text-align: center;
    font-size: 15px;
    font-weight: 400;
}

._khomeview .lecturepanel .course  {
}

._khomeview .lecturepanel .course .wrap > ul {
    text-align: center;
}

._khomeview .lecturepanel .course .wrap > ul > li {
    display: inline-block;
    width: 200px;
}

._khomeview .lecturepanel .course .wrap > ul > li:not(:last-child) {
    margin-right: 30px;
}

._khomeview .lecturepanel .course .wrap > ul > li a {
    display: inline-block;
    width: 100%;
    padding-bottom: 160%;
    background-repeat: no-repeat;
    background-position: center bottom 30px;
    background-size: 70%;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    color: #fff;
    box-shadow: 1px 1px 5px #aaa;
}

._khomeview .lecturepanel .course .wrap > ul > li.k1 > a {
    background-color: #f7b12f;
    background-image: url(http://app.dabikids.com/assets/images/ilbong.png);
}

._khomeview .lecturepanel .course .wrap > ul > li.k2 > a {
    background-color: #03a9f4;
    background-image: url(http://app.dabikids.com/assets/images/cholssak.png);
    background-size: 90%;
}

._khomeview .lecturepanel .course .wrap > ul > li.k3 > a {
    background-color: #673ab7;
    background-image: url(http://app.dabikids.com/assets/images/ssangssang.png);
    background-position: center bottom 15px;
}

._khomeview[name=hangul] .lecturepanel .course .wrap > ul > li.k1 > a {
    background-color: #f7b12f;
    background-image: url(http://dev.dabikids.com/skins/default/images/home/kids/hangul_char001.png);
    background-size: 45%;
}

._khomeview[name=hangul] .lecturepanel .course .wrap > ul > li.k2 > a {
    background-color: #03a9f4;
    background-image: url(http://dev.dabikids.com/skins/default/images/home/kids/hangul_char002.png);
    background-size: 50%;
}

._khomeview[name=hangul] .lecturepanel .course .wrap > ul > li.k3 > a {
    background-color: #673ab7;
    background-image: url(http://dev.dabikids.com/skins/default/images/home/kids/hangul_char003.png);
    background-size: 60%;
    background-position: left 73% bottom 30px;
}

._khomeview .lecturepanel .course .wrap > ul > li a > div {
    position: absolute;
    text-align: center;
    width: 100%;
    top: 20%;
}

._khomeview .lecturepanel .course .wrap > ul > li a span {
    display: block;
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: bold;
}
._khomeview .lecturepanel .course .wrap > ul > li a label {
    background-color: rgba(255, 255, 255, .5);
    display: inline-block;
    padding: 10px 20px;
    border-radius: 30px;
    color: #333;
    font-size: 17px;
}

._khomeview .lecturepanel .curriculum  {
    min-height: 300px;
    background-color: #fafafa;
    padding: 20px 0;
}

._khomeview .lecturepanel .guide  {
    padding: 20px 0;
}

._khomeview .contentpanel .mtabs {
    background-color: #0f798c;
    border: 0;
    margin-bottom: 3px;
    -moz-box-shadow: 0 3px 0 rgba(0,0,0,0.1);
    -webkit-box-shadow: 0 3px 0 rgba(0,0,0,0.1);
    box-shadow: 0 3px 0 rgba(0,0,0,0.1);
}

._khomeview .contentpanel.hangul .mtabs {
    background-color: #dc3b7f;
}

._khomeview .contentpanel.dcode .mtabs {
    background-color: #1ac299;
}

._khomeview .contentpanel .mtabs .nav-tabs {
    margin: 0 auto;
    box-shadow: none;
    display: table;
    padding: 0px !important;
}

._khomeview[name=hangul] .header.fixed .screen .wrapheader .mainmnu,
._khomeview[name=dabisu] .header.fixed .screen .wrapheader .mainmnu {
    box-shadow: none;
}

._khomeview .contentpanel .mtabs.fixed {
    position: fixed;
    top: 76px;
    left: 0px;
    width: 100%;
    z-index: 5;
    box-shadow: 0 3px 3px rgba(0,0,0,0.1);
}

._khomeview .contentpanel .mtabs .nav-tabs > li {
    display: inline-block;
}

._khomeview .contentpanel .mtabs .nav-tabs > li > a {
    display: inline-block;
    padding: 15px 30px;
    font-size: 16px;
    color: #fff;
}

._khomeview .contentpanel .mtabs .nav-tabs > li.active {
    margin: 0;
}

._khomeview .contentpanel .mtabs .nav-tabs > li.active > a {
    font-weight: bold;
    color: #fff;
    line-height: 22px;
    box-shadow: none;
    border-radius: 0px;
    background-color: rgba(255, 255, 255, .2);
}

._khomeview .contentpanel.hangul .mtabs .nav-tabs > li.active > a {
    box-shadow: none;
}

._khomeview .contentpanel.dabisu .mtabs .nav-tabs > li.active > a {
    box-shadow: none;
}

._khomeview .lecturepanel .wrapcontent {
    min-height: 800px;
}

._khomeview .lecturepanel .wrapcontent .course {
}

._khomeview .lecturepanel .wrapcontent .course .widget {
    padding: 20px;
    position: relative;
    margin: 20px 0;
    border-radius: 20px;
    position: relative;
}

._khomeview .lecturepanel .wrapcontent .course .widget-header > span {
    position: absolute;
    background-color: #ffaa08;
    color: #fff;
    font-size: 25px;
    font-weight: bold;
    line-height: 60px;
    width: 60px;
    border-radius: 50%;
    top: -5px;
    left: 0px;
    text-align: center;
    box-shadow: 1px 1px 5px #333;
}

._khomeview .lecturepanel .wrapcontent .course .k2 .widget-header > span {
    background-color: #ee5281;
}

._khomeview .lecturepanel .wrapcontent .course .k3 .widget-header > span {
    background-color: #3d7fff;
}

._khomeview .lecturepanel .wrapcontent .course .widget > .widget-header {
    margin: 0px 0px 20px;
    text-align: left;
    padding-left: 70px;
    min-height: 60px;
}

._khomeview .lecturepanel .wrapcontent .course .widget-header > h4,
._khomeview .lecturepanel .wrapcontent .course .widget-header > h5 {
    font-family: 'Binggrae';
    font-weight: bold;
    font-size: 22px;
}

._khomeview .lecturepanel .wrapcontent .course .widget-header > h4 > span,
._khomeview .lecturepanel .wrapcontent .course .widget-header > h5 > span {
    position: relative;
    display: inline-block;
}

._khomeview .lecturepanel .wrapcontent .course .widget-body .lecture {
    display: inline-block;
    width: 100%; 
    height: 0;
    margin-bottom: 20px;
    border: 1px solid #ddd;
    border-radius: 15px;
    background-color: #fff;
    cursor: pointer;
    padding-bottom: 99%;
}

._khomeview .lecturepanel .wrapcontent .course .widget-body .lecture.btn-new {
    position: relative;
    background-color: rgba(255, 255, 255, .5);
    border-style: dashed;
    border-color: #ddd;
    color: #f72121;
    display: none;
}

._khomeview .lecturepanel .wrapcontent .course .edit .widget-body .lecture.btn-new {
    display: inline-block;
}

._khomeview .lecturepanel .wrapcontent .widget .lock {
    -webkit-filter: grayscale(.7);
    filter: grayscale(.7);
}

._khomeview .lecturepanel .wrapcontent .course .widget-body .lecture.btn-new > i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

._khomeview .lecturepanel .wrapcontent .course .widget-body .row .lesson.lock::before,
._khomeview .lecturepanel .wrapcontent .course .widget-body .row .lecture.lock::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .1);
    border-radius: 15px;
}

._khomeview .lecturepanel .wrapcontent .course .widget-body .row .lesson.lock::after,
._khomeview .lecturepanel .wrapcontent .course .widget-body .row .lecture.lock::after {
    font-family: "Font Awesome 5 Pro"; 
    font-weight: 900;
    content: '\f023';
    position: absolute;
    font-size: 50px;
    color: #fff;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: .8;
    text-shadow: 1px 1px 5px #333;
    z-index: 1;
}

._khomeview .lecturepanel .wrapcontent .course .widget-body .row .lesson.lock:hover::after,
._khomeview .lecturepanel .wrapcontent .course .widget-body .row .lecture.lock:hover::after {
    color: #eee;
}

._khomeview .lecturepanel .wrapcontent .widget .widget-body .lesson.lock:hover > .title,
._khomeview .lecturepanel .wrapcontent .widget .widget-body .lecture.lock:hover > .title {
    background-color: #333;
}

._khomeview .lecturepanel .wrapcontent .course .widget-body.open .lecture {
}

._khomeview .lecturepanel .wrapcontent .widget.edit .widget-body .lecture:hover > .option {
    display: inline-block;
}

._khomeview .lecturepanel .wrapcontent .widget .widget-body .lecture > .option .btn {
    color: #fff;
}

._khomeview .lecturepanel .wrapcontent .course .widget-body .lecture > .title {
    line-height: 30px;
    display: none;
    text-align: center;
    background-color: #aaa;
    color: #fff;
    font-family: "Binggrae";
    font-weight: bold;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 10px;
}

._khomeview .lecturepanel .wrapcontent .widget .widget-body .lecture.lock > .title {
    background-color: #aaa;
}

._khomeview .lecturepanel .wrapcontent .k1 .widget-body .lecture > .title {
    background-color: #fbb737;
}

._khomeview .lecturepanel .wrapcontent .k2 .widget-body .lecture > .title {
    background-color: #29ade4;
} 

._khomeview .lecturepanel .wrapcontent .k3 .widget-body .lecture > .title {
    background-color: #f25252;
}

/*********** lecture *************/

.lesson-panel.kids-panel > .wrapcontent {
}



/*********** dabisu_theory *************/


._khomeview .article-image-box .image-box-desc {
    font-size: 15px;
    line-height: 25px;
    margin: 10px 0;
}


/*********** lesson *************/

._khomeview .lessonpanel > .info {
    background: #FFF url(/skins/default/images/kids/bg_header_program.jpg) left bottom -30px/auto 130%;
}

._khomeview[name=hangul_lesson] .lessonpanel > .info {
    background: #FFF url(/skins/default/images/kids/bg_header_kids.jpg) left bottom -30px/auto 130%;
}

._khomeview .lessonpanel > .info .wrap {
    padding: 20px 50px;
    position: relative;
    min-height: 200px;
}

._khomeview .lessonpanel > .info .thumb {
    position: absolute;
    bottom: -30px;
    left: 100px;
    width: 150px;
    height: 150px;
    background-color: #4d5166;
    border: 5px solid #fff;
    border-radius: 15px;
}

._khomeview .lessonpanel > .info .prop {
    position: absolute;
    left: 270px;
    bottom: 0px;
}

._khomeview .lessonpanel > .info h1.title {
    font-size: 20px;
    font-family: "Binggrae";
    font-weight: bold;
    color: #fff;
    text-shadow: 1px 1px 2px #999;
}

._khomeview .lessonpanel > .info .prop::before {
}

._khomeview .lessonpanel > .info .title > span {
    display: inline-block;
    border-radius: 10px;
    padding: 5px 10px;
    margin-right: 5px;
    background-color: #0f798c;
    color: #fff;
}

._khomeview .lessonpanel.hangul > .info .title > span {
    background-color: #dc3b7f;
}

._khomeview .lessonpanel > .info p.desc {
    font-size: 17px;
    line-height: 25px;
    position: relative;
}

._khomeview > .contentpanel.lessonpanel > .wrapcontent {
    padding: 0 20px;
}

._khomeview > .contentpanel.lessonpanel > .wrapcontent .tab-pane .guide-panel {
    padding: 0 100px;
}



._khomeview .stepbx {
}

._khomeview .stepbx > h1::before {
    content: '';
    position: absolute;
    width: 80px;
    height: 100px;
    top: -35px;
    left: 5px;
}

.stepbx.dabisu > h1::before {
    background: url(/skins/default/images/home/kids/characters/cha_006.png) no-repeat center center/contain;
}

.stepbx.hangul > h1::before {
    background: url(/skins/default/images/home/kids/hangul_char005.png) no-repeat center center/contain; 
}

._khomeview .stepbx > h1 {
    position: relative;
    margin-top: 50px;
    margin-left: 90px;
    padding-left: 90px;
    font-family: "Binggrae";
    font-weight: bold;
    font-size: 20px;
}

._khomeview .stepbx > .desc {
    padding-left: 90px;
    margin-left: 90px;
}

._khomeview .stepbx > ul {
    text-align: center;
    padding: 10px 0px;
}

._khomeview .stepbx ul > li {
    position: relative;
    display: inline-block;
    margin: 10px;
}

._khomeview .stepbx ul > li {
    margin: 10px 20px;
}

._khomeview[name=dabisu_lesson] .stepbx ul > li::before {
    content: "";
    display: inline-block;
    width: 120px;
    height: 120px;
    background-color: #ffbd78;
    border-radius: 50%;
}

._khomeview .stepbx ul > li:not(:last-child)::after {
    right: -30px;
}

._khomeview .stepbx ul > li:not(:last-child)::after {
    font-family: "Font Awesome 5 Pro"; 
    font-weight: 900;
    content: '\f0da';
    position: absolute;
    top: 30%;
    right: -30px;
    font-size: 30px;
    color: #aaa;
}

._khomeview[name=dabisu_lesson] .stepbx ul > li.step1::before {
    background: #f8c159 url(/skins/default/images/home/kids/characters/cha_001.png) no-repeat center center/60% auto;
}

._khomeview[name=dabisu_lesson] .stepbx ul > li.step2::before {
    background: #4ebd5a url(/skins/default/images/home/kids/characters/cha_002.png) no-repeat center center/60% auto;
}

._khomeview[name=dabisu_lesson] .stepbx ul > li.step3::before {
    background: #e96990 url(/skins/default/images/home/kids/characters/cha_003.png) no-repeat center center/60% auto;
}

._khomeview[name=dabisu_lesson] .stepbx ul > li.step4::before {
    background: #4893d6 url(/skins/default/images/home/kids/characters/cha_004.png) no-repeat center center/60% auto;
}

._khomeview[name=dabisu_lesson] .stepbx ul > li.step5::before {
    background: #aa5fdd url(/skins/default/images/home/kids/characters/cha_005.png) no-repeat center center/60% auto;
}

._khomeview .stepbx ul > li > .no {
    position : absolute;
    top: -5px;
    left: -5px;
    font-size: 22px;
    font-weight: 600;
    color: #fff;
    background-color: #ff8250;
    padding: 10px;
    border-radius: 25px;
    box-shadow: 1px 1px 1px #333;
}

._khomeview .stepbx ul > li > h5 {
    font-size: 17px;
}

._khomeview .stepbx ul > li > .subject {
    font-size: 17px;
    font-weight: 600;
}

._khomeview[name=hangul_lesson] .stepbx ul > li {
    padding: 70px 0px 35px;
    width: 150px;
}

._khomeview[name=hangul_lesson] .stepbx ul > li > .no {
    top: 0px;
    left: 0px;
    font-size: 20px;
    padding: 7px;
    background-color: #418c69;
}

._khomeview[name=hangul_lesson] .stepbx ul > li > h5 {
    color: #fff;
}

._khomeview[name=hangul_lesson] .stepbx ul > li > .subject {
    color: #ffcb00;
}

._khomeview[name=hangul_lesson] .stepbx ul > li:not(:last-child)::after {
    top: 60%;
}

._khomeview[name=hangul_lesson] .stepbx ul > li.step1 {
    background: url(/skins/default/images/home/kids/hangul_001.png) no-repeat bottom center/100% auto, url(/skins/default/images/home/kids/hangul_char004.png) no-repeat top 20px center/40% auto
}

._khomeview[name=hangul_lesson] .stepbx ul > li.step2 {
    background: url(/skins/default/images/home/kids/hangul_001.png) no-repeat bottom center/100% auto, url(/skins/default/images/home/kids/hangul_char001.png) no-repeat top center/35% auto
}

._khomeview[name=hangul_lesson] .stepbx ul > li.step3 {
    background: url(/skins/default/images/home/kids/hangul_001.png) no-repeat bottom center/100% auto, url(/skins/default/images/home/kids/hangul_char002.png) no-repeat top center/40% auto
}

._khomeview[name=hangul_lesson] .stepbx ul > li.step4 {
    background: url(/skins/default/images/home/kids/hangul_001.png) no-repeat bottom center/100% auto, url(/skins/default/images/home/kids/hangul_char003.png) no-repeat top center/48% auto
}

._khomeview .weeks.guidepanel {
    width: 80%;
    margin: 0 auto;
}

._khomeview .weeks.guidepanel .week {
    margin: 80px 0;
}

._khomeview .weeks.guidepanel .week .box {
    position: relative;
    border: 2px solid #ef5282;
    margin-top: 30px;
    border-radius: 20px;
    padding: 0px 50px 20px;
}

._khomeview .weeks.guidepanel .week h2 {
    position: relative;
    top: -25px;
    margin: 0 auto;
    overflow: initial !important;
}

._khomeview .weeks.guidepanel .week.week1 h2 > span {
    background-color: #ffa700;
}

._khomeview .weeks.guidepanel .week.week2 h2 > span {
    background-color: #1ac62d;
}

._khomeview .weeks.guidepanel .week.week3 h2 > span {
}

._khomeview .weeks.guidepanel .week.week4 h2 > span {
    background-color: #4796db;
}

._khomeview .weeks.guidepanel .week.week5 h2 > span {
    background-color: #994ace;
}

._khomeview .weeks.guidepanel .week.week1 .box {
    border-color: #ffa700;
}

._khomeview .weeks.guidepanel .week.week2 .box {
    border-color: #1ac62d;
}

._khomeview .weeks.guidepanel .week.week3 .box {
}

._khomeview .weeks.guidepanel .week.week4 .box {
    border-color: #4796db;
}

._khomeview .weeks.guidepanel .week.week5 .box {
    border-color: #994ace;
}

._khomeview .weeks.guidepanel .week .step6 .no {
    background: #ffa700 url(/skins/default/images/home/kids/characters/goddness.png) no-repeat center center/70% auto;
}

._khomeview .weeks.guidepanel .week .stepbx.step1 .no {
    background: #ffa700 url(/skins/default/images/home/kids/characters/cha_001.png) no-repeat center center/80% auto;
}

._khomeview .weeks.guidepanel .week .stepbx.step2 .no {
    background: #1ac62d url(/skins/default/images/home/kids/characters/cha_002.png) no-repeat center center/70% auto;
}

._khomeview .weeks.guidepanel .week .stepbx.step3 .no {
    background: #ef5282 url(/skins/default/images/home/kids/characters/cha_003.png) no-repeat center center/70% auto;
}

._khomeview .weeks.guidepanel .week .stepbx.step4 .no {
    background: #4796db url(/skins/default/images/home/kids/characters/cha_004.png) no-repeat center center/70% auto;
}

._khomeview .weeks.guidepanel .week .stepbx.step5 .no {
    background: #994ace url(/skins/default/images/home/kids/characters/cha_005.png) no-repeat center center/70% auto;
}

._khomeview .weeks.guidepanel .week .step1 .title .no {
    background-color: #ffa700;
}

._khomeview .weeks.guidepanel .week .step2 .title {
    background-color: #1ac62d;
}

._khomeview .weeks.guidepanel .week .step3 .title {
}

._khomeview .weeks.guidepanel .week .step4 .title {
    background-color: #4796db;
}

._khomeview .weeks.guidepanel .week .step5 .title {
    background-color: #994ace;
}

._khomeview .weeks.guidepanel.hangul .week .stepbx.step1 .no {
    background: transparent url(/skins/default/images/home/kids/hangul_char004.png) no-repeat center center/80% auto;
}

._khomeview .weeks.guidepanel.hangul .week .stepbx.step2 .no {
    background: transparent url(/skins/default/images/home/kids/hangul_char001.png) no-repeat center center/60% auto;
}

._khomeview .weeks.guidepanel.hangul .week .stepbx.step3 .no {
    background: transparent url(/skins/default/images/home/kids/hangul_char002.png) no-repeat center center/70% auto;
}

._khomeview .weeks.guidepanel.hangul .week .stepbx.step4 .no {
    background: transparent url(/skins/default/images/home/kids/hangul_char003.png) no-repeat center center/70% auto;
}

._khomeview .weeks.guidepanel.hangul .week h5 {
    background: transparent url(/skins/default/images/home/kids/hangul_002.png) no-repeat center center/80% 100%;
    color: #fff;
    text-align: center;
}

._khomeview .weeks.guidepanel .week .step6 > .no,
._khomeview .weeks.guidepanel .week .stepbx .no {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    opacity: 1;
    z-index: 1;
    padding: 0px;
}

._khomeview .weeks.guidepanel .week .step6 > .no {
    position: absolute;
}

._khomeview .weeks.guidepanel.hangul .week .step6 > .no {
  display: none;
}

._khomeview .weeks.guidepanel.hangul .week h5 > .title {
  padding: 7px 60px;
  width: 120px;
  color: #fff;
  line-height: 50px;
  border-radius: 20px;
  font-size: 14px;
  font-family: "Binggrae";
  font-weight: bold;
  opacity: 1;
}

._khomeview .weeks.guidepanel.dabisu .week h5 > .title {
  padding: 7px 60px;
  background-color: #ef5282;
  width: 120px;
  color: #fff;
  line-height: 50px;
  border-radius: 20px;
  font-size: 14px;
  font-family: "Binggrae";
  font-weight: bold;
}

._khomeview .weeks.guidepanel .week .descbx {
    min-height: 100px;
}

._khomeview .weeks.guidepanel .week h2 {
  padding: 0 10px;
  font-size: 14px;
  font-family: "Binggrae";
  font-weight: bold;
}

._khomeview .weeks.guidepanel .week h2 > span {
  display: inline-block;
  padding: 7px 7px 7px 15px;
  background-color: #ef5282;
  width: 120px;
  color: #fff;
  border-radius: 20px;
}

._khomeview .weeks.guidepanel.hangul .week h2 > .no {
    top: 0px;
    border-radius: 0px;
}

._khomeview .weeks.guidepanel .week h2 > .title {
    display: block;
    width: 100%;
    line-height: 40px;
    font-size: 20px;
    padding-left: 30px;
    opacity: 1;
}

._khomeview .weeks.guidepanel.hangul .week h2 > .title {
    line-height: 50px;
}

._khomeview .weeks.guidepanel .week .box .content {
    margin: 0px;
    min-height: 135px;
    cursor: pointer;
    font-size: 15px;
    line-height: 22px;
}

._khomeview .weeks.guidepanel .week .box .content .table {
    font-size: 15px;
}

._khomeview .weeks.guidepanel .week .box .content .items {
    text-align: center;
}

._khomeview .weeks.guidepanel .week .box .content .items .item {
    display: inline-block;
    width: 400px;
    margin: 0px auto 20px;
    padding-bottom: 300px;
    position: relative;
}

._khomeview .edit .weeks.guidepanel .week .box .content .items .btn-add {
    display: inline-block;
}

._khomeview .weeks.guidepanel .week .box .content .items .btn-add {
    border: 1px dashed #ddd;
    display: none;
}

._khomeview .weeks.guidepanel .week .box .content .items .btn-add > i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


/*********** learn *************/
/*
.modal textarea,
#popup-comment .postbx textarea {
    border: 1px solid #ddd;
    width: 100%;
    padding: 5px;
    height: 200px;
}

#popup-comment .pic {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #EFEFEF;
    float: left;
}

#popup-comment form .body {
    margin-left: 80px;
    overflow: hidden;
}
*/

._khomeview[name=learn] > .contentpanel.lessonpanel > .wrapcontent {
    padding: 0 40px;
}

.viewer {
    background-color: #000;
}

.viewer > .wrap.mission {
    text-align: center;
}

.contentpanel .wrap_player {
    max-width: 100%;
    width: 854px;
    height: 480px;
    margin: 0 auto;
}

.contentpanel .wrap_mission {
    max-width: 100%;
    width: 800px;
    height: 400px;
    margin: 0 auto;
    display: block;
}

.contentpanel .wrap_player .plyr {
    height: 100%;
}

.contentpanel .wrap_player .plyr__video-wrapper {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 100%;
}

.contentpanel .wrap_player .plyr video {
    height: 100%;
}

.player {
}

.lessonpanel .lpanel {
    min-height: 400px;
    width: 700px;
    float: left;
    padding: 5px;
    position: relative;
}

.lessonpanel .rpanel {
    margin-left: 705px;
    min-height: 400px;
    overflow: hidden;
}

.lessonpanel .wrapcontent h3 {
    margin: 15px 0;
    line-height: 33px;
}

.lessonpanel .wrapcontent h4 {
    font-size: 15px;
}

.lessonpanel .wrapcontent h4 > span.more {
    font-weight: normal;
    font-size: 13px;
    float: right;
}

.lessonpanel .wrapcontent .title {
    position: relative;
}

.lessonpanel .wrapcontent .title > .option {
    position: absolute;
    top: 0px;
    right: 10px;
    display: none;
}

.lessonpanel.edit .wrapcontent .info:hover .title > .option {
    display: inline-block;
}

.lessonpanel.edit .wrapcontent .title > .option {
}

.lessonpanel .wrapcontent .title > .option > .btn {
    color: #333;
    text-shadow: none;
}

.lessonpanel .wrapcontent .info .title {
    padding-right: 50px;
}

.lessonpanel .wrapcontent .info .body {
    background-color: #fafafa;
    padding: 5px;
    border-top: 2px solid #ddd;
}

.lessonpanel .wrapcontent .menu {
    text-align: right;
    padding: 10px 0;
}

.lessonpanel .wrapcontent .menu a {
    margin-right: 10px;
    color: #333;
}

.lessonpanel .wrapcontent .lpanel .desc {
    min-height: 100px;
    padding: 10px 0;
    line-height: 25px;
    font-size: 15px;
}

.attachment.items {
    padding: 10px 0;
}

.attachment.items > .item {
    width: 150px;
    height: 112px;
    padding-bottom: 15%;
    position: relative;
    float: left;
    cursor: pointer;
    border-radius: 3px;
    margin-left: 15px;
    margin-bottom: 15px;
}

.edit .attachment.items > .item:hover > .option {
    display: inline-block;
}

.attachment.items > .item:first-child {
    margin-left: 0px;
}

.attachment.items > .item .icon {
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    color: #fff;
    border-radius: 5px;
    opacity: .5;
    background-color: #333;
    padding: 10px;
    display: none;
}

.attachment.items > .item:hover .icon {
    display: inline-block;
}

.attachment.items > .item .title {
    position: absolute;
    left: 0px;
    bottom: 0px;
    display: block;
    padding: 5px;
    background-color: #000;
    opacity: .5;
    width: 100%;
    color: #fff;
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.attachment.items > .btn-add {
    padding: 7px 10px;
    border: 1px dashed #ddd;
    color: #d97979;
    border-radius: 5px;
    display: none;
}

.lessonpanel .wrapcontent .review {
    min-height: 200px;
    border-top: 1px solid #ddd;
    margin-bottom: 20px;
}

.lessonpanel .wrapcontent .review .postbx {
    margin-bottom: 10px;
    background-color: #F9F9F9;
    padding: 10px;
}

.lessonpanel .wrapcontent .review .postbx .body {
    margin-left: 70px;
    overflow: hidden;
}

.modal textarea,
#popup-comment .postbx textarea,
.lessonpanel .wrapcontent .review .postbx textarea {
    border: 1px solid #ddd;
    width: 100%;
    padding: 5px;
    height: 200px;
}

.lessonpanel .wrapcontent .review .postbx textarea {
    height: 100px;
}

.lessonpanel .wrapcontent .review .form-group > label {
    display: none;
}

.lessonpanel .wrapcontent .review .form-group .col-sm-10 {
    width: 100%;
    padding: 0px;
}

.lessonpanel .wrapcontent .review .form-group .toolbar {
    display: none;
}

.lessonpanel .wrapcontent .review .postbx .cmd {
    padding: 7px 0;
}

.lessonpanel .wrapcontent .review .comments {
}

.lessonpanel .wrapcontent .review .comments .comment {
    margin-bottom: 10px;
    position: relative;
}

#popup-comment .pic,
.review .pic {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #EFEFEF;
    float: left;
}

.review .pic > img {
    width: 100%;
}

#popup-comment form .body,
.review .comments .comment > .body {
    margin-left: 80px;
    overflow: hidden;
}

.review .comments .comment > .body > .info {
    padding: 7px 0;
}

.review .comments .comment > .body > .msg {
    line-height: 22px;
}

.review .comments .comment > .items {
}

.review .comments .comment .items .item {
    width: 100px;
    height: 80px;
    position: relative;
    display: inline-block;
    margin: 5px 5px 5px 0;
    padding: 0px;
    cursor: pointer;
}

.review .comments .option {
    position: absolute;
    top: 10px;
    right: 10px;
    display: none;
}

.review .comments .option .btn {
    text-shadow: none;
    color: #333;
}

.review .comments .comment:hover {
}

.review .comments .comment:hover .option {
    display: inline-block;
}

.lessonpanel .wrapcontent .products {
    min-height: 200px;
    border-top: 1px solid #ddd;
}

.lessonpanel .wrapcontent .products .product {
    margin-bottom: 10px;
    box-shadow: none;
}

.src span[data-role="del"] {
    position: absolute;
    top: -5px;
    right: -5px;
    color: #333;
    font-size: 20px;
    cursor: pointer;
    z-index: 2;
    display: none;
}

.edit .src:hover span[data-role="del"] {
    display: inline-block;
}

.lessonpanel .wrapcontent .products .product .wrapthumb {
    overflow: hidden;
}

.lessonpanel .wrapcontent .products .product .thumb {
    padding-bottom: 90%;
    background-color: #F9F9F9;
    transition: all .2s ease;
}

.lessonpanel .wrapcontent .products .product:hover .thumb {
    transform: scale(1.2);
}

.lessonpanel .wrapcontent .products .product h5 {
}

.lessonpanel .wrapcontent .products .product .discount {
}

.lessonpanel .wrapcontent .products .product .price {
    text-decoration: line-through;
    color: red;
    font-size: 13px;
}

.lessonpanel .wrapcontent .products .btn-new {
    padding-bottom: 90%;
    margin-bottom: 10px;
    position: relative;
    background-color: rgba(255, 255, 255, .5);
    border: 1px dashed #ddd;
    color: #f72121;
    width: 100%;
    display: inline-block;
    transition: all .2s ease;
}

.lessonpanel .wrapcontent .products .product.btn-new:hover {
    background-color: #fcf3cb;
    font-size: 25px;
}

.lessonpanel .wrapcontent .products .btn-new > i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #d97979;
}

.lessonpanel .wrapcontent .next {
    margin-bottom: 10px;
}

.lessonpanel .wrapcontent .similar {
    border-top: 1px solid #ddd;
    margin-bottom: 10px;
}

.lessonpanel .wrapcontent .lessons {
    min-height: 200px;
}

.lessonpanel .wrapcontent .lessons .lesson {
    overflow: hidden;
    cursor: pointer;
}

.lessonpanel .wrapcontent .lessons .lesson > .thumb {
    width: 40%;
    padding-bottom: 30%;
    float: left;
    background-color: #F9F9F9;
    position: relative;
    margin-right: 5px;
}

.lessonpanel .wrapcontent .lessons .lesson > .thumb > .like {
    padding: 0px 5px;
    position: absolute;
    bottom: 5px;
    right: 5px;
    background-color: rgba(0, 0, 0, .8);
    color: #fff;
    border-radius: 5px;
    font-size: 10px;
}

.lessonpanel .wrapcontent .lessons .lesson > .thumb > .like > i {
    margin-right: 3px;
}

.lessonpanel .wrapcontent .lessons .lesson > .info {
    overflow: hidden;
}

.lessonpanel .wrapcontent .mentor {
    border-top: 1px solid #ddd;
}

.lessonpanel .wrapcontent .mentor .teachers {
}

.lessonpanel .wrapcontent .mentor .teacher {
    margin-bottom: 10px;
    cursor: pointer;
}

.lessonpanel .wrapcontent .mentor .teacher .pic {
    float: left;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #F9F9F9 url(/common/images/profile_tf.png) no-repeat center center/cover;
}

.lessonpanel .wrapcontent .mentor .teacher .pic.man {
    background: #F9F9F9 url(/common/images/profile_tm.png) no-repeat center center/cover;
}

.lessonpanel .wrapcontent .mentor .teacher .info {
    margin-left: 90px;
    overflow: hidden;
    line-height: 25px;
}

.lessonpanel .wrapcontent .mentor .teacher .info > span {
    display: block;
}

.lessonpanel .wrapcontent .mentor .teacher .info > .name {
    font-weight: 600;
}

.lessonpanel .wrapcontent .mentor .teacher .info > .rate {
}

.lessonpanel .wrapcontent .mentor .teacher .info > .rate > i.fa-star {
    color: #ef5382;
}


/*********** store *************/

._khomeview[name=store] .header {
}

._khomeview > .contentpanel > .banners {
    background-color: #F9F9F9;
}

._khomeview > .contentpanel > .banners.slick-slider {
    margin-bottom: 0px;
}

._khomeview > .contentpanel > .banners.slick-slider .slick-dots {
    bottom: 0px;
}

._khomeview > .contentpanel > .banners .banner {
    display: block;
    margin: 0 auto;
    height: 300px;
    outline: none;
}

._khomeview > .contentpanel > .wrapcontent .widget {
    margin: 30px 0;
    position: relative;
}

._khomeview > .contentpanel.storepanel > .wrapcontent .widget {
    min-height: 300px;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-header {
    border-bottom: none;
    margin: 10px 0px;
}

._khomeview > .storepanel > .wrapcontent .widget .widget-header {
    text-align: left;
    position: relative;
}

._khomeview > .storepanel > .wrapcontent .widget.side .widget-header {
    position: absolute;
    text-align: left;
    line-height: 40px;
    font-weight: normal;
}

._khomeview > .storepanel > .wrapcontent .widget .widget-header > span.title {
    padding: 5px 0;
    display: inline-block;
    font-weight: 600;
}

._khomeview > .storepanel > .wrapcontent .widget .widget-header > span.desc {
    display: block;
    font-size: 17px;
    font-weight: 300;
    color: #333;
    line-height: 40px;
}

._khomeview > .storepanel > .wrapcontent .widget .widget-header::after {
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body {
}

._khomeview > .contentpanel > .wrapcontent .widget.side .widget-body {
    padding-left: 300px;
}

._khomeview > .contentpanel > .wrapcontent .widget > .widget-body .resrcbx.items {
    margin-top: 0px;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .item {
    position: relative;
    cursor: pointer;
    margin-bottom: 20px;
    padding-bottom: 50%;
}

._khomeview > .storepanel > .wrapcontent .widget .widget-body .item {
    padding-bottom: 0;
    box-shadow: none;
}

._khomeview > .storepanel > .wrapcontent .widget .widget-body .item span[data-role=del] {
    position: absolute;
    right: -5px;
    font-size: 30px;
    top: -5px;
    z-index: 2;
    display: none;
    cursor: pointer;
}

._khomeview > .storepanel.edit > .wrapcontent .widget .widget-body .item:hover span[data-role=del] {
    display: inline-block;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .item > .rate {
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: #ef5382;
    color: #fff;
    text-align: center;
    padding: 5px 10px;
    line-height: 22px;
    z-index: 1;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .item > .rate::before {
    content: 'SAVE';
    display: block;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .item > .rate > span {
    font-weight: 600;
    font-size: 20px;
}

._khomeview[name=store] > .contentpanel > .wrapcontent .widget .widget-body .item > .thumb {
    overflow: hidden;
    padding: 0px;
}

._khomeview[name=store] > .contentpanel > .wrapcontent .widget .widget-body .item > .thumb > .cover {
    transition: all 0.3s ease-in-out;
    padding-bottom: 100%;
}

._khomeview[name=store] > .contentpanel > .wrapcontent .widget .widget-body .item:hover > .thumb > .cover {
    transform: scale(1.05);
}

._khomeview > .storepanel > .wrapcontent .widget .widget-body .item > .info {
    padding: 5px 5px 10px;
    height: 100px;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .item > .info > .title {
    line-height: 25px;
    font-size: 17px;
    font-weight: 300;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .item > .info > .price {
    text-decoration: line-through;
    color: red;
    font-size: 13px;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .item > .info > .discount {
    color: #000;
    font-size: 17px;
    font-weight: bold;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .cates {
    text-align: center;
    margin-bottom: 30px;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .cate {
    display: inline-block;
    padding: 10px 30px;
    background-color: #eee;
    border-radius: 30px;
    margin: 5px;
    cursor: pointer;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .cate:hover {
    background-color: #7989a8;
    color: #fff;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .cate.active {
    font-weight: 600;
    color: #fff;
    background-color: #28ade3;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .new > a {
    border: 1px dashed #ddd;
    color: #d97979;
    height: 0;
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
    padding-bottom: 100%;
    cursor: pointer;
    transition: all .2s ease;
    display: none;
}

._khomeview > .contentpanel.edit > .wrapcontent .widget .widget-body .new > a {
    display: block;
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .new > a > i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

._khomeview > .contentpanel > .wrapcontent .widget .widget-body .new:hover > a{
    background-color: #fcf3cb;
    font-size: 25px;
}

._khomeview[name=store_product] .header {
    box-shadow: 0 1px 5px rgba(0,0,0,0.1);
}

._khomeview .prodpanel {
}

._khomeview .prodpanel > .prodprop {
    background: #fff url(/skins/default/images/kids/bg_store.png) no-repeat center center/cover;
    padding: 20px 0;
}

._khomeview .prodpanel > .prodprop > .wrap {
}

._khomeview .prodpanel .prodinfo {
    background-color: #fff;
    padding: 20px;
    margin: 0px;
    border-radius: 10px;
}

._khomeview .prodpanel .pathinfo {
    line-height: 30px;
}

._khomeview .prodpanel .prodinfo .title {
    margin: 20px 0;
    font-size: 32px;
}

._khomeview .prodpanel .prodinfo .pic {
    height: 400px;
}

._khomeview .prodinfo .totalbx .price {
    font-size: 30px;
    line-height: 40px;
}

._khomeview .prodinfo .btnCart {
    background-color: #fff;
    border: 2px solid #333;
    border-radius: 50px;
}

._khomeview .prodinfo .btnOrder {
    background-color: #ee5281;
    color: #fff;
    border-radius: 50px;
}

._khomeview .prodpanel.fixed .prodinfo .cmd {
    position: fixed;
    width: 100%;
    left: 0px;
    bottom: 0px;
    z-index: 2;
    background-color: rgba(255, 255, 255, .9);
    box-shadow: 0 -3px 3px rgba(0, 0, 0, .3);
}

._khomeview .prodpanel.fixed .prodinfo .cmd > div.row {
    margin: 0 auto;
    max-width: 1120px;
    position: relative;
    padding: 10px;
}

._khomeview .prodpanel.fixed .prodinfo .cmd > div.row > div:first-child {
    text-align: right;
}

._khomeview .prodpanel.fixed .prodinfo .cmd > div.row > div {
    text-align: left;
}

._khomeview .prodpanel.fixed .prodinfo .cmd > div.row .btn {
    width: 200px;
    padding: 10px 15px;
    font-size: 17px;
}

._khomeview .prodpanel .tabs {
    position: relative;
    margin-top: 20px;
    box-shadow: 0 3px 0 rgb(0, 0, 0, .8);
    text-align: center;
}

._khomeview .prodpanel.fixed .tabs {
    position: fixed;
    top: 76px;
    left: 0px;
    width: 100%;
    z-index: 4;
    margin-top: 0px;
    background-color: #566aa4;
    box-shadow: none;
}

._khomeview .prodpanel.fixed .tabs a.active,
._khomeview .prodpanel.fixed .tabs a {
    color: #fff;
}

._khomeview .prodpanel .tabs a {
    cursor: pointer;
    padding: 15px 40px;
    position: relative;
    font-size: 17px;
    line-height: 22px;
    color: #aaa;
    display: inline-block;
}

._khomeview .prodpanel .tabs a.active {
    color: #000;
    background-color: rgba(255, 255, 255, .2);
}

._khomeview .prodpanel .tab-pane .spec {
    min-height: 700px;
}

._khomeview .prodpanel .tab-pane .desc {
    line-height: 30px;
    font-weight: 300;
}

._khomeview .prodpanel .review {
}

._khomeview .prodpanel .cnt {
    display: inline-block;
}

._khomeview .prodpanel .cnt::before {
    content: '(';
}

._khomeview .prodpanel .cnt::after {
    content: ')';
}

._khomeview .prodpanel .comments {
    position: relative;
    margin: 20px 5px;
}

._khomeview .prodpanel .comments .comment {
    padding: 10px 0;
    position: relative;
}

._khomeview .prodpanel .comments .comment:not(:first-child) {
    border-top: 1px dashed #ddd;
}

._khomeview .prodpanel .review .comments .row {
    line-height: 40px;
    border-bottom: 1px solid #efefef;
}

._khomeview .prodpanel .review .comments .row.article .rate {
    color: #ee5281;
}

._khomeview .prodpanel .review nav {
    padding: 10px 0;
    position: relative;
    text-align: right;
}

._khomeview .prodpanel .review nav .btn-review {
    background-color: #28ade3;
    color: #fff;
    border-radius: 50px;
    padding: 9px 25px;
}

/*********** review *************/

.stars {
    padding: 5px 0px;
}

.stars > i {
    color: #aaa;
    font-size: 15px;
    cursor: pointer;
}

.stars > i.active {
    color: #ee5281;
}

/*********** dabisu *************/


.homeview .article-image-box {
  margin-bottom: 58px;
}

.homeview .article-image-box .left {
  float: left;
  width: 50%;
}

.homeview .article-image-box .right {
  float: right;
  width: 50%;
}

.homeview .article-image-box figure.learn_figure {
  display: table-cell;
  vertical-align: bottom;
  height: 600px;
  text-align: right;
}

.homeview .article-image-box figure {
  text-align: right;
}

.homeview .article-image-box .image-box-title {
  margin: 35px 0px 20px;
  color: #3b3b3b;
  font-size: 30px;
  font-weight: 700;
  line-height: 1em;
  white-space: nowrap;
  letter-spacing: -0.06em;
}

.homeview .article-box > .title > b,
.homeview .article-image-box .image-box-title strong {
  color: #ff6600;
}

.homeview .article-image-box .image-box-subtitle {
  font-size: 20px;
  line-height: 50px;
}

.homeview .article-image-box .figure img {
  max-width: 80%;
}

.homeview .article-image-box .figure figcaption {
  display: none;
}

.homeview .video-box {
  border-radius: 5px;
  background-color: #ddd;
  padding: 10px;
  margin: 20px 0px;
}

.homeview .video-box > video {
  width: 100%;
  height: auto;
}

.homeview .article-image-box:after {
  clear: both;
  content: '';
  display: table;
}

.homeview .article-body {
  position: relative;
  margin: auto;
}

.homeview .article-body:after {
  clear: both;
  content: '';
  display: table;
}

.homeview .article-body .wrap-article-body {
  max-width: 850px;
  margin: 0 auto;
  padding: 0 10px;
}

.homeview .article-body.article-body-green {
  max-width: 1830px;
  background: #41af84;
  margin-top: -40px;
  padding-top: 20px;
  padding-bottom: 50px;
}

.homeview .article-body.article-body-green:before {
  content: '';
  width: 100%;
  background-image: url(/skins/default/images/home/program/program_baseline_green.png);
  background-repeat: no-repeat;
  display: block;
  position: absolute;
  height: 38px;
  top: -38px;
}

.homeview .article-body.article-body-gray {
  max-width: 1830px;
  background: #efefef;
  margin-top: -40px;
  padding-top: 20px;
}

.homeview .article-effect .article-body.article-body-gray {
  margin-top: -50px;
}

.homeview .article-body.article-body-gray:before {
  content: '';
  width: 100%;
  background-image: url(/skins/default/images/home/program/program_baseline_gray.png);
  background-repeat: no-repeat;
  display: block;
  position: absolute;
  height: 38px;
  top: -38px;
}

.article-body.article-body-dark {
  max-width: 1830px;
  background: #94a2ab;
  margin-top: -40px;
  padding-top: 40px;
}

.homeview .article-body.article-body-dark:before {
  content: '';
  width: 100%;
  background-image: url(/skins/default/images/home/program/program_baseline_dark.png);
  background-repeat: no-repeat;
  display: block;
  position: absolute;
  height: 38px;
  top: -38px;
}

.homeview .article-body.article-body-darkblue {
  max-width: 1830px;
  background: #4c5e96;
  padding-top: 84px;
}

.homeview .article-body.article-body-darkblue:before {
  content: '';
  width: 100%;
  background-image: url(/skins/default/images/home/program/program_baseline_darkblue.png);
  background-repeat: no-repeat;
  display: block;
  position: absolute;
  height: 38px;
  top: -38px;
}

.homeview .program-box {
  margin-bottom: 10px;
}

.homeview .program-box .program-box-header {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: 26px;
  font-weight: 800;
  line-height: 73px;
}

.homeview .program-box .program-box-body {
  padding: 20px 10px;
  background: #fff;
  text-align: center;
}

.homeview .program-box .program-box-body .figures:after {
  clear: both;
  content: '';
  display: table;
}

.homeview .program-box .program-box-footer {
  position: relative;
  padding: 25px 50px 25px 150px;
  color: #333;
  font-size: 15px;
  line-height: 20px;
  font-weight: 300;
  background: #f8f8f8;
  border-top: 1px dashed #d2d2d2;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  border-bottom: 5px solid #dadada;
}

.homeview .program-box .program-box-footer .label {
  position: absolute;
  top: 25px;
  left: 50px;
  font-size: 18px;
  color: #fff;
  padding: 8px 15px;
  border-radius: 14px;
}

.homeview .program-box.program-box-1 .program-box-header {
  background-image: url(/skins/default/images/home/program/program_box_header_1.jpg);
}

.homeview .program-box.program-box-1 .label {
  background: #22644a;
}

.homeview .program-box.program-box-2 .program-box-header {
  background-image: url(/skins/default/images/home/program/program_box_header_2.jpg);
}

.homeview .program-box.program-box-2 .label {
  background: #1a6c96;
}

.homeview .program-box.program-box-3 .program-box-header {
  background-image: url(/skins/default/images/home/program/program_box_header_3.jpg);
}

.homeview .program-box.program-box-3 .label {
  background: #7a5e9a;
}

.homeview .program-box.program-box-4 .program-box-header {
  background-image: url(/skins/default/images/home/program/program_box_header_4.jpg);
}

.homeview .program-box.program-box-4 .label {
  background: #e0a700;
}

.homeview .program-box .program-box-body .figures {
  margin: 0 0 0 -15px;
  padding: 0;
  list-style: none;
  font-size: 0px;
  display: inline-block;
}

.homeview .program-box .program-box-body .figures > li {
  display: inline-block;
  position: relative;
  margin-left: 15px;
  margin-bottom: 15px;
  width: 18%;
}

.homeview .program-box .program-box-body .figures > li figure {
  display: block;
  background: #fff;
  padding: 0;
  margin: 0;
  position: relative;
  width: 100%;
}

.homeview .program-box .program-box-body .figures > li figure img {
  width: 100%;
  display: block;
  border: 4px solid #eaeaea;
  border-bottom: 0px;
  border-top-left-radius: 14px;
  border-top-right-radius: 14px;
}

.homeview .program-box .program-box-body .figures > li figure figcaption {
  display: block;
  color: #333;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  background: #eaeaea;
  padding: 15px 0px;
  border-bottom-left-radius: 14px;
  border-bottom-right-radius: 14px;
  border-bottom: 4px solid #d2d2d2;
}

.homeview .concept-box {
  max-width: 800px;
  margin: auto;
  position: relative;
  margin-bottom: 25px;
}

.homeview .concept-box.concept-desc {
  color: #fff;
  font-size: 15px;
  line-height: 30px;
}

.homeview .concept-box.concept-desc span {
  color: #ffe400;
  font-weight: 900;
}

.homeview .wrappanel > section.body > .rpanel .concept-box.concept-desc p {
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  padding: 10px;
  margin: 20px 0px;
  color: #ffc600;
  font-weight: bold;
  font-size: 20px;
  line-height: 30px;
}

.homeview .concept-box .box-header {
  position: relative;
  height: 73px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

.homeview .concept-box .box-header .box-header-title {
  color: #fff;
  font-size: 26px;
  font-weight: 800;
  text-align: center;
  height: 73px;
  width: 100%;
  line-height: 73px;
}

.homeview .concept-box .box-header .label-concept {
  position: absolute;
  top: 0px;
  left: 0px;
}

.homeview .concept-box .box-body {
  background: #fff;
  padding: 30px 25px;
  border-bottom: 4px solid #dadada;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  overflow: hidden;
  position: relative;
  min-height: 250px;
}

.homeview .concept-box .box-body > figure {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.homeview .concept-box .box-body > p,
.homeview .wrappanel > section.body > .rpanel .concept-box .box-body > p {
  border: 5px solid #eee;
  border-radius: 10px;
  margin-left: 250px;
  padding: 20px;
  font-size: 17px;
  line-height: 30px;
  color: #000;
}

.homeview .concept-box .box-body > p > img {
  margin: 0 auto;
}

.homeview .wrappanel > section.body > .rpanel .concept-box.concept-box-05 .box-body > p {
  margin-left: 350px;
}


.homeview .concept-box.concept-box-01 .box-header {
  background: url(/skins/default/images/home/program/program_concept_head01_01.png) top left no-repeat, url(/skins/default/images/home/program/program_concept_head01_02.png) top right no-repeat, url(/skins/default/images/home/program/program_concept_head01_02.png) top left repeat-x;
}

.homeview .concept-box.concept-box-02 .box-header {
  background: url(/skins/default/images/home/program/program_concept_head02_01.png) top left no-repeat, url(/skins/default/images/home/program/program_concept_head02_02.png) top right no-repeat, url(/skins/default/images/home/program/program_concept_head02_02.png) top left repeat-x;
}

.homeview .concept-box.concept-box-03 .box-header {
  background: url(/skins/default/images/home/program/program_concept_head03_01.png) top left no-repeat, url(/skins/default/images/home/program/program_concept_head03_02.png) top right no-repeat, url(/skins/default/images/home/program/program_concept_head03_02.png) top left repeat-x;
}

.homeview .concept-box.concept-box-04 .box-header {
  background: url(/skins/default/images/home/program/program_concept_head04_01.png) top left no-repeat, url(/skins/default/images/home/program/program_concept_head04_02.png) top right no-repeat, url(/skins/default/images/home/program/program_concept_head04_02.png) top left repeat-x;
}

.homeview .concept-box.concept-box-05 .box-header {
  background-image: url(/skins/default/images/home/program/program_concept_head05.jpg);
  background: url(/skins/default/images/home/program/program_concept_head05_01.png) top left no-repeat, url(/skins/default/images/home/program/program_concept_head05_02.png) top right no-repeat, url(/skins/default/images/home/program/program_concept_head05_02.png) top left repeat-x;
}

.homeview .program-concept {
  color: #fff;
}

.homeview .program-concept .concept-subtitle {
  font-size: 25px;
  color: #fff;
  font-weight: 700;
  margin: 0;
  line-height: 1em;
  margin-bottom: 10px;
}

.homeview .program-concept .deco {
  position: absolute;
}

.homeview .program-concept .deco.deco01 {
  top: -94px;
  right: 10px;
}

.homeview .program-concept .deco.deco02 {
  top: 850px;
  left: -150px;
}

.homeview .program-concept .deco.deco03 {
  top: 1250px;
  right: -20px;
}

.homeview .concept-box {
  max-width: 800px;
  margin: auto;
  position: relative;
  margin-bottom: 25px;
}

.homeview .concept-box.concept-desc {
  color: #fff;
  font-size: 15px;
  line-height: 30px;
}

.homeview .concept-box.concept-desc span {
  color: #ffe400;
  font-weight: 900;
}

.homeview .wrappanel > section.body > .rpanel .concept-box.concept-desc p {
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  padding: 10px;
  margin: 20px 0px;
  color: #ffc600;
  font-weight: bold;
  font-size: 20px;
  line-height: 30px;
}

.homeview .concept-box .box-header {
  position: relative;
  height: 73px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

.homeview .concept-box .box-header .box-header-title {
  color: #fff;
  font-size: 26px;
  font-weight: 800;
  text-align: center;
  height: 73px;
  width: 100%;
  line-height: 73px;
}

.homeview .concept-box .box-header .label-concept {
  position: absolute;
  top: 0px;
  left: 0px;
}

.homeview .concept-box .box-body {
  background: #fff;
  padding: 30px 25px;
  border-bottom: 4px solid #dadada;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  overflow: hidden;
  position: relative;
  min-height: 250px;
}

.homeview .concept-box .box-body > figure {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.homeview .concept-box .box-body > p,
.homeview .wrappanel > section.body > .rpanel .concept-box .box-body > p {
  border: 5px solid #eee;
  border-radius: 10px;
  margin-left: 250px;
  padding: 20px;
  font-size: 17px;
  line-height: 30px;
  color: #000;
}

.homeview .concept-box .box-body > p > img {
  margin: 0 auto;
}

.homeview .concept-box.concept-box-05 .box-body > p {
  margin-left: 350px;
}


.homeview .concept-box.concept-box-01 .box-header {
  background: url(/skins/default/images/home/program/program_concept_head01_01.png) top left no-repeat, url(/skins/default/images/home/program/program_concept_head01_02.png) top right no-repeat, url(/skins/default/images/home/program/program_concept_head01_02.png) top left repeat-x;
}

.homeview .concept-box.concept-box-02 .box-header {
  background: url(/skins/default/images/home/program/program_concept_head02_01.png) top left no-repeat, url(/skins/default/images/home/program/program_concept_head02_02.png) top right no-repeat, url(/skins/default/images/home/program/program_concept_head02_02.png) top left repeat-x;
}

.homeview .concept-box.concept-box-03 .box-header {
  background: url(/skins/default/images/home/program/program_concept_head03_01.png) top left no-repeat, url(/skins/default/images/home/program/program_concept_head03_02.png) top right no-repeat, url(/skins/default/images/home/program/program_concept_head03_02.png) top left repeat-x;
}

.homeview .concept-box.concept-box-04 .box-header {
  background: url(/skins/default/images/home/program/program_concept_head04_01.png) top left no-repeat, url(/skins/default/images/home/program/program_concept_head04_02.png) top right no-repeat, url(/skins/default/images/home/program/program_concept_head04_02.png) top left repeat-x;
}

.homeview .concept-box.concept-box-05 .box-header {
  background-image: url(/skins/default/images/home/program/program_concept_head05.jpg);
  background: url(/skins/default/images/home/program/program_concept_head05_01.png) top left no-repeat, url(/skins/default/images/home/program/program_concept_head05_02.png) top right no-repeat, url(/skins/default/images/home/program/program_concept_head05_02.png) top left repeat-x;
}

.homeview .article-effect .image-box-title {
  font-size: 48px;
}

/*********** store2 *************/

.homeview .wrappanel > .wrapcotent {
  margin: 20px auto;
  max-width: 1024px;
  position: relative;
  display: block;
  overflow: hidden;
  background-color: #fff;
}


/*********** footer *************/

._khomeview .footer {
  margin: 0 auto;
  width: 100%;
  display: block;
  overflow: hidden;
  position: relative;
  background-color: #fff;
  background-image: url(/skins/default/images/home/20190812_110.png);
  background-size: cover;
  background-position: center 10px;
  background-repeat: no-repeat;
}

._khomeview .footer > nav {
  margin: 0 auto;
  width: 95%;
  max-width: 1120px;
  position: relative;
  display: block;
  padding-top: 150px;
}

._khomeview .footer > nav li.menus a {
  display: inline-block;
  padding: 0 20px;
  line-height: 22px;
}

._khomeview .footer > nav li.menus a + a::before {
    content: '';
    display: inline-block;
    border-left: 1px solid rgba(255,255,255,.3);
}

._khomeview .footer > nav li.menus a {
  color: #fff;
}

._khomeview .footer > nav li.langbx {
    margin-top: -5px;
}

._khomeview .footer > section {
  margin: 0 auto;
  width: 95%;
  max-width: 1120px;
  position: relative;
  display: block;
  overflow: hidden;
  color: rgba(255,255,255,.6);
  font-size: 12px;
  padding: 20px 0 30px 190px;
}

._khomeview .footer > section > .logo {
  position: absolute;
  left: 50px;
  top: 20px;
  width: 120px;
  padding-top: 0px;
}

._khomeview .footer > section > p {
  margin: 0px;
  line-height: 20px;
  font-size: 13px;
  text-align: left;
}

@media screen and (min-width: 2000px) {
    ._khomeview > .contentpanel > .banners .banner {
        background-size: auto 100% !important;
    }
}

@media screen and (max-width: 1024px) {
    ._khomeview[name="_khome_default"] .header {
        height: 640px;
    }

    ._khomeview[name="_khome_default"] .header .bgbanners .bgbanner {
        height: 640px;
    }

    ._khomeview .header .bgbanners .titlebx {
        left: 50%;
        width: 90%;
    }

    ._khomeview .header .screen .wrapheader {
        width: auto;
    }

    ._khomeview[name=learn] > .contentpanel.lessonpanel > .wrapcontent {
        padding: 0 10px;
    }

    ._khomeview .header .screen .wrapheader .mainmnu .wrapmnu {
        width: auto;
    }

    ._khomeview .footer > nav {
        width: auto;
        max-width: auto;
    }

    ._khomeview .header .titlebx {
        left: 50%;
        width: 80%;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.introduce .wrap .content {
        top: 100px;
        right: 50px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.guide > .wrap .content {
        padding-left: 0px;
        width: 80%;
    }

    ._khomeview .prodpanel > .prodprop {
        background: none;
    }

    ._khomeview .stepbx ul > li {
        margin: 10px;
    }

    ._khomeview .stepbx ul > li:not(:last-child)::after {
        right: -20px;
    }

    .lessonpanel .lpanel {
        padding: 0px;
    }

    ._khomeview > .contentpanel .tab-content .wrapboard {
        margin: 0px;
    }

    ._khomeview > .contentpanel.lessonpanel > .wrapcontent .tab-pane .guide-panel {
        padding: 0 50px;
    }

    .wrapbanner {
        width: 100%;
    }
}

@media screen and (max-width: 1000px) {
  ._khomeview .header .screen {
    display: none;
  }

    ._khomeview[name=_khome_default] > .contentpanel > .section.hangul .wrap .content {
        left: 10px;
        width: 430px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.dabisu .wrap .content {
        right: 10px;
        width: 430px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.introduce .wrap {
        background-size: 50%;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.hangul > .wrap,
    ._khomeview[name="_khome_default"] > .contentpanel > .section.dabisu > .wrap {
        height: 400px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.dabisu > .wrap::before {
        width: 200px;
        height: 200px;
    }


  ._khomeview .header .mobile .wrapheader {
      display: block;
  }

  ._khomeview .footer > nav {
      padding-left: 0px;
      padding-top: 120px;
  }

  ._khomeview .footer > section {
      padding: 20px 0;
      text-align: center;
  }

  ._khomeview .footer > nav li {
      padding: 0 5px;
  }

  ._khomeview .footer > section > .logo {
      position: initial;
      margin: 0px 0px 20px;
  }

    ._khomeview[name=dabisu] .lecturepanel .intro .section1 {
        float: right;
        width: 400px;
        padding: 60px 10px 10px;
    }

    ._khomeview[name=dcode] .lecturepanel .intro .section1 {
        width: 400px;
        padding: 60px 10px 10px;
    }

    ._khomeview[name=hangul] .lecturepanel .intro .section1 {
        width: 400px;
        padding: 60px 10px 10px;
    }

    ._khomeview .lecturepanel .intro .section1 h1 {
        margin: 10px 0px 20px;
    }

    ._khomeview .prodpanel.fixed .tabs,
    ._khomeview .contentpanel .mtabs.fixed,
    ._khomeview .lecturepanel nav.fixed {
        top: 60px;
    }


    ._khomeview .lessonpanel .info .thumb {
        bottom: -20px;
        left: 50px;
        width: 120px;
        height: 120px
    }

    ._khomeview .lessonpanel .info .prop {
        left: 190px;
    }

    body ._khomeview[name=dabisu_lesson] .stepbx ul > li {
        margin: 10px;
    }

    body ._khomeview[name=dabisu_lesson] .stepbx ul > li::before {
        width: 110px;
        height: 110px;
    }

    body ._khomeview[name=dabisu_lesson] .stepbx ul > li::after {
        right: -20px;
    }

    ._khomeview[name="learn"] > .contentpanel.lessonpanel > .wrapcontent .lpanel {
        float: none;
        width: auto;
    }

    ._khomeview[name="learn"] > .contentpanel.lessonpanel > .wrapcontent .rpanel {
        margin-left: 0px;
    }

    ._khomeview > .storepanel > .wrapcontent .widget.side .widget-header {
        position: relative;
    }

    ._khomeview > .contentpanel > .wrapcontent .widget.side .widget-body {
        padding-left: 0px;
    }
    ._khomeview .weeks.guidepanel {
        width: 100%;
    }

    ._khomeview .weeks.guidepanel .week {
        margin: 0px;
    }

    ._khomeview .weeks.guidepanel .week .box {
        padding: 10px;
    }

    ._khomeview .stepbx > h1 {
        margin-left: 0px;
    }

    ._khomeview .stepbx > .desc {
        margin-left: 0px;
    }

    ._khomeview .helppanel > .banner > .wrap {
        padding: 60px 10px 10px;
    }

    ._khomeview .helppanel > .banner .box {
        position: initial;
        transform: initial;
    }

}

@media screen and (max-width: 640px) {
    ._khomeview .header .bgbanners .titlebx h1 {
        font-size: 30px;
        line-height: 37px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section .wrap .content h3 {
        font-size: 20px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section .wrap .content h3 > b {
        font-size: 30px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section > .wrap p {
        font-size: 15px;
        line-height: 23px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.introduce .wrap {
        height: 400px;
        background: none;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.introduce .wrap .content {
        width: 100%;
        padding: 0px 10px;
        top: 50%;
        left: 0px;
        transform: translateY(-50%);
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.dabisu .wrap .content, 
    ._khomeview[name="_khome_default"] > .contentpanel > .section.hangul .wrap .content {
        left: 0px;
        width: auto;
        padding: 0 10px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.hangul > .wrap,
    ._khomeview[name="_khome_default"] > .contentpanel > .section.dabisu > .wrap {
        background: none;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.dabisu > .wrap .content {
        right: 0px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.hangul > .wrap, 
    ._khomeview[name="_khome_default"] > .contentpanel > .section.dabisu > .wrap {
        height: 400px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.dabisu > .wrap::before {
        bottom: initial;
        top: -100px;
        width: 150px;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.guide > .wrap .content {
        width: 90%;
        margin: 10px auto;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.guide > .wrap .app_logo {
        display: none;
    }

    ._khomeview[name="_khome_default"] > .contentpanel > .section.guide > .wrap .desc {
        margin-left: 0px;
    }

  ._khomeview .lecturepanel .wrapcontent .course .widget {
      padding: 10px;
  }

  ._khomeview > .storepanel > .wrapcontent .widget .widget-body .item > .thumb {
  }

  ._khomeview > .storepanel > .wrapcontent .widget .widget-body .item > .info > .title {
      font-size: 13px;
  }

  ._khomeview .prodinfo .title {
      font-size: 27px;
  }

  ._khomeview .prodpanel .tabs {
      margin-top: 50px;
  }

  ._khomeview .prodpanel .tabs > ul > li > a {
      padding: 10px;
      margin-left: 10px;
      font-size: 17px;
  }

  ._khomeview > .contentpanel .intro .wrap {
      padding: 0px;
  }

    ._khomeview .lecturepanel.hangul .intro {
        background-size: cover;
    }

    ._khomeview[name=dabisu] .lecturepanel .intro .section1 {
        text-align: right;
    }
    
    ._khomeview[name=dabisu] .lecturepanel .intro .section1,
    ._khomeview[name=dcode] .lecturepanel .intro .section1,
    ._khomeview[name=hangul] .lecturepanel .intro .section1 {
        width: 100%;
        padding: 60px 10px 10px;
        background-color: rgba(255, 255, 255, .7);
        min-height: 300px;
    }

    ._khomeview .lecturepanel .intro .section1 h1 {
        font-size: 20px;
    }

    ._khomeview .lecturepanel .intro .section1 h5 {
        font-size: 15px;
        line-height: 25px;
    }

    ._khomeview .contentpanel .mtabs .nav-tabs > li > a {
        padding: 10px;
    }

    ._khomeview > .contentpanel.lessonpanel > .wrapcontent {
        padding: 0 10px;
    }

    ._khomeview .lessonpanel .info .prop {
        left: 0px;
        padding-left: 10px;
    }

    ._khomeview .lessonpanel .info .thumb {
        display: none;
    }

    ._khomeview .lessonpanel .info .prop > .title {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .fullbanner .wrap {
        max-width: 95%;
        max-height: 95%;
        min-width: 90%;
    }

    .fullbanner .wrap .banners {
        min-width: 90%;
    }

    body ._khomeview .stepbx ul > li > .no {
        font-size: 15px;
        padding: 5px;
    }


    body ._khomeview[name=dabisu_lesson] .stepbx ul > li::before {
        width: 80px;
        height: 80px;
    }

    body ._khomeview .stepbx > ul {
        white-space: nowrap;
        overflow-x: auto;
        padding: 10px 0px;
    }

    body ._khomeview .stepbx ul > li > h5 {
        font-size: 13px;
    }

    body ._khomeview .stepbx ul > li > .subject {
        font-size: 13px;
    }

    body ._khomeview .prodpanel .prodinfo .pic {
        background-size: contain !important;
    }

    ._khomeview .prodpanel.fixed .prodinfo .cmd > div.row .btn {
        width: 100%;
        padding: 7px 17px;
        font-size: 15px;
    }
    ._khomeview > .contentpanel > .banners > .banner {
        background: #F9F9F9 url(/skins/default/images/kids/store_banner01.jpg) no-repeat center center/cover;
    }

    ._khomeview .contentpanel.helppanel .wrapboard {
    }

    ._khomeview > .contentpanel.lessonpanel > .wrapcontent .tab-pane .guide-panel {
        padding: 0px;
    }

    ._khomeview .weeks.guidepanel .week .box .content .items .item {
        width: 100%;
        height: 75%;
    }

    ._khomeview .prodpanel .tabs a {
        padding: 15px;
    }

    .homeview .program-box .program-box-body .figures > li {
        width: 45%;
    }

    .homeview .program-box .program-box-footer {
          padding: 25px;
      }

    .homeview .program-box .program-box-footer .label {
        position: initial !important;
        display: block !important;
        margin-bottom: 20px !important;
    }
}