@charset "utf-8";

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	공통요소
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.enter {display: block;overflow: hidden;clear: both}

.h3-title {position: relative;display: block;overflow: hidden;line-height: 30px;font-size: 23px;color: #222;font-weight: 600;margin-bottom: 10px;padding-left: 8px;letter-spacing: -0.05em}
.h3-title:after {position: absolute;top: 6px;left: 0;width: 4px;height: 18px;background: #084e99;content: "";}

.h4-title {position: relative;display: block;overflow: hidden;line-height: 26px;font-size: 18px;color: #084e99;font-weight: 600;margin-bottom: 10px;padding-left: 10px;letter-spacing: -0.05em}
.h4-title:after {position: absolute;top: 11px;left: 0;width: 5px;height: 5px;border-radius: 50%;background: #084e99;content: "";}

.line-gap {position: relative;display: block;height: 4px;background: url("/static/images/design/content/pattern01.png") repeat-x;margin: 40px 0;overflow: hidden;clear: both;}

.grlineBox {position: relative;display: block;overflow: hidden;padding: 15px;background: #f6f6f6;border: 1px solid #ddd;}

.bixtitle {position: relative;display: block;background: #5c6269;padding: 7px 0;text-align: center;font-size: 15px;font-weight: 600;color: #fff;border-radius: 5px;margin-bottom: 10px}

/*평점*/
.rating {position: relative;display: inline-block;height: 25px;overflow: hidden}
.rating i {position: relative;float: left;width: 17px;height: 25px;margin-right: 2px;vertical-align: top;color: #cad0d6}
.rating i:after {position: absolute;top: 0;left: 0;width: 100%;height: 100%;line-height: 25px;content: "\f005";font-family: FontAwesome;font-style: normal;font-size: 14px;display: block}
.rating i.on {color: #084e99}

/*리스트 상단*/
.cont-total-box {position: relative;display: block;overflow: hidden;margin-bottom: 10px}
.cont-total-box .total {line-height: 34px}
.cont-total-box .btn_group {}

/*북 공통*/
.bookCoverBox {position: relative;overflow: hidden;width: 118px;height: 168px;background: #fff;border: 1px solid #c6c6c6}
.bookCoverBox .bookCoverTop {position: absolute;display: block;top: -5px;left: -1px;width: 100%;height: 5px;padding: 0 1px;background: url("/static/images/design/content/cover/bookCoverTop.png") repeat-x bottom}
.bookCoverBox .bookCoverRight {position: absolute;display: block;top:0;right: -5px;width: 5px;height: 100%;background: url("/static/images/design/content/cover/bookCoverRight.png") repeat-y right}
.bookCoverBox .bookCoverBottom {position: absolute;display: block;bottom: -5px;left: -1px;width: 100%;height: 5px;padding: 0 1px;background: url("/static/images/design/content/cover/bookCoverBottom.png") repeat-x top}
.bookCoverBox .bookCoverLeft {position: absolute;display: block;top:0;left: -5px;width: 5px;height: 100%;background: url("/static/images/design/content/cover/bookCoverLeft.png") repeat-y left}

.bookCoverBox .book {position: relative;width: 118px;height: 168px;}
.bookCoverBox .book a {position: relative;display: block;width: 100%;height: 100%;}
.bookCoverBox .book img {width: 118px;height: 168px;display: block;z-index: 0}
.bookCoverBox .book .coverSdLeft {position: absolute;display: block;top: 0;left: 0;width: 14px;height: 100%;background: url("/static/images/design/content/cover/coverSdLeft.png") repeat-y left;z-index: 10}
.bookCoverBox .book .coverSdRight {position: absolute;display: block;top: 0;right: 0;width: 14px;height: 100%;background: url("/static/images/design/content/cover/coverSdRight.png") repeat-y right;z-index: 10}

.bookCoverBox:hover .book a:after {position: absolute;display: block;top: 0;left: 0;width: 100%;height: 100%;background: rgba(12,35,57,0.6);content: "";z-index: 50}
.bookCoverBox:hover .book a:before {position: absolute;display: block;top: 50%;left: 50%;width: 70px;height: 28px;line-height: 26px;margin: -14px 0 0 -35px;content: "more +";
    text-align: center;font-size: 12px;color: #fff;border: 1px solid #fff;border-radius: 30px;z-index: 55}

.bookCoverBox.large {width: 200px;height: 288px;}
.bookCoverBox.large .book {width: 200px;height: 288px;}
.bookCoverBox.large .book img {width: 200px;height: 288px;}

.bookinfoText {position: relative;display: block}
.bookinfoText .stext {position: relative;display: block;font-size: 14px;}
.bookinfoText .red {color: #f22020}
.bookinfoText .title {position: relative;display: block;font-size: 17px;line-height: 140%;height: auto;overflow: hidden;}
.bookinfoText .title a {display: inline-block;color: #333;font-weight: bold;line-height: 22px}
.bookinfoText .title .ev_txt {color:#fff;font-size:12px;background: #0a929a;border-radius: 3px;padding: 0 7px;line-height: 20px;display: inline-block;vertical-align: top;margin-top: 1px}
.bookinfoText .stitle {display: block;margin-bottom: 3px}
.bookinfoText .stitle a {display: inline-block;color: #333;line-height: 130%;}
.bookinfoText .txt {position: relative;display: block;font-size: 12px;color: #555;height: 38px;overflow: hidden;margin: 5px 0}
.bookinfoText .name {display: block;font-size: 12px;color: #888}
.bookinfoText .price {display: block;color: #333;font-size: 13px;font-weight: 500;font-family: 'Spoqa Han Sans', 'Sans-serif';}
.bookinfoText .price i {display: inline-block;margin-right: 3px;color: #f22020;font-weight: normal;font-style: normal;font-size: 11px}
.bookinfoText .gr_txt {position: relative;display: block;padding: 15px;background: #f6f6f6;font-size: 12px;line-height: 150%;margin-top: 10px;}
.bookinfoText .bookdtl {display: block;overflow: hidden;margin: 5px 0}
.bookinfoText .bookdtl li {position: relative;display: inline-block;float: left;padding: 0 20px 0 0;color: #808991;line-height: 25px;height: 25px;}
.bookinfoText .bookdtl li:after {position: absolute;top: 50%;right: 10px;width: 1px;height: 10px;margin-top: -5px;background: #bbb;content: "";}
.bookinfoText .bookdtl li:last-child:after {display: none}
.bookinfoText .reserve_book_text {position: relative;display: block;color: #f22020}

.book_list_purchase {position: absolute;bottom: 35px;left: 200px;display: block;}
.purchase_price {position: relative;display: block;overflow: hidden;}
.purchase_price .del {display: block;font-size: 16px;color: #888;}
.purchase_price .price {float: left;font-size: 16px;color: #1f8ce6;}
.purchase_price .price b {font-size: 22px;font-weight: bold;}
.purchase_price .price .discount {display: inline-block;font-size: 15px;color: #084e99;margin-left: 5px;vertical-align: top}
.purchase_price .point {margin-left: 10px}

.purchase_count {position: relative;display: block;overflow: hidden;margin-top: 5px}
.purchase_count button {position: relative;display: block;width: 28px;height: 28px;border-radius: 50%;border: 1px solid #d9e3e9 ;background: #fff;text-indent: -99999px;float: left;}
.purchase_count button:after {position: absolute;display: block;top: 0;left: 0;width: 100%;height: 28px;line-height: 26px;font-family: FontAwesome,LineAwesome;font-size: 15px;color: #999;text-align: center;text-indent: 0}
.purchase_count .minus_count:after {content: "\f28e"}
.purchase_count .plus_count:after {content: "\f2c2"}
.purchase_count .add_count {float: left;width: 40px;height: 28px;line-height: 26px;margin: 0 5px;text-align: center;text-indent: 0;border-radius: 3px;text-indent: 0}

.point {position: relative;display: inline-block;font-size: 13px;padding-left: 20px;line-height: 26px}
.point:before {position: absolute;top: 5px;left: 0;width: 16px;height: 16px;line-height: 17px;border-radius: 50%;background: #888;color: #fff;text-align: center;font-size: 12px;content: "P"}

.txtLst {position: relative;display: block;overflow: hidden;}
.txtLst ul {border-top: none !important}
.txtLst li {position: relative;display: block;padding: 0 0 0 10px !important;border-bottom: none !important;margin-bottom: 7px;line-height: 150% !important;min-height: 10px !important}
.txtLst li:last-child {margin-bottom: 0}
.txtLst li:after {position: absolute;top: 10px;left: 0;width: 5px;height: 1px;background: #bbb;content: "";}

.txtLst dl {border-top: none !important}
.txtLst dt {display: block;font-weight: 600;color: #084e99;margin-bottom: 10px}
.txtLst dd {position: relative;display: block;padding: 0 0 0 10px !important;border-bottom: none !important;margin-bottom: 7px;line-height: 150% !important;min-height: 10px !important}
.txtLst dd:last-child {margin-bottom: 0}
.txtLst dd:after {position: absolute;top: 10px;left: 0;width: 5px;height: 1px;background: #bbb;content: "";}

.boxTxt {position: relative;display: block;overflow: hidden;width: 420px;float: left;background: #f6f6f6;border: 1px solid #ddd;margin-bottom: 15px;padding: 15px;border-top: 2px solid #084e99}
.boxTxt:nth-child(odd) {margin-right: 15px;}
.boxTxt dl {border-top: none !important}
.boxTxt dt {position: relative;display: block;font-size: 15px;font-weight: 600;color: #084e99;margin-bottom: 7px;padding-left: 10px}
.boxTxt dt:before {position: absolute;top: 11px;left: 0;width: 3px;height: 3px;border-radius: 50%;background: #084e99;content: ""}
.boxTxt dd {position: relative;display: block;padding: 0 0 0 10px !important;border-bottom: none !important;margin-bottom: 7px;line-height: 150% !important;min-height: 10px !important}
.boxTxt dd:last-child {margin-bottom: 0}
.boxTxt dd:after {position: absolute;top: 10px;left: 0;width: 5px;height: 1px;background: #bbb;content: "";}

.oblock {position: relative;display: block;overflow: hidden}


.msg-wrap {display: block;border: 1px solid #ddd;background: #fafafa;text-align:center;font-size:15px;color:#333;padding:80px 0;}
.msg-wrap .tit {font-size:22px;font-weight:bold;letter-spacing:-1px;margin:15px 0;color:#1137a6;line-height:1;}
.msg-wrap:before {content:"";display:block;width:104px;height:80px;background:url("/static/images/design/content/msg-sprite.png") no-repeat center;margin:0 auto 30px;}

@media only screen and (max-width:1024px){
    .book_list_purchase {position: relative;bottom: 0;left: 0;margin-bottom: 15px}

    .msg-wrap {padding:60px 20px;box-sizing: border-box}
    .msg-wrap .tit {font-size:18px;}

    .boxTxt {width: 100%;box-sizing: border-box;}
    .boxTxt:nth-child(odd) {margin-right: 0;}
    }

@media only screen and (max-width:760px){

    .h3-title {font-size: 18px;}
    .h3-title:after {top: 7px;height: 16px;}

    .h4-title {line-height: 24px;font-size: 15px;margin-bottom: 7px}
    .h4-title:after {top: 11px;width: 4px;height: 4px;}

    .rating i {width: 14px;}
    .rating i:after {font-size: 12px;}

    .bookCoverBox {width: 94px;height: 136px;}
    .bookCoverBox .book {width: 94px;height: 136px;}
    .bookCoverBox .book img {width: 94px;height: 136px}
    .bookCoverBox .BookTpye_box:after {width: 15px;}
    .bookCoverBox .BookTpye_box:before {width: 15px;}

    .bookCoverBox.large {width: 118px;height: 168px;}
    .bookCoverBox.large .book {width: 118px;height: 168px;}
    .bookCoverBox.large .book img {width: 118px;height: 168px;}

    .purchase_price .del {font-size: 14px;}
    .purchase_price .price {font-size: 14px;}
    .purchase_price .price b {font-size: 18px;}
    .purchase_price .price .discount {font-size: 14px;}
}

@media only screen and (max-width:640px){
    .cont-total-box .total {display: block;float: none;clear: both}
    .cont-total-box .btn_group {display: block;float: none;clear: both}

    .bookCoverBox {width: 50px;height: 72px;}
    .bookCoverBox .book {width: 50px;height: 72px;}
    .bookCoverBox .book img {width: 50px;height: 72px}

    .bookCoverBox.large {width: 94px;height: 136px;}
    .bookCoverBox.large .book {width: 94px;height: 136px;}
    .bookCoverBox.large .book img {width: 94px;height: 136px;}

    .purchase_count button {width: 25px;height: 25px;}
    .purchase_count button:after {height: 25px;line-height: 22px;font-size: 15px;}
    .purchase_count .add_count {height: 25px;line-height: 21px;}

    .txtLst li {font-size: 13px}

    .txtLst dd {font-size: 13px}

    .boxTxt dt {font-size: 14px}
    .boxTxt dd {font-size: 13px}
}

@media only screen and (max-width:540px){

    .h3-title {font-size: 16px;}
    .h3-title:after {top: 7px;height: 14px;}

    .bookinfoText .bookdtl li {padding: 0 10px 0 0;font-size: 13px;height: 20px;line-height: 20px}
    .bookinfoText .bookdtl li:after {right: 5px;}
    .bookinfoText .bookdtl li .rating {height: 20px;}
    .bookinfoText .bookdtl li .rating i {height: 20px;}
    .bookinfoText .bookdtl li .rating i:after {line-height: 20px;}
}

@media only screen and (max-width:400px){
    .bookCoverBox.large {width: 75px;height: 109px;}
    .bookCoverBox.large .book {width: 75px;height: 109px;}
    .bookCoverBox.large .book img {width: 75px;height: 109px;}
}


/*반응형 테이블,이미지*/
.rspvn-tableBox { position: relative;display: block;}
.rspvn-scroll {overflow:hidden }

.tbl_st01 {border-collapse:collapse;border-spacing:0;table-layout:fixed;width:100%;clear:both;border-top:2px solid #333;background: #fff}
.tbl_st01 th, .tbl_st01 td {padding: 8px 10px;text-align:center;border:1px solid #ccc;line-height: 160%;word-wrap:break-word;word-break:keep-all;}
.tbl_st01 th {background:#f8f8f8;color:#222;}
.tbl_st01 a {color: #555}
.tbl_st01 small {font-weight: normal;letter-spacing: 0;color: #555;margin-left: 5px}
.tbl_st01.left td {text-align: left;padding: 10px 15px}

@media all and (max-width: 1200px) {
    .rspvn-tableBox.full {padding-top:120px;background: #f2f2f2 url("/static/images/design/content/rspvn-drag.png") no-repeat center 18px;background-size: 150px}
    .rspvn-tableBox.full:after, .rspvn-tableBox.full:before {position:absolute;top:50px;width:40px;height:20px;display: block;background-size: 40px !important;content:"";}
    .rspvn-tableBox.full:after { right:20px;background:url("/static/images/design/content/rspvn-arr02.png") no-repeat;}
    .rspvn-tableBox.full:before { left:20px;background:url("/static/images/design/content/rspvn-arr01.png") no-repeat;}

    .rspvn-scroll {position:relative;overflow-x:scroll;width: 100%;padding-top: 20px;background: #fff}
    .rspvn-tableBox.full .rspvn-scroll table {width: 1200px !important}

}
@media all and (max-width:640px) {
    .rspvn-tableBox {padding-top:120px;background: #f2f2f2 url("/static/images/design/content/rspvn-drag.png") no-repeat center 18px;background-size: 150px}
    .rspvn-tableBox:after, .rspvn-tableBox:before {position:absolute;top:50px;width:40px;height:20px;display: block;background-size: 40px !important;content:"";}
    .rspvn-tableBox:after { right:20px;background:url("/static/images/design/content/rspvn-arr02.png") no-repeat;}
    .rspvn-tableBox:before { left:20px;background:url("/static/images/design/content/rspvn-arr01.png") no-repeat;}

    .rspvn-scroll {position:relative;overflow-x:scroll;width: 100%;padding-top: 20px;background: #fff}

    .rspvn-scroll table {width:600px !important}

    .tbl_st01 {font-size: 13px;}
    .tbl_st01 th, .tbl_st01 td {padding:10px 8px;}
}
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	강의리스트
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*패키지 상단박스*/
.package-topBox {position: relative;display: block;overflow: hidden;background: #efefef;padding: 40px 35px;margin-bottom: 40px}
.package-topBox .title {display: block;text-align: center;font-size: 40px;color: #222;line-height: 45px;font-weight: 600;margin-bottom: 30px;letter-spacing: -0.05em}
.package-topBox ul {display: block;overflow: hidden;width: 700px;margin: 0 auto}
.package-topBox li {position: relative;display: block;padding-left: 120px;height: 45px;margin-bottom: 10px;}
.package-topBox li:last-child {margin-bottom: 0}
.package-topBox li  a {display: block;}
.package-topBox li .tit {position: absolute;top: 0;left: 0;width: 150px;height: 45px;color: #fff;text-align: center;line-height: 45px;font-size: 20px;border-radius: 40px;z-index: 10}
.package-topBox li .txt {position: relative;display: block;text-align: center;padding-left: 10px;background: #fff;font-size: 15px;color: #333;letter-spacing: -0.05em;
    font-weight: bold;border-radius: 45px;height: 45px;line-height: 45px;}

.package-topBox .st01 {background: #e96300 }
.package-topBox .st02 {background: #02a5a4 }
.package-topBox .st03 {background: #519d07 }
.package-topBox .st04 {background: #f03023 }
.package-topBox .st05 {background: #3c2c50 }
.package-topBox .st06 {background: #266729 }

/*강의 리스트*/
.lecture-list-wrap {position: relative;display: block;overflow: hidden;}
.lecture-list-wrap .item {position: relative;display: block;border: 1px solid #d0dbe1;margin-bottom: 30px;}
.lecture-list-wrap .item:before {position: absolute;top: 0;left: 0;width: 100%;height: 2px;background: #084e99;content: "";z-index: 1}
.lecture-list-wrap .item:last-child {margin-bottom: 0}

.lecture-list-wrap .item-top {position: relative;display: block;border-bottom: 1px solid #d0dbe1;padding: 15px 20px;padding-right: 230px;background: #eff3f8}
.lecture-list-wrap .title {position: relative;display: block;overflow: hidden}
.lecture-list-wrap .title a {float: left;font-size: 16px;line-height: 24px;color: #222;font-weight: bold;letter-spacing: -0.06em;margin-right: 5px;}
.lecture-list-wrap .title .status {display: inline-block;line-height: 24px;;background: #ccc;text-align: center;height: 24px;padding: 0 10px;font-size: 13px;border-radius: 3px;margin-top: -1px;vertical-align: middle}
.lecture-list-wrap .title .status.ing {background: #ec2851;color: #fff;}
.lecture-list-wrap .title .status.end {background: #5b616e;color: #fff;}
.lecture-list-wrap .title .status.due {background: #7ab605;color: #fff;}

.lecture-list-wrap .item-btn {position: absolute;top: 50%;right: 20px;margin-top: -15px}
.lecture-list-wrap .item-btn a {display: inline-block;vertical-align: top;text-align: center;height: 30px;border: 1px solid #d0dbe1;border-radius: 3px}
.lecture-list-wrap .item-btn .btn-cart {color: #999;font-size: 21px;line-height: 38px;width: 38px;background: #fff;transition:all 0.1s; -webkit-transition:all 0.1s; -moz-transition:all 0.1s;}
.lecture-list-wrap .item-btn .btn-cart .fe {line-height: 38px}
.lecture-list-wrap .item-btn .btn-dtil {border: 1px solid #084e99;background: #084e99;color: #fff;padding: 0 16px;line-height: 30px;font-size: 15px;margin-left: 2px;transition:all 0.1s; -webkit-transition:all 0.1s; -moz-transition:all 0.1s;}

@media only screen and (min-width:1025px) {
    .lecture-list-wrap .asbtn .btn-cart:hover {color: #084e99;border: 1px solid #084e99;}
    .lecture-list-wrap .asbtn .btn-dtil:hover {border: 1px solid #ca1921;background: #ca1921;}
}

.lecture-list-wrap .article {position: relative;display: block;padding: 15px 30px 15px 180px;border-bottom: 1px dotted #ccc;overflow: hidden;}
.lecture-list-wrap .article:last-child {border-bottom: none}
.lecture-list-wrap .tit-area {position: absolute;top: 50%;left: 30px;width: 130px;margin-top: -15px;overflow: hidden}
.lecture-list-wrap .tit-area .fe {float: left;font-size: 18px;font-weight: 600;color: #333;line-height: 30px;}
.lecture-list-wrap .tit-area .txt {float: left;font-size: 16px;font-weight: bold;color: #333;line-height: 30px;margin-left: 5px;letter-spacing: -0.06em}

.lecture-list-wrap .txt-area {position: relative;float: left;}
.lecture-list-wrap .txt-area li {display: block;font-size: 14px;color: #333;}
.lecture-list-wrap .txt-area li:last-child {margin-bottom: 0}
.lecture-list-wrap .article.last .txt-area li {font-size: 13px;color: #888}

.lecture-list-wrap .price-area {position: relative;display: block;height: 25px;padding: 15px 30px;background: #fafafa;overflow: hidden;}
.lecture-list-wrap .price-area div {line-height: 25px}
.lecture-list-wrap .price-area .date {display: inline-block;font-size: 14px;}
.lecture-list-wrap .price-area .del {float: left;font-size: 16px;color: #888;}
.lecture-list-wrap .price-area .price {float: left;font-size: 16px;color: #1f8ce6;margin-left: 10px}
.lecture-list-wrap .price-area .price b {font-size: 25px;font-weight: bold;}
.lecture-list-wrap .price-area .price .discount {display: inline-block;font-size: 15px;color: #084e99;margin-left: 5px;vertical-align: top}
.lecture-list-wrap .price-area .point {margin-left: 10px}

.lecture-list-wrap .item.busan:before {background: #f97408;}
.lecture-list-wrap .item.busan .item-top {background: #f9f5f1;}
.lecture-list-wrap .item.busan .btn-dtil {background: #f97408;border: 1px solid #f97408}
.lecture-list-wrap .item.busan .tit-area .fe, .lecture-list-wrap .item.busan .tit-area .txt {color: #f97408;}

.lecture-list-wrap .item.incheon:before {background: #069797;}
.lecture-list-wrap .item.incheon .item-top {background: #ecfafa;}
.lecture-list-wrap .item.incheon .btn-dtil {background: #069797;border: 1px solid #069797}
.lecture-list-wrap .item.incheon .tit-area .fe, .lecture-list-wrap .item.incheon .tit-area .txt {color: #069797;}

.academy-view-wrap {position: relative;display: block;overflow: hidden;border-top: 2px solid #666}
.academy-title {position: relative;display: block;overflow: hidden;padding: 13px 20px;background: #f6f6f6;font-size: 16px;color: #222;font-weight: 600;text-align: center;}
.academy-cont {display: block;padding: 30px 0;border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;}
.academy-cont img {max-width: 100%}
.academy-btn {display: block;overflow: hidden}
.academy-btn li {position: relative;float: left;width: 50%;background: #ecf1f6;text-align: center;height: 160px;padding: 30px 0}
.academy-btn li:first-child:after {position: absolute;top: 50%;right: 0;width: 1px;height: 160px;background: #d3dae1;margin-top: -80px;content: ""}
.academy-btn li .img {display: block;margin-bottom: 10px}
.academy-btn li .txt {display: block;}
.academy-btn li .txt span {display: block;font-size: 16px;}
.academy-btn li .txt b {display: block;font-size: 22px;color: #084e99}

@media only screen and (max-width:1024px){
    /*패키지 상단박스*/
    .package-topBox ul {width: 100%}
    .package-topBox li {padding-left: 100px;}
    .package-topBox li .tit {width: 120px;font-size: 16px;}
    .package-topBox li .txt {text-align: left;padding-left: 40px;}

    /*강의 리스트*/
    .lecture-list-wrap .item-top {padding: 20px 150px 20px 30px !important;box-sizing: border-box}
    .lecture-list-wrap .title a {font-size: 18px;}

    .academy-cont {padding: 20px 0;}
    .academy-cont img {max-width: 100%;}
    .academy-btn li {padding: 20px 0}
}
@media only screen and (max-width:760px){
    /*강의 리스트*/
    .lecture-list-wrap .item-top {padding: 15px 40px 15px 20px !important;}
    .lecture-list-wrap .title a {font-size: 16px;line-height: 130%;}
    .lecture-list-wrap .title .status {line-height: 20px;height: 20px;padding: 0 8px;font-size: 11px;margin-top: -2px}

    .lecture-list-wrap .item-btn {right: 10px;margin-top: -15px;}
    .lecture-list-wrap .item-btn  a { width: 30px;height: 30px;border: none;border-radius: 50%}
    .lecture-list-wrap .item-btn .btn-dtil {border: none;background: #fff;color: #999;padding:0;line-height: 30px;font-size: 18px;margin-left: 0;text-indent: -99999px}
    .lecture-list-wrap .item-btn .btn-dtil:after {position: absolute;top: 0;left: 0;width: 100%;height: 30px;line-height: 30px;text-align: center;text-indent: 0;font-family: Feather;content: "\e930";}

    .lecture-list-wrap .item.busan .btn-dtil {color: #fff;}
    .lecture-list-wrap .item.incheon .btn-dtil {color: #fff;}

    .lecture-list-wrap .article {padding: 15px 15px 15px 150px;}
    .lecture-list-wrap .article.last {display: none;}
    .lecture-list-wrap .tit-area .fe {font-size: 18px;}
    .lecture-list-wrap .tit-area .txt {font-size: 16px;}

    .lecture-list-wrap .txt-area {position: relative;float: left;}
    .lecture-list-wrap .txt-area li {display: block;font-size: 14px;color: #333;}
    .lecture-list-wrap .txt-area li:last-child {margin-bottom: 0}
    .lecture-list-wrap .article.last  {font-size: 13px;color: #888}

    .academy-btn li {height: 150px;}
    .academy-btn li:first-child:after {height: 150px;margin-top: -75px}
    .academy-btn li .txt span {font-size: 14px;}
    .academy-btn li .txt b {font-size: 20px}
}
@media only screen and (max-width:640px){
    /*패키지 상단박스*/
    .package-topBox {display: none;}

    /*강의 리스트*/
    .lecture-list-wrap .item {margin-bottom: 20px}
    .lecture-list-wrap .item-top {padding: 15px 40px 15px 10px !important;}
    .lecture-list-wrap .title a {font-size: 15px;}

    .lecture-list-wrap .tit-area .fe {font-size: 16px;}
    .lecture-list-wrap .tit-area .txt {font-size: 15px;}

    .lecture-list-wrap .price-area .fr {float: none}
    .lecture-list-wrap .price-area .date {display: none}
    .lecture-list-wrap .price-area .del {font-size: 14px;}
    .lecture-list-wrap .price-area .price {font-size: 14px}
    .lecture-list-wrap .price-area .price b {font-size: 20px;}
    .lecture-list-wrap .price-area .price .discount {font-size: 14px;}
}

@media only screen and (max-width:480px){
    /*강의 리스트*/
    .lecture-list-wrap .article {padding: 10px;}
    .lecture-list-wrap .tit-area {position: relative;top: 0;left: 0;margin-top: 0}
    .lecture-list-wrap .tit-area .fe {font-size: 15px}
    .lecture-list-wrap .tit-area .txt {font-size: 14px;}

    .lecture-list-wrap .price-area {padding: 15px;}
    .lecture-list-wrap .price-area .del {display: none}
    .lecture-list-wrap .price-area .price {margin-left: 0}

    .lecture-list-wrap .item.busan .tit-area, .lecture-list-wrap .item.incheon .tit-area {position: absolute;top: 50%;left: 10px;width: 100px;margin-top: -15px;overflow: hidden}

    .lecture-list-wrap .item.busan .article, .lecture-list-wrap .item.incheon .article {padding: 10px 10px 10px 120px;}

    .academy-btn li {height: 120px;}
    .academy-btn li:first-child:after {height: 120px;margin-top: -60px}
    .academy-btn li .img img {width: 70px;}
    .academy-btn li .btn {font-size: 14px;padding: 8px 15px}
    .academy-btn li .txt span {font-size: 13px;}
    .academy-btn li .txt b {font-size: 18px}

}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	교재리스트
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*교재리스트*/
.book-list-wrap {position: relative;display: block;border-top: 1px solid #d0dbe1;}
.book-list-wrap > ul > li {position: relative;display: block;padding: 30px 180px 30px 200px;height: 170px;border-bottom: 1px solid #d0dbe1}
.book-list-wrap > ul > li:hover {background: #fafafa}
.book-list-wrap > ul > li .checkbox {position: absolute;top: 50%;left: 20px;margin-top: -10px}
.book-list-wrap > ul > li .bookCoverBox {position: absolute;top: 30px;left: 60px;}

.list_btBox {position: absolute;top: 50%;right: 20px;width: 130px;height: 93px;margin-top: -46px;overflow: hidden}
.list_btBox a {position: relative;display: block;margin: 5px 0;font-size: 16px;}

@media only screen and (max-width:1024px){
    .book-list-wrap > ul > li {padding: 30px 30px 30px 200px;height: auto}
    .list_btBox {position: relative;top:0;right: 0;width: 100%;height: auto;margin-top: 0;}
    .list_btBox a {display: inline-block;margin: 0 2px;}
}
@media only screen and (max-width:760px){
    .book-list-wrap > ul > li {padding: 20px 20px 20px 160px;height: auto}
    .book-list-wrap > ul > li .checkbox {top: 20px;left: 10px;margin-top: 0}
    .book-list-wrap > ul > li .bookCoverBox {top: 20px;left: 45px;}
}
@media only screen and (max-width:640px){
    .book-list-wrap > ul > li {padding: 20px 20px 20px 110px;height: auto}
    .list_btBox a {font-size: 14px;}
    .book-foot-btn {text-align: left !important}
}

@media only screen and (max-width:420px){
    .book-list-wrap > ul > li {padding: 42px 15px 15px 65px;height: auto}
    .book-list-wrap > ul > li .checkbox {top: 15px;left:0;}
    .book-list-wrap > ul > li .bookCoverBox {top: 45px;left: 0;}

}



/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	상세뷰 공통요소
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#view-detail-wrap {position: relative;display: block;width: 1200px;margin: 0 auto;}
.view-detail-top-wrap {position: relative;display: block;padding-top: 40px}
.view-detail-top-wrap:before {position: absolute;top: 40px;left: 0;width: 100%;height: 100%;background: #fff;content: "";z-index: 2}
.view-detail-top-wrap:after {position: absolute;top: 0;left: 50%;width: 2000px;height: 100%;margin-left: -1000px;background: #f4f4f4;content: "";z-index: 0}
.view-detail-top {position: relative;display: block;z-index: 10}

.detail-title {position: relative;display: block;overflow: hidden;background: #c6cbd1;padding: 18px 240px 18px 30px}
.detail-title .title {float: left;font-size: 22px;color: #151515;font-weight: bold;line-height: 30px}
.detail-title .txt_type {margin: 5px 0 0 5px;background: #fff;}

.view-detail-top-wrap .detail-info {position: relative;display: block;border: 1px solid #c9d3e2;background: #f5f9ff;padding: 8px 15px}
.view-detail-top-wrap .detail-info ul {display: block;}
.view-detail-top-wrap .detail-info li {position: relative;display: block;padding: 12px 10px 12px 120px;min-height: 25px;border-bottom: 1px dotted #c9d3e2;line-height: 25px;font-size: 13px;color: #666}
.view-detail-top-wrap .detail-info li:last-child {border-bottom: none}
.view-detail-top-wrap .detail-info li .title {position: absolute;top: 12px;left: 10px;width: 100px;color: #222;font-weight: bold}
.view-detail-top-wrap .detail-info li .delivery {font-size: 15px;display: inline-block;margin-right: 3px;vertical-align: top;line-height: 22px;}
.view-detail-top-wrap .detail-info li .delivery.free {color: #f44336}
.view-detail-top-wrap .detail-info li del {display: inline-block;font-size: 15px;color: #777}
.view-detail-top-wrap .detail-info li .price {display: block;font-size: 16px;color: #1f8ce6;margin: 3px 0;font-family: AritaDotum;line-height: 130%}
.view-detail-top-wrap .detail-info li .price b {display: inline-block;font-size: 25px;font-weight: bold;}
.view-detail-top-wrap .detail-info li .price .discount {display: inline-block;font-size: 14px;color: #084e99;font-weight: normal}
.view-detail-top-wrap .detail-info li select {width: 100%;max-width: 230px}
.view-detail-top-wrap .detail-info li .block {display: block !important}

.view-detail-top-wrap .detail-info .priceBtn {position: relative;display: block;overflow: hidden;margin: 5px 0 15px}
.view-detail-top-wrap .detail-info .priceBtn a {float: left;vertical-align: top;text-align: center;height: 42px;font-size: 15px;line-height: 42px;border: 1px solid #084e99;border-radius: 3px;letter-spacing: -0.05em;}
.view-detail-top-wrap .detail-info .priceBtn a small {font-size: 14px;margin-left: 3px;color: rgba(255,255,255,0.7)}
.view-detail-top-wrap .detail-info .priceBtn .btn-cart {width: 118px;color: #084e99;background: #fff;transition:all 0.1s; -webkit-transition:all 0.1s; -moz-transition:all 0.1s;}
.view-detail-top-wrap .detail-info .priceBtn .btn-cart .fe {line-height: 38px}
.view-detail-top-wrap .detail-info .priceBtn .btn-buy {width: 190px;background: #084e99;color: #fff;margin-left: 5px;transition:all 0.1s; -webkit-transition:all 0.1s; -moz-transition:all 0.1s;}
@media only screen and (min-width:1025px) {
    .detail-info .priceBtn .btn-buy:hover {border: 1px solid #ca1921;background: #ca1921;}
}

.view-bottom-detail-wrap {position: relative;display: block;padding-top: 60px;z-index: 10}
.view-bottom-tab-wrap {position: absolute;display: block;top: 0;left: 0;width: 100%;height: 40px;padding: 10px 0;z-index: 100}
.view-bottom-tab-wrap:before {position: absolute;top: 0;left: 50%;width: 2000px;height: 100%;margin-left: -1000px;background: #a3acb5;content: ""}

.detail-tab {position: relative;display: block;overflow: hidden;width: 1200px;margin: 0 auto}
.tab-nav {float: left;overflow: hidden}
.tab-nav li {float: left;margin-right: 10px;}
.tab-nav li:last-child {margin-right: 0}
.tab-nav li a {display: block;padding: 0 25px;line-height: 40px;height: 40px;font-size: 18px;color: #fff;border-radius: 40px}
.tab-nav li a small {font-size: 15px}
.tab-nav li.active a {background: #858f9a}

.tab-btn {opacity: 0;position: relative;float: right;margin-top: 3px;transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s;}
.tab-btn a {display: inline-block;vertical-align: top;text-align: center;height: 38px;font-size: 15px;border: 1px solid #084e99;border-radius: 3px;letter-spacing: -0.05em;}
.tab-btn a small {font-size: 14px;margin-left: 3px;color: rgba(255,255,255,0.7)}
.tab-btn .btn-cart {width: 120px;color: #084e99;line-height: 38px;background: #fff;transition:all 0.1s; -webkit-transition:all 0.1s; -moz-transition:all 0.1s;}
.tab-btn .btn-cart .fe {line-height: 38px}
.tab-btn .btn-buy {width: 180px;background: #084e99;color: #fff;line-height: 38px;margin-left: 5px;transition:all 0.1s; -webkit-transition:all 0.1s; -moz-transition:all 0.1s;}
@media only screen and (min-width:1025px) {
    .tab-btn .btn-buy:hover {border: 1px solid #ca1921;background: #ca1921;}
}

.view-bottom-tab-wrap.scrollFixed {position: fixed;}
.view-bottom-tab-wrap.scrollFixed .tab-btn {opacity: 1;margin-top: 0}

.view-bottom-tabViw-wrap {position: relative;display: block;overflow: hidden;padding: 40px 0;}
.detail-tab-view {position: relative;display: block;line-height: 160%;font-size: 15px}
.detail-tab-view h4 {display: block;margin-bottom: 10px;font-weight: bold;color: #333;line-height: 130%;font-size: 20px}
.detail-tab-view .line {position: relative;display: block;height: 1px;background: #ddd;margin: 30px 0}

/*커리큘럼 리스트*/
.view-curriculum-list {position: relative;display: block;overflow: hidden}
.view-curriculum-list ul {display: block;overflow: hidden;}
.view-curriculum-list li {position: relative;display: block;overflow: hidden;width: 998px;border: 1px solid #d0dbe1;border-radius: 5px;margin-bottom: 10px;padding: 15px 115px 15px 85px}
.view-curriculum-list li .number {position: absolute;top: 0;left: 0;width: 65px;height: 100%;background: #f3f3f3;}
.view-curriculum-list li .number span {position: absolute;top: 50%;left: 0;width: 100%;height: 30px;line-height: 30px;margin-top: -15px;font-size: 15px;color: #333;font-weight: bold;text-align: center;}
.view-curriculum-list li .txtBox {position: relative;display: block;width: 840px;}
.view-curriculum-list li .txtBox b {display: block;font-weight: bold;color: #222;font-size: 14px;line-height: 26px}
.view-curriculum-list li .txtBox span {display: block;}
.view-curriculum-list li .timeBox {position: absolute;top: 50%;right: 150px;width: 80px;height: 30px;margin-top: -15px;font-size: 16px;text-align: center}
.view-curriculum-list li .timeBox span {float: left;line-height: 30px;}
.view-curriculum-list li .timeBox .txt {margin-left: 3px}
.view-curriculum-list li .btnBox  {position: absolute;top: 50%;right: 20px;width: 100px;height: 30px;margin-top: -15px;text-align: center}
.view-curriculum-list li .btnBox .btn-play {position: relative;display: block;background: #1f8ce6;overflow: hidden;border-radius: 3px;line-height: 30px;padding: 0 17px;}
.view-curriculum-list li .btnBox .btn-play span {float: left;line-height: 30px;font-size: 13px;color: #fff;}
.view-curriculum-list li .btnBox .btn-play .txt {margin-left: 3px}

.ui-accordion-content .view-curriculum-list li {width: 937px}

/*북 리스트*/
.lecture-book-list {position: relative;display: block;border-top: 1px solid #d0dbe1;overflow: hidden}
.lecture-book-list > ul > li {position: relative;float: left;width: 400px;padding: 30px 0 30px 200px;height: 170px;border-bottom: 1px solid #d0dbe1}
.lecture-book-list > ul > li:hover {background: #fafafa}
.lecture-book-list > ul > li .check {position: absolute;top: 50%;left: 20px;margin-top: -10px}
.lecture-book-list > ul > li .bookCoverBox {position: absolute;top: 30px;left: 60px;}
.lecture-book-list > ul > li .bookinfoText .title {display: block;height: auto;line-height: 130%}
.lecture-book-list .bookdtl li {display: block;float: none;padding: 0}
.lecture-book-list .bookdtl li:after {display: none}
.lecture-book-list .bookdtl li b {display: inline-block;vertical-align: top;width: 80px;color: #636b71}
.lecture-book-list .bookdtl li:last-child:after {display: none}

/*스프링분철*/
.spring_info {position: relative;display: block;border: 1px solid #d0dbe1;padding: 40px 0;text-align: center}
.spring_info p {position: relative;display: block;text-align: center;font-size: 20px;color: #666;line-height: 130%}
.spring_info p b {color: #222}
.spring_info p span {font-size: 16px}
.spring_info .img {position: relative;display: block;width: 450px;margin: 20px auto;background: #f3f3f3;padding: 20px 0;border-radius: 10px;}
.spring_info ul {display: inline-block;}
.spring_info li {line-height: 22px;font-size: 16px}

.spring_event {position: relative;display: block;width: 320px;line-height: 45px;border-radius: 45px;margin: 20px auto 0;background: #04935c;color: #fff;font-size: 18px}
.spring_event span {color: #fff006}

/*택배사*/
.delivery_info {position: relative;display: block;border: 1px solid #d0dbe1;padding: 40px 0;text-align: center}
.delivery_info ul {display: block;padding-bottom: 20px;border-bottom: 1px dotted #bbb;width: 600px;margin: 0 auto 20px}
.delivery_info li {display: block;font-size: 18px;color: #555;line-height: 33px}
.delivery_info li img {vertical-align: top}
.delivery_info div {width: 360px;margin: 0 auto;display: block;text-align: center;font-size: 16px;line-height: 160%;padding: 30px 0 30px 200px;background: url("/static/images/design/content/delivery_img.png") no-repeat;}

.delivery_text {position: relative;display: block;border-top: 2px solid #d0dbe1;}
.delivery_text li {position: relative;display: block;border-bottom: 1px solid #d0dbe1;padding: 25px 20px 25px 220px}
.delivery_text li .title {position: absolute;top: 50%;left: 20px;font-size: 16px;color: #333;font-weight: bold;line-height: 30px;margin-top: -15px}
.delivery_text li:last-child .title {line-height: 22px;margin-top: -21px}

@media only screen and (max-width:1024px){
    /*상세화면*/
    #view-detail-wrap {width: 100%;padding: 0 15px 20px;box-sizing: border-box;}
    .view-detail-top-wrap {padding-top: 0}
    .view-detail-top-wrap:before {display: none}
    .view-detail-top-wrap:after {display: none}

    .detail-title {padding: 15px 20px}
    .detail-title .title {font-size: 20px;line-height: 140%}

    .view-detail-top-wrap .detail-info li {padding: 10px 10px 10px 120px;}
    .view-detail-top-wrap .detail-info li .title {top: 10px;width: 100px;font-size: 14px;}
    .view-detail-top-wrap .detail-info li .price {display: inline-block;margin-right: 5px}
    .view-detail-top-wrap .detail-info .priceBtn {text-align: center}
    .view-detail-top-wrap .detail-info .priceBtn a {float: none;display: inline-block;vertical-align: top}

    .view-bottom-detail-wrap {padding-top: 60px;}
    .view-bottom-tab-wrap {height: 60px;padding: 10px 15px;box-sizing: border-box}
    .view-bottom-tab-wrap:before {width: 100%;padding: 0 15px;left: -15px;margin-left: 0}

    .detail-tab {width: 100%;}
    .tab-nav {float: none;text-align: center}
    .tab-nav li {float: none;display: inline-block;}

    .tab-btn {display: none;}

    .view-bottom-tab-wrap.scrollFixed {position: relative;}

    .view-bottom-tabViw-wrap {padding: 30px 0;}
    .detail-tab-view {font-size: 14px}
    .detail-tab-view img {max-width: 100%}

    /*커리큘럼 리스트*/
    .view-curriculum-list li {width: 100%;padding: 10px 140px 10px 85px;box-sizing: border-box}
    .view-curriculum-list li .txtBox {width: 100%;}
    .view-curriculum-list li .txtBox b {font-size: 14px;line-height: 24px}
    .view-curriculum-list li .timeBox {position: relative;display: block;top: 0;right: 0;width: 100%;height: auto;margin-top: 0;overflow: hidden}

    .ui-accordion-content .view-curriculum-list li {width: 100%}

    .lecture-book-list > ul > li {float: none;width:100%;box-sizing: border-box;height: auto}
}
@media only screen and (max-width:760px){
    /*상세화면*/
    .detail-title .title {font-size: 18px;line-height: 130%}

    .view-detail-top-wrap .detail-info li .title {font-size: 13px;}
    .view-detail-top-wrap .detail-info li .price {font-size: 15px}
    .view-detail-top-wrap .detail-info li .price b {font-size: 22px;}
    .view-detail-top-wrap .detail-info li .price .discount {font-size: 13px;}

    .view-bottom-detail-wrap {padding-top: 0;}
    .view-bottom-tab-wrap {position: relative;height: 50px;}

    .tab-nav {float: none;text-align: center}
    .tab-nav li {float: none;display: inline-block;}
    .tab-nav li a {padding: 0 20px;line-height: 30px;height: 30px;font-size: 15px;border-radius: 30px}
    .tab-nav li a small {font-size: 13px}

    /*커리큘럼 리스트*/
    .view-curriculum-list li {padding: 10px 20px 10px 65px;}
    .view-curriculum-list li .number {width: 50px;}
    .view-curriculum-list li .number span {font-size: 13px;}
    .view-curriculum-list li .txtBox b {font-size: 13px;line-height: 150%}
    .view-curriculum-list li .timeBox {font-size: 13px}
    .view-curriculum-list li .btnBox {position: relative;display: block;top: 0;right: 0;width: 100%;height: auto;margin-top: 0;overflow: hidden}
    .view-curriculum-list li .btnBox a {display: inline-block !important}

    .bookinfoText .title {font-size: 16px;}

    .lecture-book-list > ul > li {padding: 30px 0 30px 160px;}
    .lecture-book-list > ul > li .check {top: 27px;left: 10px;margin-top: 0}
    .lecture-book-list > ul > li .bookCoverBox {left: 40px}

    /*스프링분철*/
    .spring_info {padding: 30px 0;}
    .spring_info p {font-size: 18px;}
    .spring_info p span {font-size: 15px}
    .spring_info .img {width: 80%;}
    .spring_info .img img {width: 80%;}
    .spring_info li {font-size: 15px}

    .spring_event {width: 300px;font-size: 15px}
    .spring_event span {color: #fff006}

    /*택배사*/
    .delivery_info {padding: 30px 0;}
    .delivery_info ul {width: 100%}
    .delivery_info li {font-size: 16px;line-height: 26px}
    .delivery_info li img {margin-bottom: 5px}
    .delivery_info div {width: 100%;font-size: 14px;padding: 120px 20px 0 ;background: url("/static/images/design/content/delivery_img.png") no-repeat center top;box-sizing: border-box}

    .delivery_text li {padding: 20px 15px}
    .delivery_text li .title {position: relative;top: 0;left: 0;margin-top: 0;margin-bottom: 5px;line-height: 130%}
    .delivery_text li:last-child .title {line-height: 130%;margin-top: 0}
    .delivery_text li:last-child .title br {display: none}

}
@media only screen and (max-width:640px){
    /*상세화면*/
    .detail-title {background: none;padding: 15px 0;overflow: inherit;height: auto;}
    .detail-title:after {position: absolute;top: 0;left: -15px;width: 100%;height: 100%;background: #c6cbd1;padding: 0 15px;content: "";z-index: 0}
    .detail-title .title {position: relative;display: inline-block;float: none;font-size: 17px;line-height: 140%;z-index: 10}
    .detail-title .txt_type {position: relative;display: inline-block;float: none;margin: 3px 0 0 5px;z-index: 10}

    .tab-nav li a {padding: 0 15px;}

    .bookinfoText .title {font-size: 15px;line-height: 150%}
    .bookinfoText .title .ev_txt {font-size:11px;line-height: 18px;margin-top: 3px}

    .lecture-book-list > ul > li {padding: 20px 0 20px 110px;}
    .lecture-book-list > ul > li .check {top: 18px;}
    .lecture-book-list > ul > li .bookCoverBox {top: 20px}

    .detail-tab-view h4 {font-size: 17px}
}
@media only screen and (max-width:480px){
    .detail-title .title {font-size: 15px;}
    .detail-title .txt_type {margin: 1px 0 0 5px;}

    .view-detail-top-wrap .detail-info .priceBtn .btn-cart {width: 100px;}
    .view-detail-top-wrap .detail-info .priceBtn .btn-buy {width: 140px;}

    .view-bottom-tab-wrap {padding: 0}
    .view-bottom-tab-wrap:before {background: #ddd;}

    .tab-nav {display: block;width: 100%;}
    .tab-nav li {width: 25%;margin-right: 0;float: left;}
    .tab-nav li a {position: relative;padding: 0;line-height: 50px;height: 50px;font-size: 14px;border-radius: 0;color: #666}
    .tab-nav li.active a {background: none;color: #494d52;font-weight: bold}
    .tab-nav li.active a:after {position: absolute;bottom: 0;left: 0;width: 100%;height: 3px;background: #494d52;content: ""}

    /*스프링분철*/
    .spring_info {padding: 20px  15px;}
    .spring_info p {font-size: 16px;}
    .spring_info p span {font-size: 14px}
    .spring_info li {font-size: 14px}

    .spring_event {width: 260px;font-size: 14px;line-height: 35px;height: 35px}
    .spring_event span {color: #fff006}

    /*택배사*/
    .delivery_info {padding: 20px 15px;}
    .delivery_info li {font-size: 14px;line-height: 22px}
    .delivery_info li img {width: 150px}
    .delivery_info div br {display: none}

    .delivery_text li {font-size: 13px}
}
@media only screen and (max-width:370px){
    .detail-title .title {font-size: 14px;}
    .detail-title .txt_type {margin: 0 0 0 5px;}
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	상세뷰_상단 강의영역
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.detail-lecture-topCont {position: relative;display: block;padding: 40px;overflow: hidden;z-index: 10}
.detail-topCont-left {float: left;width: 436px;}
.detail-topCont-right {float: right;width: 645px;}

.detail-lecture-topCont .detail-thumbnail{position: relative;display: block;}
.detail-lecture-topCont .detail-thumbnail img {width: 436px;height: 370px;}


.review-rating {position: relative;display: block;overflow: hidden;text-align: center;background: #ecf1f5;padding: 12px 0;height: 25px}
.review-rating .title {display: inline-block;vertical-align: top;font-size: 16px;color: #333;font-weight: bold;line-height: 25px;margin-right: 10px}
.review-rating .rating i {color: #a1a9b3}
.review-rating .rating i.on {color: #084e99}

.detail-cont {position: relative;display: block;padding: 0 40px 40px;overflow: hidden;z-index: 10}
.detail-cont .area-title {position: relative;display: block;overflow: hidden;line-height: 30px;margin-bottom: 10px}
.detail-cont .area-title span {position: relative;display: inline-block;float: left;font-weight: bold;color: #222;font-size: 20px;line-height: 130%}
.detail-cont .area-title span:after {position: absolute;bottom: 5px;right: -8px;width: 6px;height: 6px;border-radius: 50%;background: #084e99;content: ""}
.detail-cont .area-title small {float: left;margin-left: 15px;font-size: 13px;}

.detail-cont .lecture-item {position: relative;display: block;overflow: hidden;border: 1px solid #d0dbe1;background: #fafafa}
.detail-cont .lecture-item .article {position: relative;display: block;padding: 25px 20px 25px 150px;border-bottom: 1px dotted #ccc;overflow: hidden}
.detail-cont .lecture-item .article.last {border-bottom: none;}
.detail-cont .lecture-item .tit-area {position: absolute;top: 50%;left: 40px;width: 100px;margin-top: -15px;overflow: hidden}
.detail-cont .lecture-item .tit-area .fe {float: left;font-size: 20px;font-weight: 600;color: #333;line-height: 30px;}
.detail-cont .lecture-item .tit-area .txt {float: left;font-size: 18px;font-weight: bold;color: #333;line-height: 30px;margin-left: 5px}

.detail-cont .lecture-item .txt-area {position: relative;float: left;}
.detail-cont .lecture-item .txt-area li {display: block;font-size: 14px;color: #333;margin-bottom: 5px;padding-right: 440px}
.detail-cont .lecture-item .txt-area li:last-child {margin-bottom: 0}

.detail-cont .lecture-item .price-area {position: absolute;top: 50%;right: 0;margin-top: -13px;height: 26px;width: 165px;padding: 0 120px 0 180px;line-height: 150%}
.detail-cont .lecture-item .price-area.discount-add {height: 48px;margin-top: -24px;}
.detail-cont .lecture-item .price-area .date {position: absolute;display: block;top: 50%;left:0;width: 155px;height: 26px;font-size: 14px;line-height: 26px;margin-top: -13px;overflow: hidden}
.detail-cont .lecture-item .price-area .point {position: absolute;display: block;top: 50%;right: 0;width: 100px;margin-top: -13px;}
.detail-cont .lecture-item .price-area .del {display: block;font-size: 16px;color: #888;}
.detail-cont .lecture-item .price-area .price {display: block;font-size: 16px;color: #1f8ce6;line-height: 26px}
.detail-cont .lecture-item .price-area .price b {font-size: 20px;font-weight: bold;}
.detail-cont .lecture-item .price-area .price .discount {display: inline-block;font-size: 14px;color: #084e99;margin-left: 5px}

.detail-cont .lecture-item .option-area {position: relative;display: block;overflow: hidden}
.detail-cont .lecture-item .option-area li {position: relative;display: block;overflow: hidden;min-height: 48px;font-size: 15px;color: #333;padding: 20px 440px 20px 0;border-bottom: 1px dotted #ccc}
.detail-cont .lecture-item .option-area li:first-child {margin-top: -20px}
.detail-cont .lecture-item .option-area li:last-child {margin-bottom: 0;border-bottom: none}
.detail-cont .lecture-item .option-area .option-group {position: relative;overflow: hidden;display: block;}
.detail-cont .lecture-item .option-area .price-area {right: -20px;padding: 0 120px 0 0;}
.detail-cont .lecture-item .option-area .option-group select {width: 100%;max-width: 230px;margin-top: 5px}

.detail-cont .gift-item {position: relative;display: block;overflow: hidden;border: 1px solid #d0dbe1;background: #fafafa}
.detail-cont .gift-item .article {position: relative;display: block;padding: 20px 20px 20px 150px;border-bottom: 1px dotted #ccc;overflow: hidden;}
.detail-cont .gift-item .article.last {border-bottom: none;}
.detail-cont .gift-item .article.soldout:after {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.7);content: "";z-index: 10}
.detail-cont .gift-item .article.soldout:before {position: absolute;top: 50%;left: 50%;width: 150px;height: 40px;border-radius: 40px;background: #084e99;color: #fff;text-align: center;margin: -20px 0 0 -75px;
    font-size: 18px;line-height: 40px;content: "품절";z-index: 11}
.detail-cont .gift-item .chek-area {position: absolute;top: 50%;left: 20px;height: 20px;margin-top: -10px;}
.detail-cont .gift-item .chek-area label {font-size: 15px;color: #222;font-weight: 600;padding-left: 3px}
.detail-cont .gift-item .gift-title {display: block;font-size: 13px;font-weight: 600;color: #333;line-height: 130%}
.detail-cont .gift-item .gift-img {display: block;overflow: hidden;margin-top: 10px}
.detail-cont .gift-item .gift-img img { max-height: 120px; }

.detail-total-price {position: relative;display: block;overflow: hidden;border: 1px solid #d0dbe1;background: #f6f6f6;padding: 30px;width: 1058px;margin: 0 auto 30px;z-index: 10}
.detail-total-price .total-title {float: left;font-size: 20px;font-weight: bold;color: #222;line-height: 40px}
.detail-total-price .total-price {float: right;}
.detail-total-price .total-price li {position: relative;float: left;font-size: 18px;color: #222;line-height: 40px;padding-left: 50px;}
.detail-total-price .total-price li b {font-weight: bold}
.detail-total-price .total-price li:after {position: absolute;top: 0;left: 10px;width: 30px;height: 40px;line-height: 40px;color: #bbb;content: "+";text-align: center;font-weight: bold;}
.detail-total-price .total-price li:first-child {padding-left: 0}
.detail-total-price .total-price li:first-child:after {display: none}
.detail-total-price .total-price li.total {font-size: 20px;font-weight: bold;line-height: 40px;color: #1f8ce6}
.detail-total-price .total-price li.total b {display: inline-block;font-size: 30px;font-weight: bold;}
.detail-total-price .total-price li.total:after {content: "=";}

.detail-buy-btn {position: relative;display: block;overflow: hidden;padding: 0 40px 40px;text-align: center;z-index: 10}
.detail-buy-btn a {display: inline-block;vertical-align: top;text-align: center;height: 50px;width: 200px;font-size: 17px;border: 1px solid #084e99;border-radius: 5px;letter-spacing: -0.05em;}
.detail-buy-btn .btn-cart {color: #084e99;line-height: 50px;background: #fff;transition:all 0.1s; -webkit-transition:all 0.1s; -moz-transition:all 0.1s;}
.detail-buy-btn .btn-cart .fe {line-height: 38px}
.detail-buy-btn .btn-buy {background: #084e99;color: #fff;line-height: 50px;margin-left: 5px;transition:all 0.1s; -webkit-transition:all 0.1s; -moz-transition:all 0.1s;}


@media only screen and (max-width:1024px){
    .detail-lecture-topCont {padding: 30px 0;}
    .detail-topCont-left {width: 42%;}
    .detail-topCont-right {width: 55%;}
    .detail-lecture-topCont .detail-thumbnail img {width: 100%;height: auto}

    .detail-cont {padding: 0 0 30px;}

    .detail-cont .lecture-item .article {padding: 20px;}
    .detail-cont .lecture-item .tit-area {position: relative;top: 0;left: 0;width: 100%;margin-top: 0;margin-bottom: 10px}

    .detail-cont .lecture-item .txt-area {float: none;}
    .detail-cont .lecture-item .txt-area li {padding-right: 0}

    .detail-cont .lecture-item .price-area {position: relative;top: 0;right: 0;margin-top: 10px;height: auto;width: auto;padding: 0;}
    .detail-cont .lecture-item .price-area.discount-add {height: auto;margin-top:0;}
    .detail-cont .lecture-item .price-area .date {display: none;}
    .detail-cont .lecture-item .price-area .point {position: relative;display: block;float: left;top: 0;right: 0;margin-top: 0;margin-left: 7px;}
    .detail-cont .lecture-item .price-area .del {float: left;margin-right: 5px;line-height: 26px}
    .detail-cont .lecture-item .price-area .price {float: left;}
    .detail-cont .lecture-item .price-area .price b {line-height: 26px}

    .detail-cont .lecture-item .option-area li {padding-right: 0;}
    .detail-cont .lecture-item .option-area .price-area {padding: 0;right: 0}

    .detail-cont .gift-item .article {padding: 20px 20px 20px 130px}
    .detail-cont .gift-item .gift-img img {max-width: 100%}

    .detail-total-price {padding: 25px;width: 100%;box-sizing: border-box}
    .detail-total-price .total-price li {font-size: 16px;padding-left: 30px;}
    .detail-total-price .total-price li:after {left: 3px;width: 25px;}
    .detail-total-price .total-price li.total {font-size: 17px}
    .detail-total-price .total-price li.total b {font-size: 26px;}
}
@media only screen and (max-width:760px){
    .detail-topCont-left {width: 100%;margin-bottom: 20px;float: none}
    .detail-topCont-right {width: 100%;float: none}

    .detail-cont {padding: 0 0 30px;}
    .detail-cont .area-title span {font-size: 17px;}
    .detail-cont .area-title span:after {right: -7px;width: 5px;height: 5px;}
    .detail-cont .area-title small {font-size: 12px;}

    .detail-cont .lecture-item .txt-area {float: none;margin-bottom: 10px}
    .detail-cont .lecture-item .txt-area select {max-width: 200px}

    .detail-cont .gift-item .gift-img {display: none}
    .detail-cont .gift-item .article.soldout:before {width: 120px;height: 30px;border-radius: 30px;margin: -15px 0 0 -60px;font-size: 15px;line-height: 30px;}

    .detail-total-price {padding: 10px 20px 10px 160px;}
    .detail-total-price .total-title {position: absolute;top: 50%;left: 20px;line-height: 30px;height: 30px;margin-top: -15px;float: none;font-size: 18px;}
    .detail-total-price .total-price {float: none;display: block;}
    .detail-total-price .total-price li {display: block;width: 100%;float: none;padding-left: 0;text-align: right;border-bottom: 1px dotted #ccc}
    .detail-total-price .total-price li:last-child {border-bottom: none}
    .detail-total-price .total-price li:after {display: none}

    .detail-buy-btn {padding: 0 0 30px}
    .detail-buy-btn a {height: 40px;width: 150px;font-size: 17px;}
    .detail-buy-btn .btn-cart {line-height: 40px}
    .detail-buy-btn .btn-cart .fe {line-height: 28px}
    .detail-buy-btn .btn-buy {line-height: 40px;}
}
@media only screen and (max-width:640px){
    .detail-cont .lecture-item .article {padding: 15px;margin-bottom: -1px}
    .detail-cont .lecture-item .chek-area {top: 20px;left: 10px;margin-top: 0;}
    .detail-cont .lecture-item .tit-area {position: relative;top: 0;left: 0;width: 100%;margin-top: 0;margin-bottom: 5px}
    .detail-cont .lecture-item .tit-area .fe {font-size: 18px}
    .detail-cont .lecture-item .tit-area .txt {font-size: 16px;}
    .detail-cont .lecture-item .txt-area {font-size: 13px;}
    .detail-cont .lecture-item .price-area .date {font-size: 14px;}
    .detail-cont .lecture-item .price-area .del {font-size: 13px;}
    .detail-cont .lecture-item .price-area .price {font-size: 14px;float: left;}
    .detail-cont .lecture-item .price-area .price b {font-size: 16px;}
    .detail-cont .lecture-item .price-area .price .discount {font-size: 13px}

    .detail-cont .lecture-item .radio label, .detail-cont .lecture-item .checkbox label {font-size: 13px}

    .detail-cont .gift-item .article {padding: 15px;margin-bottom: -1px}
    .detail-cont .gift-item .chek-area {position: relative;top: 0;left: 0;margin-top: 0;margin-bottom: 10px}

    .detail-cont .gift-item .gift-title {color: #666}
}
@media only screen and (max-width:480px){
    .detail-cont .area-title small {width: 100%;line-height: 20px;display: block;margin-left: 0}

    .detail-total-price {padding: 10px 20px 10px 120px;}
    .detail-total-price .total-title {font-size: 16px;}
    .detail-total-price .total-price li {font-size: 14px;}
    .detail-total-price .total-price li.total {font-size: 15px;}
    .detail-total-price .total-price li.total b {font-size: 20px;}

    .detail-buy-btn a {width: 120px;font-size: 15px;}
}
@media only screen and (max-width:370px){
    .detail-cont .lecture-item .article {padding: 15px 10px;}
    .detail-cont .lecture-item .chek-area {position: relative;top: 0;left: 0;margin-left: -3px;margin-bottom: 5px}

    .detail-total-price {padding: 5px 20px 5px 120px;}
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	상세뷰_상단 교재영역
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.detail-book-topCont {position: relative;display: block;padding: 40px;overflow: hidden;z-index: 10}

.book-topCont-left {position: relative;display: block;padding-left: 230px;width: 520px;min-height: 288px;float: left;}
.book-topCont-right {position: relative;display: block;width: 350px;float: right;}

.book-topCont-left .bookCoverBox {position: absolute;top: 0;left: 0;}
.book-topCont-left .bookCoverBox:hover .book a:after {display: none}
.book-topCont-left .bookCoverBox:hover .book a:before {display: none}

.detail_bookinfo {position: relative;display: block;overflow: hidden;padding: 10px 0}

.detail_bookinfo .title_box {position: relative;display: block;}
.detail_bookinfo .title_box h3 {display: block;font-size: 25px;color: #222;letter-spacing: -0.03em;line-height: 120%;}
.detail_bookinfo .title_box p {display: block;font-size: 15px;color: #777;margin-top: 5px}

.detail_bookinfo .rating_box {position: relative;display: block;overflow: hidden;margin-top: 15px}
.detail_bookinfo .rating_box span {display: inline-block;vertical-align: top;line-height: 25px;font-size: 12px;}
.detail_bookinfo .rating_box a {display: inline-block;vertical-align: top;line-height: 23px;border: 1px solid #d0dbe1;padding: 0 5px;font-size: 12px;}
.detail_bookinfo .rating_box a:hover {border: 1px solid #f44336;color: #f44336}

.detail_bookinfo .book_info_text {position: relative;display: block;overflow: hidden;margin: 20px 0 25px}
.detail_bookinfo .book_info_text ul {display: block;overflow: hidden}
.detail_bookinfo .book_info_text li {position: relative;display: inline-block;color: #666;line-height: 28px;float: left;padding-right: 10px;margin-right: 10px;font-size: 13px}
.detail_bookinfo .book_info_text li:after {position: absolute;top: 50%;right: 0;width: 1px;height: 10px;margin-top: -5px;background: #bbb;content: ""}
.detail_bookinfo .book_info_text li:last-child {margin-right: 0;padding-right: 0;}
.detail_bookinfo .book_info_text li:last-child:after {display: none}
.detail_bookinfo .book_info_text li b {display: inline-block;color: #333;font-weight: 600}

.book-topCont-right .detail-info li {padding: 12px 10px 12px 80px}
.book-topCont-right .detail-info li .title { width: 60px}


@media only screen and (max-width:1024px){
    .detail-book-topCont {padding: 30px 0;}
    .book-topCont-left {width: 100%;float: none;box-sizing: border-box;}
    .book-topCont-right {width: 100%;float: none;margin-top: 30px;}

    .detail_bookinfo .title_box h3 {font-size: 22px;}
    .detail_bookinfo .title_box p {font-size: 14px}

    .detail_bookinfo .rating_box {margin-top: 5px}

    .detail_bookinfo .book_info_text {margin: 5px 0 0}
    .detail_bookinfo .book_info_text li {display:block;line-height: 22px;float: none;padding-right: 0;margin-right: 0;}
    .detail_bookinfo .book_info_text li:after {display: none}

}
@media only screen and (max-width:760px){
    .book-topCont-left {min-height: 100px}
    .book-topCont-left {padding-left: 140px;}

    .detail_bookinfo {padding: 0}
    .detail_bookinfo .title_box h3 {font-size: 20px;}
    .detail_bookinfo .title_box p {font-size: 13px}
}
@media only screen and (max-width:640px){
    .book-topCont-left {padding-left: 110px;}
    .book-topCont-right .detail-info li {padding: 12px 10px 12px 60px}
    .book-topCont-right .detail-info li .title { width: 40px}

    .detail_bookinfo .title_box h3 {font-size: 17px;}
}
@media only screen and (max-width:400px){
    .book-topCont-left {padding-left: 90px;}
    .detail_bookinfo .title_box h3 {font-size: 16px;}
}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	장바구니 및 결재
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.order-area-wrap {position: relative;display: block;overflow: hidden;width: 1200px;margin: 0 auto;padding: 50px 0}
.order-title {position: relative;display: block;overflow: hidden;margin-bottom: 15px}
.order-title h3 {float: left;font-size: 30px;color: #222;line-height: 35px;letter-spacing: -0.05em;}
.order-title .stxt {float: left;font-size: 16px;line-height: 35px;margin-left: 10px}
.order-asbtn {position: absolute;top: 40px;right: 0;overflow: hidden}
.order-asbtn li {float: left;}
.order-asbtn li .checkbox {margin: 7px 10px 0 0}

.order-list {position: relative;display: block;overflow: hidden;}
.order-list .item {position: relative;display: block;overflow: hidden;border: 1px solid #d0dbe1;border-top: 2px solid #98a6ad;padding: 0 15px;margin-bottom: 15px}
.order-list li {position: relative;display: block;overflow: hidden;padding: 15px 0;border-bottom: 1px dotted #ccc;}
.order-list li:last-child {border-bottom: none}
.order-list li .title {display: block;overflow: hidden;font-size: 15px;color: #222}
.order-list li .checkbox {overflow: hidden}
.order-list li .checkbox label {display: block;}

.order-list li .price-area {position: absolute;top: 50%;right: 10px;margin-top: -13px;height: 26px;}
.order-list li .price-area div {float: left;line-height: 26px}
.order-list li .price-area .del {display: block;font-size: 16px;color: #888;}
.order-list li .price-area .price {display: block;font-size: 16px;color: #1f8ce6;line-height: 26px;margin-left: 5px}
.order-list li .price-area .price b {font-size: 20px;font-weight: bold;}
.order-list li .price-area .price .discount {display: inline-block;font-size: 14px;color: #084e99;margin-left: 5px}
.order-list li .price-area .point {margin-left: 10px}

.orderSub {position: relative;display: inline-block;overflow: hidden;background: #f2f5f7;border-radius: 5px;padding: 10px 20px;margin-top: 7px}
.orderSub li {position: relative;display: block;margin-bottom: 3px;padding: 0 0 0 10px;border-bottom: none;}
.orderSub li:last-child {margin-bottom: 0}
.orderSub li:after {position: absolute;top: 5px;left: 0;width: 1px;height: 8px;background: #98a6ad;content: ""}
.orderSub li:before {position: absolute;top: 12px;left: 0;width: 7px;height: 1px;background: #98a6ad;content: ""}

.option_group {position: relative;display: block;overflow: hidden;margin-top: 10px}
.option_group li {float: left;padding: 0;border-bottom: none;margin-left: 10px;}
.option_group li:first-child {margin-left: 0}

.cart-total-wrap {position: relative;display: block;border: 1px solid #d0dbe1;background: #fafafa;padding: 30px 30px 30px 180px;overflow: hidden}
.cart-total-wrap .title {position: absolute;top: 50%;left: 0;line-height: 40px;font-size: 20px;color: #222;width: 150px;text-align: center;border-right: 1px solid #d0dbe1;font-weight: bold;margin-top: -20px}
.cart-total-wrap ul {display: block;overflow: hidden;float: right}
.cart-total-wrap li {position: relative;float: left;font-size: 17px;padding-left: 50px;line-height: 40px}
.cart-total-wrap li b {font-weight: bold;color: #222;font-size: 20px}
.cart-total-wrap li.total {color: #084e99;}
.cart-total-wrap li.total b {color: #084e99;font-size: 27px}
.cart-total-wrap li:after {position: absolute;top: 0;left: 10px;width: 30px;height: 40px;line-height: 40px;color: #bbb;content: "+";text-align: center;font-weight: bold;}
.cart-total-wrap li:first-child {padding-left: 0}
.cart-total-wrap li:first-child:after {display: none}
.cart-total-wrap li.total:after {content: "=";}

.order-cont {position: relative;display: block;overflow: hidden;}
.order-cont ul {display: block;overflow: hidden;border-top: 2px solid #98a6ad;}
.order-cont li {position: relative;padding: 10px 10px 10px 145px;border-bottom: 1px solid #d0dbe1;font-size: 15px;min-height: 34px;line-height: 34px}
.order-cont li .title {position: absolute;top: 0;left: 0;width: 125px;height: 100%;/*background: #f2f5f7*/}
.order-cont li .title span {position: absolute;top: 50%;left: 0;width: 110px;height: 30px;line-height: 30px;margin-top: -15px;color: #222;font-size: 15px;padding-left: 15px}

.order-cont li .price {font-size: 17px;color: #222;font-weight: bold}
.order-cont li .total-price {font-size: 23px;color: #084e99;font-weight: bold}

.order-form {position: relative;display: block;overflow: hidden;margin: 4px 0}
.order-form.phone select {width: 100px;float: left;}
.order-form.phone input[type=text] {width: 100px;float: left;}
.order-form .btn {line-height: 30px;height: 30px;padding: 0 10px}
.order-form-text {float: left;line-height: 34px;margin: 0 10px;color: #888}

.order-complete {position: relative;display: block;border: 1px solid #d0dbe1;width: 800px;margin: 0 auto;padding-bottom: 40px}
.order-complete .order-cont {padding: 40px 70px}
.order-complete .complete-title {position: relative;display: block;overflow: hidden;text-align: center;font-size: 30px;color: #222;padding: 40px 20px;background: #f2f5f7;border-bottom: 1px solid #d0dbe1}
.order-complete .complete-title div {display: inline-block}
.order-complete .complete-title b {display: inline-block;line-height: 40px;float: left;font-weight: normal}
.order-complete .complete-title .fe {font-size: 30px;line-height: 38px;float: left;margin-right: 7px;color: #084e99}

@media only screen and (max-width:1024px){
    .order-area-wrap {width: 100%;padding: 40px 15px;box-sizing: border-box}
    .order-asbtn {right: 15px;}

    .order-list li .price-area {position: relative;top: 0;right: 0;margin-top: 10px;}

    .cart-total-wrap {padding: 10px 20px 10px 180px;}
    .cart-total-wrap .title {border-right: none;}
    .cart-total-wrap ul {width: 100%;}
    .cart-total-wrap li {display: block;float: none;font-size: 15px;padding-left: 0;line-height: 50px;text-align: right;border-top: 1px dotted #ccc}
    .cart-total-wrap li b {font-size: 18px}
    .cart-total-wrap li.total b {font-size: 25px}
    .cart-total-wrap li:after {display: none}
    .cart-total-wrap li:first-child {border-top: none}

    .order-complete {width: 100%;max-width: 700px}
    .order-complete .order-cont {padding: 40px}

}
@media only screen and (max-width:760px){

    .order-title h3 {font-size: 25px;}
    .order-title .stxt {font-size: 15px;}

    .order-list li .title {font-size: 14px;}

    .order-list li .price-area .del {font-size: 14px;}
    .order-list li .price-area .price {font-size: 15px;}
    .order-list li .price-area .price b {font-size: 18px;}
    .order-list li .price-area .price .discount {font-size: 13px;}

    .orderSub li {font-size: 13px}

    .order-cont li .price {font-size: 17px;color: #222;font-weight: bold}
    .order-cont li .total-price {font-size: 23px;color: #084e99;font-weight: bold}

    .order-form {position: relative;display: block;overflow: hidden;margin: 4px 0}
    .order-form.phone select {width: 100px;float: left;}
    .order-form.phone input[type=text] {width: 100px;float: left;}
    .order-form .btn {line-height: 30px;height: 30px;padding: 0 10px}
    .order-form-text {float: left;line-height: 34px;margin: 0 10px;color: #888}

    .order-complete .complete-title {font-size: 25px;padding: 20px 20px;}
    .order-complete .complete-title .fe {font-size: 25px;}

}
@media only screen and (max-width:640px){

    .order-title {margin-bottom: 5px}
    .order-title h3 {font-size: 20px;}
    .order-title .stxt {font-size: 14px;}
    .order-asbtn {position: relative;top: 0;right: 0;margin-bottom: 10px}

    .order-list li .title {font-size: 14px;}

    .cart-total-wrap {padding: 10px 20px 10px 130px;}
    .cart-total-wrap .title {width: 100px;}
    .cart-total-wrap li {font-size: 13px;line-height: 40px;}
    .cart-total-wrap li b {font-size: 16px}
    .cart-total-wrap li.total b {font-size: 20px}

    .order-cont li {padding: 10px 10px 10px 120px;}
    .order-cont li .title span {font-size: 14px;}

    .order-cont li .price {font-size: 15px}
    .order-cont li .total-price {font-size: 18px}

    .order-form.phone select {width: 26%;}
    .order-form.phone input[type=text] {width: 26%;}

}
@media only screen and (max-width:460px){

    .order-area-wrap {padding: 30px 15px;}

    .order-list .item {padding: 0 10px;}

    .cart-total-wrap {padding: 10px 20px 10px 100px;}
    .cart-total-wrap .title {width: 80px;font-size: 15px}

    .order-cont li {padding: 15px 0;font-size: 13px;line-height: 150%}
    .order-cont li .title {position: relative;width: 100%;height:auto;background: none;margin-bottom: 5px}
    .order-cont li .title span {position: relative;top: 0;height: auto;line-height: 25px;margin-top: 0;text-align: left;font-size: 15px;padding-left: 0}

    .order-cont li .price {font-size: 17px;color: #222;font-weight: bold}
    .order-cont li .total-price {font-size: 23px;color: #084e99;font-weight: bold}

    .order-complete .complete-title {font-size: 20px;padding: 15px;}
    .order-complete .complete-title .fe {font-size: 20px;}
    .order-complete .order-cont {padding: 20px !important}

}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	나의 포인트
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.myPoint-top {position: relative;display: block;overflow: hidden;border: 1px solid #d0dbe1;background: #fafafa;padding: 30px;text-align: center;margin-bottom: 20px}
.myPoint-top .btxt {display: inline-block;font-size: 20px;color: #222;font-weight: bold;line-height: 30px;margin-bottom: 5px}
.myPoint-top .btxt .point {font-size: 20px;line-height: 30px;font-weight: bold;color: #084e99;padding-left: 23px}
.myPoint-top .btxt .point:before {background: #084e99;width: 20px;height: 20px;font-size: 15px;line-height: 22px}
.myPoint-top .stxt {display: block;font-size: 16px}

.point-responsiveTbl {position: relative;display: block;overflow: hidden;}
.point-responsiveTbl .head {position: relative;display: block;padding: 12px 0;border: 1px solid #d0dbe1;background: #fafafa}
.point-responsiveTbl .head ul {display: block;overflow: hidden}
.point-responsiveTbl .head li {float: left;text-align: center;line-height: 26px;color: #151515;font-size: 15px}
.point-responsiveTbl .item {position: relative;display: block;padding: 12px 0;border: 1px solid #d0dbe1;margin-top: -1px}
.point-responsiveTbl .item ul {display: block;overflow: hidden}
.point-responsiveTbl .item li {float: left;text-align: center;line-height: 26px;}
.point-responsiveTbl .item li b {display: none}

.point-responsiveTbl .col1 {width: 14%}
.point-responsiveTbl .col2 {width: 30%}
.point-responsiveTbl .col3 {width: 20%}
.point-responsiveTbl .col4 {width: 18%}
.point-responsiveTbl .col5 {width: 18%}

.point-responsiveTbl .col80 {width: 79%}
.point-responsiveTbl .col20 {width: 20%}

@media only screen and (max-width:1024px){
    .myPoint-top {padding: 20px;}
    .myPoint-top .btxt {font-size: 17px;}
    .myPoint-top .btxt .point {font-size: 17px;}
    .myPoint-top .stxt {font-size: 15px}
}
@media only screen and (max-width:760px){
    .myPoint-top {padding: 20px;}
    .myPoint-top .btxt {font-size: 16px;}
    .myPoint-top .btxt .point {font-size: 16px;}
    .myPoint-top .stxt {font-size: 13px}

    .point-responsiveTbl .head {display: none;}

    .point-responsiveTbl .item {padding: 5px 15px;margin-top: 0;margin-bottom: 10px}
    .point-responsiveTbl .item li {float: none;width: 100% !important;padding: 5px 0;text-align: right;border-bottom: 1px dotted #ccc}
    .point-responsiveTbl .item li:last-child {margin-bottom: 0;border-bottom: none;}
    .point-responsiveTbl .item li b {display: inline-block;float: left;width: 120px;text-align: left}
}
@media only screen and (max-width:400px){
    .point-responsiveTbl .item li {font-size: 13px}
    .point-responsiveTbl .item li b {width: 110px}
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	회원탈퇴
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.withdraw-wrap {position: relative;display: block;overflow: hidden}
.withdraw-top {position: relative;display: block;padding-bottom: 34px;background: url("/static/images/design/content/pattern01.png") repeat-x bottom;}
.withdraw-top .title {display: block;font-size: 25px;font-weight: bold;color: #222;margin-bottom: 15px}
.withdraw-top .title i {font-style: italic;font-weight: bold;}

.withdraw-cntr {position: relative;display: block;padding: 30px 0}

.withdraw-chek {position: relative;display: block;overflow: hidden;border: 1px solid #d0dbe1;background: #fafafa;padding: 30px}
.withdraw-chek li {float: left;width: 33.33%}


@media only screen and (max-width:640px){
    .withdraw-chek {padding: 20px}
    .withdraw-chek li {width: 50%}
}
@media only screen and (max-width:400px){
    .withdraw-chek li {font-size: 13px}
}
@media only screen and (max-width:360px){
    .withdraw-chek {padding: 15px}
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	구매내역 상세
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.order-detail-box {position: relative;display: block;padding-bottom: 34px;margin-bottom: 30px;background: url("/static/images/design/content/pattern01.png") repeat-x bottom;}
.order-detail-title {position: relative;display: block;overflow: hidden;margin-bottom: 10px;font-size: 20px;color: #222;font-weight: bold;}
.order-detailTbl {position: relative;display: block;overflow: hidden;border-top: 2px solid #98a6ad}
.order-detailTbl ul {overflow: hidden;display: table;width: 100%;}
.order-detailTbl li {position: relative;border-bottom: 1px solid #d0dbe1;vertical-align: middle;}
.order-detailTbl li .odtl-title {position: absolute;top: 0;left: 0;display: block;text-align: center;font-size: 15px;color: #222;background: #fafafa;padding: 10px 0}
.order-detailTbl li .odtl-text {position: relative;display: block;padding: 10px 0;}

.order-detailTbl.horizontal li {display: table-cell;padding: 45px 10px 0 10px}
.order-detailTbl.horizontal li:after {position: absolute;top: 0;right: 0;width: 1px;height: 100%;background: #ddd;content: ""}
.order-detailTbl.horizontal li .odtl-title {width: 100%;border-bottom: 1px solid #d0dbe1;}
.order-detailTbl.horizontal li .odtl-text {text-align: center;}
.order-detailTbl.horizontal li.full {width: 100%;display: table-caption;box-sizing: border-box}
.order-detailTbl.horizontal li.full:after,
.order-detailTbl.horizontal li:last-child:after {display: none}

.order-detailTbl.vertical li {display: block;padding: 0 0 0 200px;}
.order-detailTbl.vertical li .odtl-title {width: 180px;border-right: 1px solid #d0dbe1;height: 100%;padding: 0}
.order-detailTbl.vertical li .odtl-title span {position: absolute;top: 50%;left: 0;width: 100%;height: 26px;line-height: 26px;margin-top: -13px;}
.order-detailTbl.vertical li .odtl-text {text-align: left;}
.order-detailTbl.vertical li,
.order-detailTbl.vertical li .odtl-text {min-height: 26px;line-height: 26px;}

.order-detailTbl .order-list li {padding: 10px 0 !important}
.order-detailTbl .order-list .item {border-top: 1px solid #d0dbe1}
.order-detailTbl .order-list .item:last-child  {margin-bottom: 0}
.order-detailTbl .order-list .item .title {line-height: 20px;font-size: 15px}
.order-detailTbl .order-list .orderSub {padding: 5px 15px}
.order-detailTbl .order-list .orderSub li {padding: 0 0 0 10px !important;border-bottom: none;font-size: 13px;min-height: 22px;line-height: 22px}

.order-detailTbl .price-area {position: relative !important;top: 0 !important;right: 0 !important;margin-top: 0 !important;display: block;}



@media only screen and (max-width:1024px){

    .order-detailTbl li .odtl-title span {position: absolute;top: 50%;left: 0;width: 100%;height: 26px;line-height: 26px;margin-top: -13px;}

    .order-detailTbl.horizontal li {display: block;padding: 0 0 0 200px;}
    .order-detailTbl.horizontal li:after {display: none}
    .order-detailTbl.horizontal li .odtl-title {width: 180px;border-right: 1px solid #d0dbe1;height: 100%;padding: 0;border-bottom: none;}
    .order-detailTbl.horizontal li .odtl-text {text-align: left;}
}
@media only screen and (max-width:760px){
    .order-detailTbl.horizontal li,
    .order-detailTbl.vertical li {padding: 0 0 0 135px;}
    .order-detailTbl.horizontal li .odtl-title,
    .order-detailTbl.vertical li .odtl-title {width: 120px;font-size: 14px}
}
@media only screen and (max-width:640px){

    .order-detailTbl li.product {padding: 0}
    .order-detailTbl li.product .odtl-title {display: none !important}

}
@media only screen and (max-width:400px){
    .order-detailTbl.horizontal li,
    .order-detailTbl.vertical li {padding: 10px;}
    .order-detailTbl.horizontal li .odtl-title,
    .order-detailTbl.vertical li .odtl-title {position: relative;display: block;width: 100%;font-size: 14px;background: none;text-align: left;border-right: none}
    .order-detailTbl.horizontal li .odtl-title span,
    .order-detailTbl.vertical li .odtl-title span {position: relative;display: block;height: auto;top: 0;left: 0;margin-top: 0;line-height: 30px;font-weight: bold}
    .order-detailTbl li .odtl-text {padding: 0}

    .order-detailTbl .order-list .item .title {font-size: 13px}
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	나의 강의실
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.mylecture-list {position: relative;display: block;overflow: hidden}
.mylecture-list .item {position: relative;display: block;border: 1px solid #ddd;padding: 85px 15px 15px 200px;margin-bottom: 15px;}
.mylecture-list .item:last-child {margin-bottom: 0}
.mylecture-list .item .thumbnail {position: absolute;top: 85px;left: 15px;width: 165px;}
.mylecture-list .item .thumbnail img {width: 100%;}
.mylecture-list .item .title {position: absolute;display: block;top: 0;left: 0;width: 543px;height: 70px;line-height: 70px;padding: 0 360px 0 15px;border-bottom: 1px solid #ddd;color: #222;font-size: 15px;background: #fafafa}
.mylecture-list .item .title a {display: inline-block;color: #222;font-weight: bold;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;max-width: 100%;}
.mylecture-list .item .item-text {position: relative;display: block;overflow: hidden}
.mylecture-list .item .item-text li {float: left;width: 50%;min-height: 30px;line-height: 30px;font-size: 14px;overflow: hidden}
.mylecture-list .item .item-text li b {position: relative;color: #222;float: left;width: 100px;padding-left: 10px;}
.mylecture-list .item .item-text li b:after {position: absolute;top: 12px;left: 0;width: 3px;height: 3px;border-radius: 50%;overflow: hidden;content: "";background: #888}
.mylecture-list .item .item-text li span {float: left;}
.mylecture-list .item .curriculum {width: 100% !important;}
.mylecture-list .item .curriculum b {display: block;width: 100% !important;float: none !important;}
.mylecture-list .item .sub-curriculum {position: relative;display: block;background: #f6f6f6;border: 1px solid #e3e3e3;padding: 5px 15px;border-radius: 5px;overflow: hidden}
.mylecture-list .item .sub-curriculum li {width: 100% !important;display: block;float: none !important;border-bottom: 1px dotted #bbb;padding: 6px 0;overflow: hidden}
.mylecture-list .item .sub-curriculum li:last-child {border-bottom: none}
.mylecture-list .item .sub-curriculum li .txt {display: block;width: calc(100% - 105px);text-overflow: ellipsis;overflow: hidden;white-space: nowrap;line-height: 30px;height: 25px;padding-left: 10px;background: url("/static/images/design/content/list_ico.png") no-repeat left 12px}
.mylecture-list .item .sub-curriculum li .btn {margin: 4px 0;vertical-align: middle;float: right}

.mylecture-list .item .btnWrap {position: absolute;top: 0;right: 0;}
.mylecture-list .item .btnWrap a {position: relative;float: left;width: 80px;height: 58px;padding-top: 12px;text-align: center}
.mylecture-list .item .btnWrap a span {height: 20px;line-height: 20px;}
.mylecture-list .item .btnWrap a .fe {display: inline-block;font-size: 21px;}
.mylecture-list .item .btnWrap a .txt {display: block;font-size: 13px}
.mylecture-list .item .btnWrap a:last-child {width: 100px;}
.mylecture-list .item .btnWrap a:hover {color: #084e99}

.progress-area {position: relative;display: block;overflow: hidden;padding: 10px 60px;background: #ebeef1;border-radius: 10px;margin-top:10px}
.progress-area .progressTit {position: absolute;top: 10px;left: 15px;line-height: 20px;}
.progress-area .progress {position: relative;display: block;height: 20px;background: #fff;overflow: hidden;border-radius: 20px}
.progress-area .progress .progress-bar {position: relative;display: block;overflow: hidden;height: 20px;animation: progress-bar-stripes 1s linear infinite;-webkit-animation: progress-bar-stripes 1s linear infinite;
    background-color: #689f38!important;background-image: linear-gradient(45deg,hsla(0,0%,100%,.15) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.15) 0,hsla(0,0%,100%,.15) 75%,transparent 0,transparent);background-size: 1rem 1rem;border-radius: 20px}
.progress-area .progressNum {position: absolute;top: 10px;right: 15px;line-height: 20px;text-align: right}


@media only screen and (max-width:1024px){
    .mylecture-list .item .title {width: 100%;box-sizing: border-box}
    .mylecture-list .item .item-text li {font-size: 14px;}
}
@media only screen and (max-width:840px){
    .mylecture-list .item {padding: 65px 15px 85px 200px;}
    .mylecture-list .item .thumbnail {top: 65px;}
    .mylecture-list .item .title {height: 50px;line-height: 50px;padding: 0 15px;}
    .mylecture-list .item .title a {display: inline-block;color: #222;}
    .mylecture-list .item .item-text li {float: none;width: 100%;}

    .mylecture-list .item .btnWrap {position: absolute;top: auto;bottom: 0;left: 0;width: 100%;overflow: hidden;background: #f6f6f6;text-align: center}
    .mylecture-list .item .btnWrap a {float: none;display: inline-block;vertical-align: top;width: 70px;font-size: 13px;}
    .mylecture-list .item .btnWrap a:last-child {width: 85px;}
}
@media only screen and (max-width:540px){

    .mylecture-list .item {padding: 65px 15px 85px 15px;}
    .mylecture-list .item .thumbnail {position: relative;top: 0;left: 0;width: 100%;}
    .mylecture-list .item .thumbnail img  {width: 100%;height: auto;max-height: 100% !important}
    .mylecture-list .item .item-text {padding: 15px 0}
    .mylecture-list .item .item-text li {font-size: 13px;}
    .mylecture-list .item .item-text li b {width: 80px;}
    .progress-area {margin-top:0;font-size: 13px}

}
@media only screen and (max-width:400px){
    .order-detailTbl.horizontal li,
    .order-detailTbl.vertical li {padding: 10px;}
    .order-detailTbl.horizontal li .odtl-title,
    .order-detailTbl.vertical li .odtl-title {position: relative;display: block;width: 100%;font-size: 14px;background: none;text-align: left;border-right: none}
    .order-detailTbl.horizontal li .odtl-title span,
    .order-detailTbl.vertical li .odtl-title span {position: relative;display: block;height: auto;top: 0;left: 0;margin-top: 0;line-height: 30px;font-weight: bold}
    .order-detailTbl li .odtl-text {padding: 0}

    .order-detailTbl .order-list .item .title {font-size: 13px}
}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	리스트 테이블
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.list-responsiveTbl {position: relative;display: block;overflow: hidden;}
.list-responsiveTbl ul {display: table;overflow: hidden;width: 100%;}
.list-responsiveTbl li {position: relative;display: table-cell;vertical-align: middle;line-height: 150%;text-align: center;padding: 10px}
.list-responsiveTbl li .mtit {display: none}

.list-responsiveTbl .head {position: relative;display: block;border-top: 2px solid #98a6ad;border-bottom: 1px solid #d0dbe1;background: #fafafa}
.list-responsiveTbl .head li {color: #151515;font-size: 15px;text-align: center !important;padding: 15px 10px}
.list-responsiveTbl .item {position: relative;display: block;border-bottom: 1px solid #d0dbe1;}
.list-responsiveTbl .title a {display: inline;color: #151515;}
.list-responsiveTbl .number a {display: inline;color: #888;}

.list-responsiveTbl.order .col1 {width: 12%}
.list-responsiveTbl.order .col2 {width: 42%;text-align: left;}
.list-responsiveTbl.order .col3 {width: 12%}
.list-responsiveTbl.order .col4 {width: 12%}
.list-responsiveTbl.order .col5 {width: 12%}
.list-responsiveTbl.order .col6 {width: 12%}

.list-responsiveTbl.refund .col1 {width: 12%}
.list-responsiveTbl.refund .col2 {width: 42%;text-align: left;}
.list-responsiveTbl.refund .col3 {width: 12%}
.list-responsiveTbl.refund .col4 {width: 12%}
.list-responsiveTbl.refund .col5 {width: 12%}
.list-responsiveTbl.refund .col6 {width: 12%}

.list-responsiveTbl.lecture .col1 {width: 15%}
.list-responsiveTbl.lecture .col2 {width: 55%;text-align: left;}
.list-responsiveTbl.lecture .col3 {width: 15%}
.list-responsiveTbl.lecture .col4 {width: 15%}

.list-responsiveTbl.pause .col1 {width: 45%}
.list-responsiveTbl.pause .col2 {width: 15%}
.list-responsiveTbl.pause .col3 {width: 15%}
.list-responsiveTbl.pause .col4 {width: 25%}

@media only screen and (max-width:900px){
    .list-responsiveTbl .item {border: 1px solid #d0dbe1}
    .list-responsiveTbl ul {display: block;padding: 54px 15px 10px;box-sizing: border-box}
    .list-responsiveTbl li {display: block;width: 100% !important;box-sizing: border-box;overflow: hidden;text-align: left;padding: 0;}
    .list-responsiveTbl li.top {position: absolute;top: 0;left: 0;border-bottom: 1px solid #d0dbe1;background: #fafafa;padding: 10px 15px;}
    .list-responsiveTbl li .mtit {display: inline-block;width: 70px}

    .list-responsiveTbl .head {display: none}
    .list-responsiveTbl .item {margin-top: 0;margin-bottom: 15px;overflow: hidden}
    .list-responsiveTbl .item .date {float: left;}
    .list-responsiveTbl .item .btn-r {float: right}

    .list-responsiveTbl.order .col2 {margin-bottom: 10px}
    .list-responsiveTbl.order .col5 {position: absolute;bottom: 10px;right: 15px;width: auto !important}

    .list-responsiveTbl.refund .col2 {margin-bottom: 10px}
    .list-responsiveTbl.refund .col6 {position: absolute;bottom: 10px;right: 15px;width: auto !important}
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	나의강의실 상세
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.lecture-view-title {position: relative;display: block;border-radius: 5px;padding: 15px 20px;background: #eee;margin-bottom: 20px}
.lecture-view-title span {position: relative;display: inline-block;padding-left: 10px;font-weight: bold;font-size: 18px;color: #222;line-height: 130%;}
.lecture-view-title span:after {position: absolute;top: 5px;left: 0;width: 4px;height: 18px;background: #084e99;content: ""}

.lecture-view-topCont {position: relative;display: block;overflow: hidden;margin-bottom: 30px}
.lecture-topCont-left {position: relative;width: 260px;float: left;}
.lecture-topCont-right {position: relative;width:630px;float: right;}

.lecture-topCont-left .detail-thumbnail {position: relative;display: block;}
.lecture-topCont-left .detail-thumbnail img {width: 260px;height: 220px;}

.continue-view {position: relative;display: block;overflow: hidden;background: #eef5ff;padding: 20px;text-align: center}
.continue-view .text {display: block;line-height: 130%;font-weight: bold;color: #222;height: 38px;}
.continue-view .btns {display: block;margin-top: 15px;}

.lecture-topCont-right .lecture-info {position: relative;display: block;margin-bottom: 20px}
.lecture-topCont-right .lecture-info ul {display: block;overflow: hidden}
.lecture-topCont-right .lecture-info li {position: relative;display: block;padding: 8px 10px 8px 120px;min-height: 25px;border-bottom: 1px dotted #c9d3e2;line-height: 25px;font-size: 13px;color: #666}
.lecture-topCont-right .lecture-info li:last-child {border-bottom: none}
.lecture-topCont-right .lecture-info li .title {position: absolute;top: 8px;left: 10px;width: 100px;color: #222;font-weight: bold}
.lecture-topCont-right .lecture-info li .delivery {font-size: 15px;display: inline-block;margin-right: 3px;vertical-align: top;line-height: 22px;}
.lecture-topCont-right .lecture-info li .delivery.free {color: #f44336}
.lecture-topCont-right .lecture-info li del {display: inline-block;font-size: 15px;color: #777}
.lecture-topCont-right .lecture-info li .price {display: block;font-size: 16px;color: #1f8ce6;margin: 3px 0;font-family: AritaDotum;line-height: 130%}
.lecture-topCont-right .lecture-info li .price b {display: inline-block;font-size: 25px;font-weight: bold;}
.lecture-topCont-right .lecture-info li .price .discount {display: inline-block;font-size: 14px;color: #084e99;font-weight: normal}
.lecture-topCont-right .lecture-info li select {width: 100%;max-width: 230px}
.lecture-topCont-right .lecture-info li .block {display: block !important}

/*탭*/
.curriculum-tab {position: relative;display: block;overflow: hidden;margin-bottom: 20px}
.curriculum-tab ul {overflow: hidden}
.curriculum-tab li {display: block;width: 459px;float: left;padding: 1px 1px 0 0;}
.curriculum-tab li a {display: block;text-align: center;background: #ebeef1;height: 45px;line-height: 45px;font-size: 15px;color: #333;}
.curriculum-tab li.active a {background: #084e99;color: #fff;}

/*커리큘럼 리스트*/
.lecture-curriculum-list {position: relative;display: block;overflow: hidden}
.lecture-curriculum-list ul {display: block;overflow: hidden;}
.lecture-curriculum-list li {position: relative;display: block;border: 1px solid #d0dbe1;border-radius: 5px;margin-bottom: 10px;padding: 10px 115px 10px 70px}
.lecture-curriculum-list.chek li {width: 703px;padding: 10px 115px 10px 70px;margin-left: 30px}
.lecture-curriculum-list li .number {position: absolute;top: 0;left: 0;width: 55px;height: 100%;background: #f3f3f3;}
.lecture-curriculum-list li .number span {position: absolute;top: 50%;left: 0;width: 100%;height: 30px;line-height: 30px;margin-top: -15px;font-size: 13px;color: #333;font-weight: bold;text-align: center;}
.lecture-curriculum-list li .txtBox {position: relative;display: block;width: 580px;}
.lecture-curriculum-list li .txtBox b {display: block;font-weight: bold;color: #222;line-height: 26px;}
.lecture-curriculum-list li .txtBox span {display: block;}
.lecture-curriculum-list li .timeBox {position: relative;display: inline-block;margin-top: 5px;border-radius: 4px;background: #eee;padding: 5px 15px;clear: both}
.lecture-curriculum-list li .timeBox ul {overflow: hidden;}
.lecture-curriculum-list li .timeBox li {float: left;width: auto;padding: 0;border: none;margin: 0 15px 0 0;border-radius: 0}
.lecture-curriculum-list li .timeBox li b {color: #222;}
.lecture-curriculum-list li .btnWrap {display: block}
.lecture-curriculum-list li .fileBox {position: relative;width: 100px;height: 30px;font-size: 16px;text-align: center;display: inline-block;vertical-align: top}
.lecture-curriculum-list li .downBox {position: relative;width: 100px;height: 30px;font-size: 16px;text-align: center;display: inline-block;vertical-align: top}
.lecture-curriculum-list li .btnBox  {position: absolute;top: 50%;right: 10px;width: 120px;height: 30px;margin-top: -15px;text-align: center}
.lecture-curriculum-list li .btnBox .btn-play {position: relative;display: block;background: #1f8ce6;overflow: hidden;border-radius: 3px;line-height: 30px;padding: 0 17px;}
.lecture-curriculum-list li .btnBox .btn-play span {float: left;line-height: 30px;font-size: 14px;color: #fff;}
.lecture-curriculum-list li .btnBox .btn-play .txt {margin-left: 3px}

.lecture-curriculum-list.chek li .chek {position: absolute;top: 50%;left: -30px;margin-top: -20px}

.detail-cont.lecture-curriculum-list li {width: 933px;}

@media only screen and (max-width:1024px){

    .lecture-topCont-left {width: 100%;float: none;}
    .lecture-topCont-right {width:100%;float: none;}

    .lecture-topCont-left .detail-thumbnail {display: none;}

    .continue-view {padding: 20px 120px 20px 20px;border-radius: 5px}
    .continue-view .text {height: auto;text-align: left}
    .continue-view .btns {position: absolute;top: 50%;right: 20px;margin-top: -19px;}

    .lecture-topCont-right .lecture-info {margin: 15px 0}

    /*탭*/
    .curriculum-tab li {width: 50%;box-sizing: border-box}
    .curriculum-tab li a {font-size: 14px;}

    /*커리큘럼 리스트*/
    .lecture-curriculum-list li {width: 100%;padding: 10px 140px 10px 85px;box-sizing: border-box}
    .lecture-curriculum-list.chek li {width: calc(100% - 30px);padding: 10px 140px 10px 85px;}
    .lecture-curriculum-list li .txtBox {width: 100%;}
    .lecture-curriculum-list li .txtBox b {line-height: 150%}
    .lecture-curriculum-list li .timeBox {margin-bottom: 10px}

    .detail-cont.lecture-curriculum-list li {width: 100%;}
}
@media only screen and (max-width:760px){

    .lecture-view-title {padding: 12px 20px;}
    .lecture-view-title span {font-size: 18px;}
    .lecture-view-title span:after {top: 5px;height: 14px;}

    .curriculum-tab li a {font-size: 13px;}

    /*커리큘럼 리스트*/
    .lecture-curriculum-list li {padding: 10px 10px 10px 60px;}
    .lecture-curriculum-list.chek li {padding: 10px 10px 10px 60px;}
    .lecture-curriculum-list li .number {width: 50px;}
    .lecture-curriculum-list li .number span {font-size: 13px;}
    .lecture-curriculum-list li .txtBox span {font-size: 13px;}
    .lecture-curriculum-list li .timeBox {font-size: 14px;width: 100%;box-sizing: border-box}
    .lecture-curriculum-list li .fileBox {display: inline-block;width: auto;height: auto;margin-bottom: 3px}
    .lecture-curriculum-list li .downBox {display: inline-block;width: auto;height: auto;margin-bottom: 3px}
    .lecture-curriculum-list li .btnBox {position: relative;display: inline-block;width: auto;top: 0;right: 0;margin-top: 0;height: auto;overflow: hidden;text-align: left;vertical-align: top;margin-bottom: 3px}
    .lecture-curriculum-list li .btnBox a {display: inline-block !important}

}
@media only screen and (max-width:640px){

    .lecture-view-title {padding: 12px 15px;}
    .lecture-view-title span {font-size: 16px;}
    .lecture-view-title span:after {top: 4px;height: 13px;}

    .continue-view {padding: 12px 100px 12px 20px;}
    .continue-view .text {font-size: 13px;}
    .continue-view .btns {margin-top: -15px}
    .continue-view .btn {padding: 3px 10px;font-size: 13px}

    .curriculum-tab li {width: 100%;padding: 0;margin-bottom: 1px }
    .curriculum-tab li a {font-size: 13px;}

    .lecture-curriculum-list li .txtBox b {font-size: 13px;}
    .lecture-curriculum-list li .timeBox {font-size: 13px;}
    .lecture-curriculum-list li .btn {font-size: 12px}

}
@media only screen and (max-width:480px){


    /*커리큘럼 리스트*/
    .lecture-curriculum-list li .txtBox span {line-height: 140%}
    .lecture-curriculum-list li .timeBox li {margin-right: 10px}
    .lecture-curriculum-list li .timeBox b .tTipBox {display: none}

}
@media only screen and (max-width:390px){

    .lecture-curriculum-list li .btn {font-size: 11px;padding: 0 7px;}

}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	수강확인증
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.lecture_print_wrap {position: relative;display: block;border: 15px solid #2f3b4d;width: 100%;box-sizing: border-box;height: 700px;padding: 60px 50px;margin: 0 auto;overflow: hidden}
.lecture_print_title {position: relative;display: block;text-align: center;font-size: 35px;color: #111;line-height: 130%;font-weight: 600;margin-bottom: 30px;z-index: 10}
.lecture_print_box {position: relative;display: block;z-index: 10}
.lecture_print_box .title {display: block;font-size: 17px;color: #222;line-height: 120%;margin-bottom: 10px;font-weight: 600;}

.lecture_printTbl {position: relative;display: block;background: #fff;}
.lecture_printTbl table {border-collapse: collapse;border-spacing: 0;table-layout: fixed;width: 100%;clear: both;text-align: center;border-top: 1px solid #ccc;}
.lecture_printTbl th {border: 1px solid #ccc;word-wrap: break-word;padding: 10px 15px;font-weight: 600;color: #333;background: #eaeef0;text-align: center}
.lecture_printTbl td {border: 1px solid #ccc;word-wrap: break-word;padding: 10px 15px;text-align: left;}
.lecture_print_text {position: relative;display: block;margin-top: 10px;text-align: center;color: #333}
.lecture_print_date {position: relative;display: block;margin: 20px 0;text-align: center;color: #333;font-weight: 600;font-size: 15px}

.lecture_print_logo {position: relative;display: block;width: 200px;margin: 0 auto;}
.lecture_print_logo img {width: 100%;}

.lecture_print_bg {position: absolute;top: 0;left: 0;}

@media only screen and (max-width:640px){

    .lecture_print_wrap {padding: 40px 20px;}
    .lecture_print_title {font-size: 25px;}
    .lecture_print_box .title {font-size: 15px;}

    .mSize {width: 100px !important;}

}
@media only screen and (max-width:480px){

    .mSize {width: 80px !important;}
    .lecture_printTbl th {padding: 10px;font-size: 13px}
    .lecture_printTbl td {padding: 10px;font-size: 13px}

    .lecture_print_logo img  {width: 180px}

}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	플레이어
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.lecture_player_wrap {position: relative;display: block;overflow: hidden;width: 100%;margin: 0 auto;}
.lecture_player_head {position: relative;display: block;overflow: hidden;height: 30px;background: #fff;padding: 15px 20px;border-bottom: 1px solid #e3e3e3;}
.lecture_player_head .title {position: relative;display: block;height: 30px;line-height: 30px;font-size: 20px;color: #222;font-weight: 600;letter-spacing: -0.08em;padding-left: 10px;}
.lecture_player_head .title:after {position: absolute;top: 9px;left: 0;width: 4px;height: 16px;background: #084e99;content: ""}
.lecture_player_head .logo {position: absolute;top: 50%;right: 20px;width: 120px;margin-top: -10px}
.lecture_player_head .logo img {width: 100%;}

.lecture_player_cont {position: relative;display: block;overflow: hidden;padding-right: 300px;height: 100%;}
.playerArea {position: relative;display: block;overflow: hidden;width: 100%;height: 100%;background: #000;}

.lecture_player_details {position: fixed;display: block;overflow: hidden;top: 61px;right: 0;width: 300px;height: calc(100% - 61px); background: #fff;}
.lecture_player_details .tabArea {position: relative;display: block;overflow: hidden;background: #fff;}
.lecture_player_details .tabArea li {position: relative;width: 50%;float: left;}
.lecture_player_details .tabArea li:after {position: absolute;top: 0;left: 0;width: 1px;height: 100%;background: #ddd;content: ""}
.lecture_player_details .tabArea li:first-child:after {display: none}
.lecture_player_details .tabArea li a {display: block;text-align: center;line-height: 35px;height: 35px;font-size: 14px;font-weight: 600;color: #333;background: #eee;border-bottom: 1px solid #ddd}
.lecture_player_details .tabArea li.active a {background: #fff;color: #084e99;border-bottom: 1px solid #fff}

.lecture_player_details .tabViwArea {position: relative;display: block;height: calc(100% - 68px);overflow-y: auto;padding: 15px}

.player_curriculum_list {position: relative;display: block;overflow: hidden;border-top: 1px solid #ddd}
.player_curriculum_list li {position: relative;display: block;overflow: hidden;padding: 8px 0 8px 60px;font-size: 12px;border-bottom: 1px solid #ddd;line-height: 150%}
.player_curriculum_list li .number {position: absolute;top: 0;left: 0;width: 50px;height: 100%;background: #f3f3f3;}
.player_curriculum_list li .number span {position: absolute;top: 50%;left: 0;width: 100%;height: 30px;line-height: 26px;margin-top: -13px;text-align: center;}
.player_curriculum_list li .title {display: block;font-weight: 600;color: #333}
.player_curriculum_list li .btns {display: block;margin-top: 3px}
.player_curriculum_list li .btn {height: 18px;line-height: 18px;padding: 0 3px;font-size: 11px;float: left;margin: 0 4px 0 0}

.lecture_player_info {position: relative;display: block;border: 1px solid #c9d3e2;background: #f5f9ff;padding: 8px 10px}
.lecture_player_info ul {display: block}
.lecture_player_info li {position: relative;display: block;padding: 10px 10px 10px 70px;min-height: 18px;border-bottom: 1px dotted #c9d3e2;line-height: 140%;font-size: 12px;color: #666}
.lecture_player_info li:last-child {border-bottom: none}
.lecture_player_info li .title {position: absolute;top: 10px;left: 10px;width: 60px;color: #222;font-weight: bold}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	인사말
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.greet_btit {position: relative;display: block;overflow: hidden;text-align: center;font-size: 30px;font-weight: 600;color: #151515;line-height: 140%;padding-bottom: 20px;margin-bottom: 20px;letter-spacing: -0.08em}
.greet_btit:after {position: absolute;bottom: 0;left: 50%;width: 50px;height: 2px;margin-left: -25px;background: #084e99;content: ""}
.greet_txt {position: relative;display: block;overflow: hidden;font-size: 16px;text-align: center}
.greet_img {display: block;}
.greet_sign {display: block;margin-top: 30px;text-align: center}
.greet_sign span {display: inline-block;font-weight: 600;color: #222;line-height: 140%}
.greet_sign span b {font-size: 25px;}

@media only screen and (max-width:1024px){
    .greet_btit {font-size: 25px;padding: 0 15px 20px;box-sizing: border-box}
    .greet_txt {font-size: 14px;}
    .greet_txt .enter {display: inline}
    .greet_img img {width: 100%}
    .greet_sign span b {font-size: 22px;}
}
@media only screen and (max-width:640px){
    .greet_btit {font-size: 22px;}
    .greet_txt {font-size: 13px;}
    .greet_sign span b {font-size: 20px;}
}
@media only screen and (max-width:460px){
    .greet_btit {font-size: 18px;}
}
@media only screen and (max-width:400px){
    .greet_btit {font-size: 16px;}
}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	교수소개
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.prof_tabViw {position: relative;display: none;overflow: hidden;margin-top: 40px;padding-left: 410px;min-height: 420px}
.prof_tabViw.active {display: block;}

.prof_tabViw .prof_img {position: absolute;top: 0;left: 0;}
.prof_tabViw .prof_textBox {position: relative;display: block;}
.prof_tabViw .prof_stxt {display: block;font-size: 20px;color: #084e99;font-weight: 600;line-height: 140%;letter-spacing: -0.08em}
.prof_tabViw .prof_btit {display: block;font-size: 26px;color: #151515;font-weight: 600;line-height: 140%;letter-spacing: -0.08em}
.prof_tabViw .prof_name {position: relative;display: block;margin: 20px 0 0;}
.prof_tabViw .prof_name:before {position: absolute;top: 0;left: -50px;width: 100%;height: 100%;background: #084e99;padding: 0 0 0 50px;content: "";z-index: 0}
.prof_tabViw .prof_name .neme {position: relative;display: inline-block;color: #fff;font-size: 20px;line-height: 50px;z-index: 10}
.prof_tabViw .prof_name .neme b {display: inline-block;font-size: 30px;font-weight: normal}
.prof_tabViw .prof_name .neme span {position: absolute;top: 15px;right: -125px;display: inline-block;color: rgba(255,255,255,0.3);font-size: 15px;font-weight: 600;letter-spacing: 0.5em;line-height: 24px;}

.prof_tabViw .prof_list {position: relative;display: block;margin-top: 25px;}
.prof_tabViw .prof_list .tit {display: inline-block;width: 100px;text-align: center;border-radius: 35px;line-height: 35px;color: #fff;background: #182538;font-weight: 600;font-size: 15px}
.prof_tabViw .prof_list .txtLst {margin-top: 15px}
.prof_tabViw .prof_list .txtLst b {color: #151515}



@media only screen and (max-width:1024px){
    .prof_tabViw {padding-left: 35%;}
    .prof_tabViw .prof_img {width: 35%}
    .prof_tabViw .prof_img img {width: 100%;}
    .prof_tabViw .prof_textBox {width: calc(100% - 30px);margin-left: 30px}
    .prof_tabViw .prof_stxt {font-size: 17px;}
    .prof_tabViw .prof_btit {font-size: 22px;}
    .prof_tabViw .prof_name .neme {font-size: 18px;line-height: 45px;}
    .prof_tabViw .prof_name .neme b {font-size: 25px;}
    .prof_tabViw .prof_name .neme span {right: -115px;font-size: 14px;}

    .prof_tabViw .prof_list .tit {width: 90px;border-radius: 30px;line-height: 30px;font-size: 14px}
}
@media only screen and (max-width:640px){
    .prof_tabViw {padding-left: 0;}
    .prof_tabViw .prof_img {position: relative;margin-bottom: 30px;width: 100%;text-align: center}
    .prof_tabViw .prof_img img {width: 100%;max-width: 250px}
    .prof_tabViw .prof_textBox {width: 100%;margin-left: 0}
    .prof_tabViw .prof_stxt {font-size: 15px;}
    .prof_tabViw .prof_btit {font-size: 18px;}
    .prof_tabViw .prof_name .neme {font-size: 15px;line-height: 40px;padding-left: 20px;box-sizing: border-box;}
    .prof_tabViw .prof_name:before {left:0;background: #084e99;padding: 0;}
    .prof_tabViw .prof_name .neme b {font-size: 22px;}
    .prof_tabViw .prof_name .neme span {top: 11px;right: -105px;font-size: 13px;}

    .prof_tabViw .prof_list .tit {font-size: 13px}
}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	시설안내
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/


.facility-slider {position: relative;display: block;overflow: hidden;margin-top: 30px}
.facility-slider .slick-arrow {position: absolute;top: 50%;width: 50px;height: 70px;margin-top: -60px;display: block;border: none;text-indent: -99999px;z-index: 100 }
.facility-slider .slick-prev { left: 0;background: url("/static/images/design/content/facility-prev.png") no-repeat}
.facility-slider .slick-next { right: 0;background: url("/static/images/design/content/facility-next.png") no-repeat}

.facility-slider .slick-dots {position: relative;display: block;overflow: hidden;margin-top: 10px;width: 940px;margin-left: -10px}
.facility-slider .slick-dots li {position: relative;float: left;width: 124px;margin: 0 5px}
.facility-slider .slick-dots li img {width: 100%;}
.facility-slider .slick-dots li a {cursor: pointer;display: block}
.facility-slider .slick-dots li:before {position: absolute;top: 0;left: 0;width: 100%;height: 100%;content: "";background: rgba(0,0,0,0.7)}
.facility-slider .slick-dots li.slick-active:before {display: none;}

@media only screen and (max-width:1024px){
    .facility-slider .slick-slide img {width: 100%}
    .facility-slider .slick-arrow {position: absolute;top: 50%;width: 50px;height: 70px;margin-top: -60px;display: block;border: none;text-indent: -99999px;z-index: 100 }
    .facility-slider .slick-prev { left: 0;background: url("/static/images/design/content/facility-prev.png") no-repeat}
    .facility-slider .slick-next { right: 0;background: url("/static/images/design/content/facility-next.png") no-repeat}

    .facility-slider .slick-dots {width: 100%;margin-left: 0;text-align: center}
    .facility-slider .slick-dots li {display: inline-block;vertical-align: top;float: none;width: calc(13% - 2px);margin: 0 2px}
}
@media only screen and (max-width:640px){
    .prof_tabViw {padding-left: 0;}
    .prof_tabViw .prof_img {position: relative;margin-bottom: 30px;width: 100%;text-align: center}
    .prof_tabViw .prof_img img {width: 100%;max-width: 250px}
    .prof_tabViw .prof_textBox {width: 100%;margin-left: 0}
    .prof_tabViw .prof_stxt {font-size: 15px;}
    .prof_tabViw .prof_btit {font-size: 18px;}
    .prof_tabViw .prof_name .neme {font-size: 15px;line-height: 40px;padding-left: 20px;box-sizing: border-box;}
    .prof_tabViw .prof_name:before {left:0;background: #084e99;padding: 0;}
    .prof_tabViw .prof_name .neme b {font-size: 22px;}
    .prof_tabViw .prof_name .neme span {top: 11px;right: -105px;font-size: 13px;}

    .prof_tabViw .prof_list .tit {font-size: 13px}
}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	오시는길
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.map {position: relative;display: block;overflow: hidden;border: 1px solid #ddd;box-sizing: border-box}
.map_info {position: relative;display: block;overflow: hidden;background: #2464bf;padding: 20px 30px;}
.map_info .addr {display: block;color: #fff;font-size: 15px;}
.map_info .btn {position: absolute;top: 50%;right: 30px;margin-top: -20px}

.map_infoTxt {position: relative;display: block;overflow: hidden;margin-top: 30px}
.map_infoTxt .titBox {display: block;overflow: hidden;}
.map_infoTxt .titBox .tit {float: left;font-weight: 600;font-size: 22px;color: #222;margin-right: 10px;line-height: 40px;}
.map_infoTxt .titBox .stxt {float: left;line-height: 40px;}
.map_infoTxt .infoTxt {position: relative;display: block;overflow: hidden;border-top: 2px solid #555;}
.map_infoTxt .infoTxt li {position: relative;display: block;padding: 15px 15px 15px 115px;border-bottom: 1px solid #ddd}
.map_infoTxt .infoTxt li .stit {position: absolute;top: 0;left: 0;width: 100px;height: 100%;background: #eff3f8;text-align: center;}
.map_infoTxt .infoTxt li .stit span {position: absolute;display: block;top: 50%;left: 0;width: 100%;margin-top: -31px;padding-top: 35px;font-weight: 600;color: #2464bf}
.map_infoTxt .infoTxt li .stit span:before {position: absolute;font-family: FontAwesome,LineAwesome;top: 0;left: 0;width: 100%;height: 35px;font-weight: normal;font-size: 35px;line-height: 35px;color: #2464bf}
.map_infoTxt .infoTxt li .stit span.bus:before {content: "\f158"}
.map_infoTxt .infoTxt li .stit span.subway:before {content: "\f329"}
.map_infoTxt .infoTxt li .txtLst b {color: #222}


@media only screen and (max-width:1024px){
    .map_info {padding: 15px 20px;}
    .map_info .addr {font-size: 14px;}
    .map_info .btn {right: 20px;margin-top: -16px;padding: 4px 10px}
}
@media only screen and (max-width:840px){
}
@media only screen and (max-width:640px){
    .map_infoTxt .titBox .tit {font-size: 18px;}
    .map_infoTxt .infoTxt li {padding: 10px 10px 10px 85px;}
    .map_infoTxt .infoTxt li .stit {width: 70px;}
    .map_infoTxt .infoTxt li .stit span {margin-top: -31px;padding-top: 25px;}
    .map_infoTxt .infoTxt li .stit span:before {height: 25px;font-size: 23px;line-height: 25px}
    .map_infoTxt .infoTxt li .txtLst {font-size: 13px}
}
@media only screen and (max-width:460px){
    .map_info {text-align: center}
    .map_info .addr {font-size: 13px;display: block;}
    .map_info .btn {position: relative;top: 0;right: 0;margin: 10px auto 0;}

    .map_infoTxt .titBox .tit {font-size: 16px;}
    .map_infoTxt .titBox .stxt {font-size: 13px;}
}

.agreement-box {position: relative;display: block;overflow: hidden;border: 1px solid #ddd;margin-bottom: 10px;padding: 15px;height: 150px;overflow-y: scroll}
.agreement-chek {position: relative;display: block;text-align: center;margin-bottom: 20px }

@media only screen and (max-width:460px){
    .agreement-box {font-size: 13px;}
}


/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
	연혁
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.historyBox {position: relative;display: block;overflow: hidden}
.historyBox .box {position: relative;display: block;overflow: hidden;margin-bottom: 30px;padding-bottom: 30px;border-bottom: 1px dotted #ccc;}
.historyBox .box:last-child {margin-bottom: 0;border-bottom: none;padding-bottom: 0}
.historyBox .box .year {display: block;margin-bottom: 10px;color: #222;font-size: 17px;font-weight: 600;line-height: 150%}
.historyBox .box .year b {display: block;font-size: 22px;color: #2464bf;line-height: 150%}
.historyBox .box .txtLst li {position: relative;padding-left: 70px !important;}
.historyBox .box .txtLst li b {position: absolute;display: block;top: 0;left: 10px;color: #333;}

.marine_position {position: relative;display: block;overflow: hidden;}
.marine_position li {display: block;overflow: hidden;padding: 30px 0;border-bottom: 1px dotted #ccc}
.marine_position li:last-child {padding-bottom: 0;border-bottom: 0}
.marine_position li .img {display: block;float: left;width: 240px}
.marine_position li .txtBox {position: relative;display: block;overflow: hidden;float: left;width: 680px}
.marine_position li .txtBox b {position: relative;display: block;overflow: hidden;line-height: 26px;font-size: 18px;color: #084e99;font-weight: 600;margin-bottom: 5px;padding-left: 10px;letter-spacing: -0.05em}
.marine_position li .txtBox b:after {position: absolute;top: 11px;left: 0;width: 5px;height: 5px;border-radius: 50%;background: #084e99;content: "";}

@media only screen and (max-width:2014px){
    .marine_position li .img {float: none;margin-bottom: 15px}
    .marine_position li .txtBox {float: none;width: 100%}
}

@media only screen and (max-width:680px){
    .historyBox .box {margin-bottom: 25px;padding-bottom: 25px}
    .historyBox .box .year {font-size: 14px}
    .historyBox .box .year b {font-size: 18px;}
    .historyBox .box .txtLst li {padding-left: 65px !important;}


    .marine_position li {padding: 25px 0;}
    .marine_position li .txtBox {font-size: 13px}
    .marine_position li .txtBox b {line-height: 24px;font-size: 15px;}


}