@charset "utf-8";
@import url("fontawesome.css");
@import url("simple-line-icons.css");
@import url("NotoSansKR.css");
@import url("Montserrat.css");
@import url("Roboto.css");
@import url("swiper.css");
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard-dynamic-subset.min.css");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");
* {
    -webkit-text-size-adjust: 100%;
    margin: 0;
    padding: 0;
    color: inherit;
    list-style: none;
}
/* Reset */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
label,
legend,
caption,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0 none;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}
img {
    border: 0 none;
    font-size: 0;
    line-height: 0;
    vertical-align: top;
}
.ie7 li,
.ie7 li a {
    zoom: 1;
}
caption,
legend {
    width: 0;
    height: 0;
    visibility: hidden;
    line-height: 0;
}
input[type="submit"],
textarea {
    -webkit-appearance: none;
    -webkit-border-radius: 0;
}
/* 여백 */
.padding0 {
    padding: 0 !important;
}
.margin0 {
    margin: 0 !important;
}
/* Top Padding */
.tp0 {
    padding-top: 0px !important;
}
.tp5 {
    padding-top: 5px !important;
}
.tp10 {
    padding-top: 10px !important;
}
.tp15 {
    padding-top: 15px !important;
}
.tp20 {
    padding-top: 20px !important;
}
.tp25 {
    padding-top: 25px !important;
}
.tp30 {
    padding-top: 30px !important;
}
/* Bottom Padding */
.bp0 {
    padding-bottom: 0px !important;
}
.bp5 {
    padding-bottom: 5px !important;
}
.bp10 {
    padding-bottom: 10px !important;
}
.bp15 {
    padding-bottom: 15px !important;
}
.bp20 {
    padding-bottom: 20px !important;
}
.bp25 {
    padding-bottom: 25px !important;
}
.bp30 {
    padding-bottom: 30px !important;
}
.bp50 {
    padding-bottom: 50px !important;
}
/* Left Padding */
.lp0 {
    padding-left: 0 !important;
}
.lp5 {
    padding-left: 5px !important;
}
.lp10 {
    padding-left: 10px !important;
}
.lp15 {
    padding-left: 15px !important;
}
.lp20 {
    padding-left: 20px !important;
}
.lp25 {
    padding-left: 25px !important;
}
.lp30 {
    padding-left: 30px !important;
}
/* Right Padding */
.rp0 {
    padding-right: 0 !important;
}
.rp5 {
    padding-right: 5px !important;
}
.rp10 {
    padding-right: 10px !important;
}
.rp15 {
    padding-right: 15px !important;
}
.rp20 {
    padding-right: 20px !important;
}
.rp25 {
    padding-right: 25px !important;
}
.rp30 {
    padding-right: 30px !important;
}
/* Top Margin */
.tm0 {
    margin-top: 0 !important;
}
.tm5 {
    margin-top: 5px !important;
}
.tm10 {
    margin-top: 10px !important;
}
.tm15 {
    margin-top: 15px !important;
}
.tm20 {
    margin-top: 20px !important;
}
.tm25 {
    margin-top: 25px !important;
}
.tm30 {
    margin-top: 30px !important;
}
/* Bottom Margin */
.bm0 {
    margin-bottom: 0 !important;
}
.bm5 {
    margin-bottom: 5px !important;
}
.bm10 {
    margin-bottom: 10px !important;
}
.bm15 {
    margin-bottom: 15px !important;
}
.bm20 {
    margin-bottom: 20px !important;
}
.bm25 {
    margin-bottom: 25px !important;
}
.bm30 {
    margin-bottom: 30px !important;
}
/* Left Margin */
.lm0 {
    margin-left: 0 !important;
}
.lm5 {
    margin-left: 5px !important;
}
.lm10 {
    margin-left: 10px !important;
}
.lm15 {
    margin-left: 15px !important;
}
.lm20 {
    margin-left: 20px !important;
}
.lm25 {
    margin-left: 25px !important;
}
.lm30 {
    margin-left: 30px !important;
}
/* Right Margin */
.rm0 {
    margin-right: 0 !important;
}
.rm5 {
    margin-right: 5px !important;
}
.rm10 {
    margin-right: 10px !important;
}
.rm15 {
    margin-right: 15px !important;
}
.rm20 {
    margin-right: 20px !important;
}
.rm25 {
    margin-right: 25px !important;
}
.rm30 {
    margin-right: 30px !important;
}
/* float */
.fl {
    float: left !important;
}
.fr {
    float: right !important;
}
.Lfloat {
    float: left !important;
}
.Rfloat {
    float: right !important;
}
.overHidden {
    overflow: hidden;
}
.clear {
    clear: both !important;
}
.clearleft {
    clear: left !important;
}
.clfix:after {
    content: "";
    display: block;
    clear: both;
    visibility: hidden;
    height: 0;
    font-size: 0;
}
.ie7 .clfix {
    zoom: 1;
}
/* align */
.al {
    text-align: left !important;
}
.ac {
    text-align: center !important;
}
.ar {
    text-align: right !important;
}
.aj {
    text-align: justify !important;
}
/* position */
.posRel {
    position: relative !important;
}
.posAbs {
    position: absolute !important;
}
.posTL {
    position: absolute !important;
    top: 0;
    left: 0;
}
.posTLn {
    position: absolute !important;
    top: 0;
    left: 26px;
}
.posTR {
    position: absolute !important;
    top: 0;
    right: 0;
}
.posBL {
    position: absolute !important;
    bottom: 0;
    left: 0;
}
.posBR {
    position: absolute !important;
    bottom: 0;
    right: 0;
}
/* display */
.none {
    display: none !important;
}
.iBlock {
    display: inline-block !important;
    vertical-align: top;
}
.ie7 .iBlock {
    display: inline !important;
}
.borderNone {
    border: none !important;
}
.scrollArea {
    overflow-x: hidden;
    overflow-y: scroll;
}
/* IR 기법 */
.hidden {
    position: absolute;
    top: -11000px;
    left: -11000px;
    width: 0;
    height: 0;
    overflow: hidden;
}
.ie7 .hidden {
    position: static;
    font-size: 0;
    line-height: 0;
}
/* 한 줄일 때, 말줄임표 */
.ellipsis {
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
} /* width 별도 설정 */
/*투명도*/
.opacity0 {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}
/* 세로 가운데 정렬을 위한 빈태그용 */
.blank {
    display: inline-block;
    width: 0;
    vertical-align: middle;
    overflow: hidden;
    vertical-align: middle;
}
/* 높이 별도 설정 */
.scrollArea,
textarea {
    scrollbar-3dlight-color: #dcdcdc;
    scrollbar-arrow-color: #dcdcdc;
    scrollbar-base-color: #0065cf;
    scrollbar-face-color: #0065cf;
    scrollbar-track-color: #dcdcdc;
    scrollbar-darkshadow-color: #dcdcdc;
    scrollbar-highlight-color: #dcdcdc;
    scrollbar-shadow-color: #dcdcdc;
}
.scrollArea::-webkit-scrollbar,
textarea::-webkit-scrollbar {
    width: 8px;
    background-color: #dcdcdc;
}
.scrollArea::-webkit-scrollbar-thumb,
textarea::-webkit-scrollbar-thumb {
    background-color: #0065cf;
}
/* table */
table.tblDef,
table.tblDef > thead,
table.tblDef > tbody,
table.tblDef > tfoot,
table.tblDef > * > tr,
table.tblDef > * > tr > *,
table.tblPoint,
table.tblPoint > thead,
table.tblPoint > tbody,
table.tblPoint > tfoot,
table.tblPoint > * > tr,
table.tblPoint * > tr > *,
table.inputTbl,
table.inputTbl > thead,
table.inputTbl > tbody,
table.inputTbl > tfoot,
table.inputTbl > * > tr,
table.inputTbl * > tr > *,
table.innerTbl,
table.innerTbl > thead,
table.innerTbl > tbody,
table.innerTbl > tfoot,
table.innerTbl > * > tr,
table.innerTbl * > tr > *,
table.calendar,
table.calendar > thead,
table.calendar > tbody,
table.calendar > tfoot,
table.calendar > * > tr,
table.calendar * > tr > * {
    margin: 0;
    padding: 0;
    border: 0 none;
}
table.tblDef,
table.tblPoint,
table.inputTbl,
table.innerTbl,
table.calendar {
    width: 100%;
    border: 0;
    border-collapse: separate;
    border-spacing: 0;
}
.ie7 table.tblDef,
.ie7 table.tblPoint,
.ie7 table.inputTbl,
.ie7 table.innerTbl,
.ie7 table.calendar {
    border-collapse: collapse;
}
table.tblDef > * > tr > th,
table.tblPoint * > tr > th,
table.inputTbl * > tr > th,
table.innerTbl * > tr > th,
table.calendar * > tr > th {
    font-weight: normal;
}
table.tblDef > * > tr > td,
table.tblPoint * > tr > td,
table.inputTbl * > tr > td,
table.innerTbl * > tr > td,
table.calendar * > tr > td {
    word-break: normal;
}
/* Font */
.fwBold {
    font-weight: bold !important;
}
.fwNormal {
    font-weight: normal !important;
}
.fcWhite {
    color: #fff !important;
}
.fcBlack {
    color: #000 !important;
}
.fcRed {
    color: #d82900 !important;
}
.fcBlue {
    color: blue !important;
}
.ffDotum {
    font-family: Calibri, "돋움", Dotum, "Apple Gothic", sans-serif !important;
}
.ffGulim {
    font-family: Calibri, "굴림", "굴림체", Gulim, "Apple Gothic", sans-serif !important;
}
.underline {
    text-decoration: underline !important;
}
.italic {
    font-style: italic;
}
/* cursor */
.cursorDef {
    cursor: default !important;
}
.hand {
    cursor: pointer !important;
}
/* Form Elememts */
input[type="text"],
input[type="password"],
input[type="file"],
select,
textarea {
    border: 1px solid #ccc;
}
textarea {
    width: 100%;
    padding: 7px 10px;
    border: 1px solid #cfcfcf;
    resize: vertical;
    box-sizing: border-box;
}
.ie7 select {
    zoom: 1;
}
input:focus,
select:focus,
textarea:focus {
    outline: none;
}
/* button 초기화 */
button.style-btn {
    overflow: visible;
    padding: 0;
    border: 0;
    cursor: pointer;
    white-space: nowrap;
}
button.style-btn::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner {
    padding: 0;
    border: 0;
} /* FF 버튼 여백 없애기 */
/* default font-family */
body,
input[type="text"],
input[type="password"],
input[type="file"],
select,
textarea,
button {
    font-family: sans-serif;
}
/* 공통 레이아웃 */
.pro-con {display: none !important;}

.pro .pro-con {display: block !important;}
.pro .normal-con {display: none !important;}


body {
    line-height: 1.5;
    color: #333;
    -webkit-text-size-adjust: none;
}
.wrapper {
    position: relative;
    width: 100%;
    word-break: normal;
    z-index: 0;
}
a.conLink {
    color: inherit;
    text-decoration: none;
}
address {
    font-style: normal;
}
input[type="text"],
input[type="password"],
input[type="file"] {
    font-size: 15px;
    line-height: 17px;
    height: 45px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0px;
    -webkit-appearance: none;
}
input::placeholder {
    font-size: 15px;
    line-height: 24px;
    height: 45px;
}
.tabCon,
.toggleCon {
    display: none;
}
.agreeCon,
.scrollArea {
    overflow-x: hidden;
    overflow-y: auto;
}
.essen {
    position: relative;
    padding-left: 1em;
}
.essen:before {
    position: absolute;
    left: 0;
    top: 0;
    color: #f00;
    content: "*";
    line-height: 1em;
}
table.inputTbl > * > tr > th {
    text-align: center;
}
table.inputTbl td > *:first-child,
table.inputTbl td .clear,
table.inputTbl input[type="radio"]:first-child,
table.inputTbl input[type="checkbox"]:first-child {
    margin-left: 0 !important;
}
table.inputTbl input[type="text"],
table.inputTbl input[type="password"],
table.inputTbl select {
}
table.inputTbl input[type="text"],
table.inputTbl input[type="password"] {
    width: 250px;
    height: 26px;
    padding: 2px 10px 3px;
}
table.inputTbl input.inputSmall {
    width: 70px;
}
table.inputTbl input.inputWide {
    width: 95%;
}
table.inputTbl input[type="image"] {
    vertical-align: middle;
}
table.inputTbl td span,
table.inputTbl td label {
    display: inline-block;
    vertical-align: middle;
}
table.inputTbl .multi > *,
table.inputTbl td.date *,
table.inputTbl td.phone *,
table.inputTbl td.address > *,
table.inputTbl td.name > *,
table.inputTbl td.birth > *,
table.inputTbl td.email > * {
    float: left;
    margin: 0 0 0 5px;
}
table.inputTbl .multi > *:first-child,
table.inputTbl .date > *:first-child {
    margin-left: 0;
}
table.inputTbl .multi > span,
table.inputTbl .multi > label,
table.inputTbl td.date span,
table.inputTbl td.date label,
table.inputTbl td.phone span,
table.inputTbl td.phone label,
table.inputTbl td.address > span,
table.inputTbl td.address > label,
table.inputTbl td.birth > span,
table.inputTbl td.birth > label,
table.inputTbl td.email > span,
table.inputTbl td.email > label {
    line-height: 33px;
}
table.inputTbl div.multi {
    overflow: hidden;
    padding: 10px;
}
table.inputTbl .multi input[type="radio"],
table.inputTbl .multi input[type="checkbox"] {
    margin: 10px 5px 0 20px;
}
table.inputTbl .multi input[type="image"] {
    margin-top: 10px;
}
table.inputTbl .line > * {
    float: none;
}
table.inputTbl .line input[type="radio"],
table.inputTbl .line input[type="checkbox"] {
    margin: 10px 5px 0 0;
}
table.inputTbl dl.overHidden {
    line-height: 35px;
}
table.inputTbl dl.overHidden > dt {
    padding-right: 10px;
}
table.inputTbl td.date input[type="image"] {
    margin-top: 9px;
}
table.inputTbl td.phone select,
table.inputTbl td.phone input:first-child {
    width: 100px;
}
table.inputTbl td.phone input {
    width: 120px;
}
table.inputTbl td.address input[type="text"] {
    width: 330px;
    margin-top: 5px;
}
table.inputTbl td.address input[type="text"]:first-child {
    width: 70px;
    margin-top: 0;
}
table.inputTbl td.address input[type="text"].clear {
    width: 520px;
    margin-left: 0;
}
table.inputTbl td.address span.btn {
    padding-left: 0;
}
table.inputTbl td.name input[type="text"] {
    width: 120px;
}
table.inputTbl td.email input[type="text"],
table.inputTbl td.email select {
    width: 180px;
}
table.inputTbl td.email input[type="text"]:first-child {
    width: 250px;
}
table.inputTbl td.email span {
    margin-left: 5px;
}
table.inputTbl td.photo > p,
table.inputTbl td.photo > div {
    display: inline-block;
}
table.inputTbl td.photo > p {
    width: 90px;
    height: 90px;
    border: 1px solid #dfdfdf;
    vertical-align: top;
    background-color: #f8f8f8;
}
table.inputTbl td.photo > p img {
    width: 100%;
    height: 100%;
}
table.inputTbl td.photo > div {
    padding-left: 10px;
    vertical-align: bottom;
}
table.inputTbl td.photo div input[type="checkbox"] {
    margin-top: 0;
}
table.inputTbl td.photo div label {
    padding-left: 5px;
}
table.inputTbl td.birth {
}
table.inputTbl td.birth select {
    width: 50px;
}
table.inputTbl td.birth select:first-child,
table.inputTbl td.birth input[type="text"] {
    width: 70px;
}
table.inputTbl span.fwBold {
    display: inline-block;
    padding: 5px 10px 0 0;
    line-height: 1.2;
}
table.inputTbl .editArea {
    padding: 0 !important;
}
table.inputTbl td.author > * {
    float: left;
    margin: 0 0 0 5px;
}
table.inputTbl td.author select {
    width: 80px;
}
input.inputWide {
    width: 90%;
}
div.selectFile {
    position: relative;
    padding-right: 75px;
}
div.selectFile span {
    display: block;
}
div.selectFile input[type="text"] {
    width: calc(100% - 22px) !important;
}
div.selectFile .find {
    position: absolute;
    right: 0;
    top: 0;
    width: 66px;
    height: 33px;
    background-color: #393939;
    background-image: none;
}
div.selectFile .find:after {
    z-index: 0;
    position: absolute;
    left: 50%;
    top: 50%;
    color: #fff;
    font-size: 1em;
    line-height: 1em;
    padding: 0;
    margin: -0.5em 0 0 -0.5em;
    font-family: "Font Awesome 5 Brands";
    content: "\f3ee";
    font-weight: 900;
}
div.selectFile .opacity0 {
    width: 100%;
    height: 100%;
    border: 0 none;
    padding: 0;
    opacity: 0;
}
div.selectFile .attach {
    display: none;
    overflow: hidden;
    clear: both;
    margin: 5px 0 0;
}
div.selectFile .attach > * {
    float: left;
}
div.selectFile .attach input {
    margin: 5px 5px 0 0;
}
table.inputTbl .editArea {
    padding: 0;
}
.editArea .cke span {
    display: inline;
    vertical-align: middle;
    line-height: initial;
}
.editArea .cke_chrome {
    border: 0 none;
    box-shadow: none;
}
.cke .cke_voice_label,
.cke_button_label {
    display: none !important;
}
.cke_toolbox:after {
    clear: both;
    display: block;
    font-size: 0;
    line-height: 0;
    height: 0;
    content: ".";
}
.cke_top,
.cke_contents,
.cke_bottom {
    display: block !important;
}
span.inputC,
span.inputR {
    overflow: hidden;
    position: relative;
    display: inline-block;
    width: 25px;
    height: 25px;
}
span.inputR {
    border-radius: 50%;
}
span.inputC input,
span.inputR input {
    z-index: 20;
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
}
span.inputC:before,
span.inputR:before {
    position: absolute;
    left: 0;
    padding: 0;
    display: block;
    width: 100%;
    height: 100%;
    content: " ";
    background: #989898 url("player/input_checked.png") center center no-repeat;
}
span.inputR:before {
}
span.inputC.on:before,
span.inputR.on:before {
    background-color: #2e4497;
}
ul.option,
ul.option li {
    margin: 0;
    padding: 0;
    list-style: none;
}
ul.option li {
    position: relative;
    margin-top: 5px;
    padding-left: 20px;
}
ul.option li:first-child {
    margin-top: 0;
}
ul.option input {
    position: absolute;
    left: 0;
    top: 3px;
    margin: 0;
}
/* 버튼 */
.btn a,
.btn input,
.btn button {
    display: inline-block;
    text-decoration: none;
    cursor: pointer;
    height: 40px;
    padding: 0 10px 1px;
    font-size: 14px;
    line-height: 20px;
    border-width: 1px;
    border-style: solid;
    vertical-align: top;
    font-weight: 400;
    font-family: "NotoSansKR Regular", sans-serif;
    -webkit-appearance: none;
}
.btn a {
    height: auto;
    line-height: 20px;
    padding: 8px 15px 10px;
}
.btn a.twoLine {
}
.btn a:before {
    display: inline-block;
    padding-right: 10px;
}
/* 파란색 */
.btnDef {
    background-color: #394e72 !important;
    border-color: #394e72 !important;
    color: #fff !important;
}
/* 갈색(낙엽색) */
.btnPoint {
    background-color: #883902 !important;
    border-color: #883902 !important;
    color: #fff !important;
}
/* 빨간색 */
.btnRed {
    background-color: #e40404 !important;
    border-color: #e40404 !important;
    color: #fff !important;
}
/* 파란색 */
.btnBlue {
    background-color: #1d2088 !important;
    border-color: #1d2088 !important;
    color: #fff !important;
}
/* 회색 */
.btnGrey {
    background-color: #424242 !important;
    border-color: #424242 !important;
    color: #fff !important;
}
/* 연회색 */
.btnLGrey {
    background-color: #888 !important;
    border-color: #888 !important;
    color: #fff !important;
}
/* border+ 파란색 */
.btnBdDef {
    background-color: #fff !important;
    border-color: #2e4497 !important;
    color: #2e4497 !important;
}
/* border+ 남색 */
.btnBdPoint {
    background-color: #fff;
    border-color: #242b37;
    color: #242b37;
}
/* border+ 회색 */
.btnBdGrey {
    background-color: #fff;
    border-color: #7e7f87;
    color: #7e7f87;
}
/* border+ 연회색 */
.btnBdLGrey {
    background-color: #f5f5f5;
    border-color: #b3b3b3;
    color: #454545;
}
/* 삭제 */
.btnDel {
    background-color: #fff !important;
    border-color: #e91c51 !important;
    color: #e91c51 !important;
}
.btn .btnArr {
    position: relative;
}
.btn .btnArr:after {
    position: absolute;
    right: 20px;
    top: 50%;
    width: 10px;
    height: 8px;
    margin-top: -4px;
    content: "";
    background: url("mobile/btnBl_arr.png") center center no-repeat;
    background-size: 10px;
}
table.tblDef {
    border-top: 2px solid #000;
}
table.tblDef > * > tr > th,
table.tblDef > * > tr > td {
    padding: 10px;
    border-left: 1px solid #e7e7e7;
    border-bottom: 1px solid #e7e7e7;
    text-align: center;
    color: #333;
    font-size: 15px;
    line-height: 20px;
    font-family: "NotoSansKR Regular", sans-serif;
}
table.tblDef > * > tr > *:first-child {
    border-left: 0 none;
}
table.tblDef > thead > tr > th {
    border-bottom-color: #eaeaea;
    background-color: #f1f3f9;
    color: #333;
}
table.tblDef > tbody > tr > th {
    background-color: #fff;
}
/* ========================================================================================================== */
/* ================================================ 게시판 팝업 =============================================== */
/* ========================================================================================================== */
body.pop {
    margin: 0;
    padding: 0;
    height: 100%;
    background-color: #fff;
    font-family: "Calibri", "돋움", Dotum, "Apple Gothic", sans-serif;
    word-break: break-all;
}
body.pop form {
    margin: 0;
    padding: 0;
}
#popClose {
    position: static;
    height: 22px;
    line-height: 22px;
    font-size: 13px;
    overflow: hidden;
    text-align: right;
    background-color: #b2b2b2;
}
#popClose:after {
    content: "";
    display: block;
    clear: both;
    visibility: hidden;
    height: 0;
    font-size: 0;
}
.ie7 #popClose {
    zoom: 1;
}
#popClose * {
    vertical-align: middle;
}
#popClose .fl {
    width: 50%;
    margin-left: 10px;
}
#popClose .fl label,
#popClose .fl input[type="checkbox"] {
    float: left;
}
#popClose .fl label {
    margin: 0 10px 0 5px;
    font-weight: bold;
    color: #fff;
}
#popClose .fl input[type="checkbox"] {
    margin: 5px 0 0 0;
}
@media all and (-ms-high-contrast: none) {
    #popClose .fl input[type="checkbox"] {
        margin-top: 1px;
    } /* IE10 */
    *::-ms-backdrop,
    #popClose .fl input[type="checkbox"] {
        margin-top: 4px;
    } /* IE11 */
}
.ie7 #popClose .fl input[type="checkbox"],
.ie8 #popClose .fl input[type="checkbox"],
.ie9 #popClose .fl input[type="checkbox"] {
    margin: 0;
}
#popClose a,
#popClose label {
    display: inline-block;
    margin-top: -1px;
    margin-right: 10px;
    font-weight: bold;
    color: #fff;
}
div.wrapper {
    overflow: hidden;
    width: 100%;
    min-width: 320px;
    font-family: "NotoSansKR Regular", sans-serif;
}
div.wrapper:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    font-size: 0;
    content: " ";
}
img {
    max-width: 100%;
}
ul.listNum,
ul.listNum > li,
ul.listStar,
ul.listStar > li {
    margin: 0;
    padding: 0;
    list-style: none;
}
ul.listNum > li {
    margin: 10px 0 0 1.2em;
    list-style: decimal;
}
ul.listNum > li:first-child {
    margin-top: 0;
}
ul.listStar > li,
.blStar {
    position: relative;
    padding-left: 1em;
}
ul.listStar > li:before,
.blStar:before {
    position: absolute;
    left: 0;
    top: 0;
    content: "*";
}
/* Intro */
div.webinarIntro {
    padding: 30px 0;
    background: url("mobile/login_bg2.png") center bottom no-repeat;
    background-size: cover;
    box-sizing: border-box;
}
div.webinarIntro a {
    display: block;
    text-decoration: none;
}
div.webinarIntro h1 {
    margin: 0;
    padding: 0 0 20px;
}
div.webinarIntro h1 img {
    display: block;
    height: 30px;
    margin: 0 auto;
}
ul.introBtn {
    margin: 0;
    padding: 0 25px;
}
ul.introBtn > li {
    margin: 15px 0 0;
    list-style: none;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}
ul.introBtn > li:first-child {
    margin: 0;
}
ul.introBtn a,
ul.introBtn img {
    display: block;
}
ul.introBtn img {
    width: 100%;
}
ul.introMenu a.info {
    position: relative;
    height: 21px;
    padding: 15px 40px 14px 20px;
    color: #333;
    font-size: 14px;
    font-family: "NotoSansKR Bold", sans-serif;
}
ul.introMenu a.info:after {
    position: absolute;
    right: 20px;
    top: 50%;
    width: 7px;
    height: 14px;
    margin-top: -7px;
    content: " ";
    background: url("mobile/btnBl_arr.png") center center no-repeat;
    background-size: 7px;
}
ul.introMenu a.info img {
    display: inline-block;
    width: 19px;
    padding: 1px 5px 0 0;
    vertical-align: top;
}
dl.introNote,
dl.introNote dt,
dl.introNote dd {
    margin: 0;
    padding: 0;
}
dl.introNote {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 20px;
    background-color: #3a4154;
    color: #fff;
    font-size: 12px;
    font-family: "NotoSansKR Regular", sans-serif;
    box-sizing: border-box;
}
dl.introNote dt {
    padding-bottom: 5px;
    color: #ffdd4c;
    font-weight: bold;
}
/* Login */
/* div.webinarLogin {
    padding: 0;
    background:
        no-repeat url("mobile/login_bg1.png") left top,
        no-repeat url("mobile/login_bg2.png") right bottom,
        #b5d891;
    -webkit-background-size:
        100% auto,
        143px auto;
    background-size:
        100% auto,
        143px auto;
    box-sizing: border-box;
} */

div.webinarLogin {
    padding: 0;
    background:
     url("mobile/QR_bg.png")  center top no-repeat , #f7f1c1;
    -webkit-background-size:
        100% auto,
        143px auto;
    background-size:
        100% auto,
        143px auto;
    box-sizing: border-box;
}

div.webinarLogin a {
    display: block;
    text-decoration: none;
}
div.webinarLogin h1 {
    margin: 0;
    padding: 15% 18% 5% 18%;
}
div.webinarLogin h1 img {
    display: block;
    width: 100%;
}
div.loginArea dl,
div.loginArea dt,
div.loginArea dd,
div.loginArea ul,
div.loginArea li,
div.loginArea p {
    margin: 0;
    padding: 0;
    list-style: none;
}
div.loginArea {
    position: relative;
    margin: 0;
    padding: 0 0 60px;
    background: url("mobile/login_copyright.png") center bottom no-repeat;
    background-size: auto 30px;
}

div.loginArea .barcode{padding: 10%;}
div.loginArea .name{     margin: 0;text-align: center;background:#ffcab0;padding:5px}
div.loginArea div.formArea {
    position: relative;
    width: calc(100% - 50px);
    margin: 0 auto;
/*     padding: 10%; */
    background-color: #fff;
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
}
div.loginArea dl.login {
    position: relative;
    margin: 0;
    padding: 0;
}
div.loginArea dl.login dt {
    display: none;
}
div.loginArea dl.login dd {
    position: relative;
    padding: 0 0 0 40px;
    margin-bottom: 8px;
    background: #f7f7f7 20px center no-repeat;
    background-size: auto 15px;
}
div.loginArea dl.login dd:first-of-type {
    background-image: url("/asset/mobile/login_id.png");
}
div.loginArea dl.login dd:last-of-type {
    background-image: url("/asset/mobile/login_pwd.png");
}
div.loginArea dl.login dd input {
    position: relative;
    z-index: 10;
    width: 100%;
    height: 40px;
    border: 0 none;
    background: transparent;
    box-sizing: border-box;
}
div.loginArea dl.login dd span.placeholder {
    position: absolute;
    left: 42px;
    top: 50%;
    transform: translateY(-50%);
    color: #ccc;
    font-size: 13px;
    line-height: 45px;
    font-family: "NotoSansKR Regular", sans-serif;
}
div.loginArea dl.login dd input:focus + span.placeholder,
.valid + span.placeholder {
    display: none;
}
div.loginArea div.btn {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 0;
    line-height: 0;
}
div.loginArea div.btn input,
div.loginArea div.btn a {
    display: inline-block;
    vertical-align: top;
    width: 50%;
    height: 45px;
    padding: 0;
    border: 0 none;
    box-sizing: border-box;
    text-align: center;
    font-family: "Roboto-Medium", sans-serif;
    font-size: 15px;
    line-height: 45px;
    color: #fff;
    text-decoration: none;
}
div.loginArea div.btn input {
    background-color: #4183c1;
    border-color: #4183c1;
}
div.loginArea div.btn a {
    background-color: #394e72;
    border-color: #394e72;
}
div.loginNote,
div.loginNote ul,
div.loginNote li,
div.loginNote p,
div.loginNote dl,
div.loginNote dt,
div.loginNote dd {
    margin: 0;
    padding: 0;
    list-style: none;
}
div.loginNote {
    font-family: "NotoSansKR DemiLight", sans-serif;
    font-size: 12px;
    line-height: 16px;
    color: #636363;
    box-sizing: border-box;
}
/* div.loginNote p {padding: 5px 0;} */
div.loginNote li {
    position: relative;
    margin-top: 5px;
    padding-left: 10px;
}
div.loginNote li:before {
    position: absolute;
    left: 0;
    top: 10px;
    width: 2px;
    height: 2px;
    content: "";
    background-color: #959595;
}
div.loginNote dl {
    padding: 10px 0;
}
div.loginNote dt {
    display: block;
    font-size: 12px;
    font-family: "NotoSansKR Medium", sans-serif;
    color: #2e2d2d;
}
div.loginNote dd {
    padding: 0;
    margin: 0;
    background: #fff;
    background-image: none;
}
div.loginNote a {
    color: #2774ea;
    display: inline-block;
}
div.loginNote dd span {
    font-family: "NotoSansKR Medium", sans-serif;
}
div.loginNote > ul > li {
    color: #636363;
}
/* 팝업 > FAQ */
div.faq {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}
div.faq a {
    display: block;
    padding: 17px 0;
    text-align: center;
    background-color: #563730;
    color: #fff;
    font-family: "OpenSans-Light", sans-serif;
}
div#popupFaq {
    background-color: #fff;
    box-sizing: border-box;
}
div#popupFaq .popup {
    position: relative;
    height: 100%;
    padding: 73px 5px 55px;
    box-sizing: border-box;
    top: 0px;
}
div.faqNote dl,
div.faqNote dt,
div.faqNote dd,
div.faqNote ul,
div.faqNote li,
div.faqNote p {
    margin: 0;
    padding: 0;
    list-style: none;
}
div.faqNote {
    padding: 10px;
    text-align: center;
    color: #121212;
    font-size: 14px;
    line-height: 20px;
    font-family: "NotoSansKR Regular", sans-serif;
}
div.contents > div.faqNote {
    padding-top: 0;
}
div.faqNote ul,
div.faqNote li {
    display: inline-block;
    vertical-align: top;
}
div.faqNote dt {
    font-family: "NotoSansKR Medium", sans-serif;
}
div.faqNote dd {
    font-family: "NotoSansKR DemiLight", sans-serif;
}
div.faqNote li {
    position: relative;
    padding-left: 15px;
    font-family: "NotoSansKR Regular", sans-serif;
}
div.faqNote li:before {
    position: absolute;
    left: 5px;
    top: 50%;
    width: 1px;
    height: 12px;
    margin-top: -5px;
    content: "";
    background-color: #d0d0d0;
}
div.faqNote li:first-child:before {
    display: none;
}
div.faqNote a {
    display: inline !important;
    text-decoration: none;
    color: #235db6;
}
.txtUnderline {
    padding: 0 4px;
    box-shadow: inset 0 -8px 0 #f9dfd9;
    color: #d82900;
}
div#popupFaq .popupCon {
    padding: 0 15px 70px;
}
div#popupFaq .popupCon h2 {
    text-align: center;
    padding-top: 10px;
    color: #333;
    font-size: 25px;
    font-family: "NotoSansKR Medium", sans-serif;
    font-weight: normal;
}
div#popupFaq .popup > .close {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}
div#popupFaq .popup > .close a {
    display: block;
    width: 100%;
    line-height: 35px;
    height: 55px;
    font-size: 18px;
    font-family: "NotoSansKR Bold", sans-serif;
    text-align: center;
    box-sizing: border-box;
}
dl.faq,
dl.faq > dt,
dl.faq > dd,
dl.faq ul,
dl.faq li,
dl.faq p {
    font-family: "NotoSansKR Regular", sans-serif;
    margin: 0;
    padding: 0;
    list-style: none;
}
dl.faq {
    padding: 0;
    border-bottom: 1px solid #ccc;
    font-size: 13px;
    line-height: 21px;
    color: #000;
    font-family: "NotoSansKR Regular", sans-serif;
    font-weight: 400;
}
div.contents > dl.faq {
    margin: 0 15px;
}
div.faqNote + dl.faq,
dl.faq:first-child {
    border-top: 2px solid #5e617a;
}
dl.faq > dt {
    position: relative;
}
dl.faq > dt:before {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    color: #fff;
    content: "Q";
    background-color: #3c60b9;
    font-size: 18px;
    line-height: 32px;
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
    text-align: center;
    z-index: 1;
}
.pro dl.faq > dt:before {
	background-color: #d76138;
}

dl.faq dt a {
    position: relative;
    display: block;
    padding: 15px 15px 15px 50px;
    text-decoration: none;
    font-size: 14px;
    line-height: 16px;
    color: #111;
    font-family: "NotoSansKR Medium", sans-serif;
}
dl.faq dt span {
    position: absolute;
    left: 10px;
    top: 10px;
    width: 25px;
    height: 14px;
    padding: 2px 0 5px;
    text-align: center;
    font-family: sans-serif;
    background-color: #212b75;
    color: #fff;
    font-size: 12px;
    line-height: 17px;
}
/* dl.faq dt a:after {position: absolute;right: 15px;top: 50%;width: 17px;height: 10px;margin-top: -5px;content: "";background: url('mobile/toggle.png') center center no-repeat;} */
dl.faq dt span.awnser {
    position: absolute;
    left: 10px;
    top: 10px;
    width: 25px;
    height: 14px;
    padding: 2px 0 5px;
    text-align: center;
    font-family: sans-serif;
    background-color: #e91e63;
    color: #fff;
    font-size: 12px;
    line-height: 17px;
}
dl.faq dt.view {
    background-color: #fff;
}
dl.faq dt.view a {
    font-family: "NotoSansKR Medium", sans-serif;
}
dl.faq dt.view a:after {
    transform: rotate(180deg);
}
dl.faq > dd.toggleCon {
    display: none;
    position: relative;
    padding: 15px 15px 15px 50px;
    border-top: 1px solid #ccc;
    background-color: #f7f7f7;
}
dl.faq > dd.toggleCon:before {
    position: absolute;
    left: 10px;
    top: 10px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    color: #fff;
    content: "A";
    background-color: #8f9297;
    font-size: 18px;
    line-height: 32px;
    font-family: "Montserrat", sans-serif;
    text-align: center;
}
dl.faq > dd.toggleCon img {
    display: block;
    margin: 15px auto 0;
}
dl.faq > dd.toggleCon > * {
    margin-top: 20px;
}
dl.faq > dd.toggleCon > *:first-child {
    margin-top: 0;
}
dl.faq dd dt {
    padding-bottom: 10px;
    font-family: "NotoSansKR Medium", sans-serif;
}
dl.faq table.tblDef {
    border-top-color: #000;
}
dl.faq table.tblDef th,
dl.faq table.tblDef td {
    padding: 5px;
    border-left: 1px solid #ccc;
    font-size: 14px;
}
dl.faq table.tblDef th {
    background-color: #f9f9f9;
    border-left: 0 none;
}
dl.faq div.btn a {
    margin-top: 5px;
    border-radius: 3px;
}
ul.listBar,
ul.listBar > li {
    margin: 0;
    padding: 0;
    list-style: none;
}
ul.listBar > li {
    position: relative;
    padding-left: 10px !important;
}
ul.listBar > li:before {
    position: absolute;
    left: 0;
    top: 0;
    content: "-";
    line-height: 1em;
}
/* 메인 */
div.webinarMain {
    position: relative;
    background-color: #b5d891;
    background-repeat: no-repeat;
    background-image: url("mobile/login_bg1.png"), url("mobile/login_bg2.png");
    background-position: left top, right bottom;
    background-size: 100% auto, 143px auto;
    box-sizing: border-box;
}
div.webinarMain.pro {
	background-color: #f8dba3;
	background-image: url("mobile/login_bg1_pro.png"), url("mobile/login_bg2_pro.png");
}

div.webinarMain div.titArea {
    height: auto;
    padding: 120px 20px 30px;
    background-color: transparent;
}
div.webinarMain div.titArea h1 {
	position: relative;
    height: auto;
    background: none;
}

div.webinarMain div.titArea h1 strong {
	position: absolute;
	right: 0;
	top: -40px;
	width: 78px;
	background-color: #fff;
	border-radius: 3px 12px 3px 12px;
	font-family: "Pretendard Variable", Pretendard, sans-serif;
	font-weight: 600;
	font-size: 12px;
	line-height: 25px;
	text-align: center;
}

div.webinarMain div.titArea h1 strong.normal-con {
	color: #228020;
	box-shadow: 0 0 8px #7aca27;
}
div.webinarMain div.titArea h1 strong.pro-con {
	color: #df4e1b;
	box-shadow: 0 0 8px #dc7d0d;
}

div.webinarMain div.titArea img {
    display: block;
    margin: 0 auto;
}
div.webinarMain div.titArea p.viewMenu {
    background: url("mobile/viewMenu_b.png") center center no-repeat;
    background-size: 26px;
}
.wsMenu {
    padding: 0 25px;
}
.wsMenu::after {
    display: block;
    content: "";
    clear: both;
}
.wsMenu li {
    position: relative;
    width: calc((100% - 10px) / 2);
    margin-top: 10px;
    border-radius: 10px;
    box-shadow: 3px 3px 0 rgba(0 0 0 / 10%);
    z-index: 1;
    overflow: hidden;
    background-repeat: no-repeat;
    background-position:
        left bottom,
        right 10px bottom 10px;
    -webkit-background-size: 92px auto;
    background-size:
        92px auto,
        auto 45px;
}
.wsMenu li::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: no-repeat url("/asset/mobile/wsMenu_layer.png") center / 100%
        100%;
    z-index: -1;
}
.wsMenu li:nth-child(1) {
    float: left;
    width: 100%;
    margin-top: 0;
    background-color: #25a683;
    background-image: url("/asset/mobile/wsMenu_circle.png"),
        url("/asset/mobile/wsMenu_01.png");
    background-position:
        left bottom,
        right 10px center;
}
.wsMenu li:nth-child(2) {
    float: left;
    height: 95px;
    background-color: #469667;
    background-image: url("/asset/mobile/wsMenu_circle.png"),
        url("/asset/mobile/wsMenu_02.png");
}
.wsMenu li:nth-child(3) {
    float: right;
    height: 143px;
    background-color: #5caf45;
    background-image: url("/asset/mobile/wsMenu_circle.png"),
        url("/asset/mobile/wsMenu_03.png");
}
.wsMenu li:nth-child(4) {
    float: left;
    height: 143px;
    background-color: #3a9fc5;
    background-image: url("/asset/mobile/wsMenu_circle.png"),
        url("/asset/mobile/wsMenu_04.png");
}
.wsMenu li:nth-child(5) {
    float: right;
    height: 95px;
    background-color: #2d608a;
    background-image: url("/asset/mobile/wsMenu_circle.png"),
        url("/asset/mobile/wsMenu_05.png");
}

.pro .wsMenu li:nth-child(1) {
	background-color: #bb436c;
}
.pro .wsMenu li:nth-child(2) {
	background-color: #be4a43;
}
.pro .wsMenu li:nth-child(3) {
	background-color: #d77329;
}
.pro .wsMenu li:nth-child(4) {
	background-color: #b5519f;
}
.pro .wsMenu li:nth-child(5) {
	background-color: #45589f;
}
.wsMenu a {
    display: block;
    height: 100%;
    padding: 15px 10px;
    font-family: "Roboto-Medium", sans-serif;
    font-size: 17px;
    text-decoration: none;
    color: #fff;
    box-sizing: border-box;
}
div.webinarMain div.out {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    font-size: 0;
}
div.webinarMain div.out a {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    padding: 15px 0;
    line-height: 25px;
    text-align: center;
    border-radius: 20px 20px 0 0;
    background-color: #3d424f;
    color: #fff;
    font-family: "Roboto-Medium", sans-serif;
    font-size: 21px;
    text-decoration: none;
    box-sizing: border-box;
}
/* div.webinarMain div.out a:first-child {background-color: #45afe1;border-radius: 20px 0 0 0;} */
div.webinarMain div.out img {
    display: inline-block;
    width: 20px;
    padding: 5px 0 0 10px;
    vertical-align: top;
}
/* 강의실 입장 */
div.room {
    padding: 0 0 15px;
    background-color: #f0f2fa;
}
div.room h3 {
    margin: 0;
    padding: 25px 0;
    background-color: #fff;
}
div.room h3 img {
    display: block;
    margin: 0 auto;
    height: 52px;
}
div.room h4,
div.room p.note {
    margin: 0;
    padding: 15px 0;
    background-color: #263b80;
    color: #fff;
    text-align: center;
    font-size: 14px;
    font-family: "NotoSansKR Medium", sans-serif;
    line-height: 20px;
    font-weight: normal;
}
dl.room,
dl.room dt,
dl.room dd,
dl.room ul,
dl.room li {
    margin: 0;
    padding: 0;
    list-style: none;
}
dl.room {
    border-top: 2px solid #272b4b;
    margin: 15px 15px 0;
    background-color: #fff;
    box-shadow: 0 0 15px rgba(196, 172, 148, 0.35);
}
dl.room > dt {
    text-align: center;
    color: #fff;
    font-size: 17px;
    font-family: "NotoSansKR Medium", sans-serif;
    line-height: 57px;
    background-color: #3dacb3;
}
dl.room a.trigger {
    position: relative;
    display: block;
    text-align: left;
    padding: 14px 40px 13px 20px;
    text-decoration: none;
    color: #000;
    font-size: 15px;
    line-height: 20px;
    font-family: "NotoSansKR Regular", sans-serif;
    font-weight: 400;
    background-color: #f0f1f2;
}
dl.room a.trigger:after {
    position: absolute;
    right: 20px;
    top: 50%;
    width: 10px;
    height: 6px;
    margin-top: -3px;
    content: "";
    background: url("mobile/trigger.png") center center no-repeat;
    background-size: 9px;
}
dl.room .view a.trigger:after {
    transform: rotate(-180deg);
}
dl.room > dt span {
    display: block;
    font-size: 15px;
}
dl.room > dd {
    padding: 15px 20px;
    color: #777;
    font-size: 14px;
}
dl.room > dd.toggleCon {
    padding-bottom: 0;
}
dl.room li {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #ccc;
    color: #222;
    font-size: 13px;
    line-height: 20px;
}
dl.room li:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: 0 none;
}
dl.room li span {
    display: block;
}
dl.room dd.btn a {
    display: block;
    border-color: #3dacb3;
    background-color: #3dacb3;
    color: #fff;
}
dl.room.active dt {
    background-color: #4386dd;
}
dl.room.active dd.btn a {
    background-color: #ecc736;
    border-color: #ecc736;
    color: #343434;
}
dl.room.active dd.btn a:after {
    background-image: url("mobile/btnBl_arr_on.png");
}
dl.vod,
dl.vod dt,
dl.vod dd,
dl.vod ul,
dl.vod li {
    margin: 0;
    padding: 0;
    list-style: none;
}
dl.vod {
    border-top: 2px solid #272b4b;
    margin: 15px 15px 0;
    box-shadow: 0 0 15px rgba(196, 172, 148, 0.35);
    font-family: "NotoSansKR Regular", sans-serif;
    background-color: #fff;
}
dl.vod > dt {
    padding: 15px;
    color: #1b1b1b;
    font-size: 17px;
    font-family: "NotoSansKR Medium", sans-serif;
    line-height: 1.2;
    background-color: #f0f1f2;
}
dl.vod > dt span.time {
    display: block;
    padding-top: 5px;
    color: #222;
    font-size: 15px;
    font-family: "NotoSansKR Regular", sans-serif;
}
dl.vod > dd {
    padding: 0 15px 15px;
}
ul.vodItem li {
    position: relative;
    padding-top: 15px;
    color: #222;
    font-size: 15px;
}
ul.vodItem li span {
    display: block;
    font-family: "NotoSansKR Bold", sans-serif;
}
ul.vodItem li a {
    position: absolute;
    right: 0;
    top: 20px;
    display: block;
    height: 20px;
    line-height: 20px;
    padding: 4px 40px 6px 20px;
    font-size: 14px;
    border-radius: 15px;
    font-family: "NotoSansKR Regular", sans-serif;
    background-color: #263b80;
    color: #fff;
    text-align: left;
    text-decoration: none;
}
ul.vodItem li a:after {
    position: absolute;
    right: 20px;
    top: 50%;
    width: 11px;
    height: 8px;
    margin-top: -4px;
    content: "";
    background: url("mobile/btnBl_arr.png") center center no-repeat;
    background-size: 11px;
}
.graph {
    position: relative;
    display: block;
    height: 25px;
    margin-top: 10px;
    background-color: #eee;
}
.graph:after {
    position: absolute;
    right: 10px;
    top: 0;
    line-height: 25px;
    color: #222;
    font-size: 15px;
    content: attr(data-num);
}
.graphBar {
    float: left;
    display: block;
    height: 25px;
    background-color: #c75900;
}
/* Player */
div#player {
    overflow: hidden;
    position: relative;
    min-width: 320px;
    padding-bottom: 80px;
    background-color: #f2f2f2;
    box-sizing: border-box;
}
div#player div.titArea {
    padding: 0 140px 0 0;
}
div#player p.sessionOut {
    position: absolute;
    right: 55px;
    top: 0;
    width: 90px;
    height: 100%;
    background-color: #fff;
}
div#player p.sessionOut a {
    display: table-cell;
    width: 90px;
    height: 55px;
    color: #d91e4a;
    text-align: center;
    vertical-align: middle;
    font-family: "NotoSansKR Medium", sans-serif;
    font-size: 15px;
    line-height: 18px;
    text-decoration: none;
}
div#player p.sessionOut a span {
    display: block;
    font-size: 14px;
}
#playzone,
video {
    width: 100%;
}
p.user {
    padding: 15px 15px 0;
    color: #000;
    font-size: 15px;
    font-family: "NotoSansKR Medium", sans-serif;
}
div#player div.note {
    padding: 0 15px 15px;
    color: #e81e1e;
    font-family: "NotoSansKR Medium", sans-serif;
    font-size: 12px;
    line-height: 16px;
}
div#player div.out {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}
div#player div.out a {
    display: block;
    padding: 15px 0;
    line-height: 25px;
    text-align: center;
    background-color: #394e72;
    color: #fff;
    font-family: "NotoSansKR Bold", sans-serif;
    font-size: 17px;
    text-decoration: none;
}
ul.playUtil,
ul.playUtil > li,
ul.playUtil a {
    margin: 0;
    padding: 0;
    list-style: none;
}
ul.playUtil {
    border-radius: 4px;
    margin: 15px;
}
ul.playUtil:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    font-size: 0;
    content: " ";
}
ul.playUtil > li {
    /* position: relative; */
    float: left;
    width: 50%;
    background-color: #fff;
    box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.06);
}
ul.playUtil > li.wide {
    width: 100%;
}
ul.playUtil > li > a {
    display: block;
    position: relative;
    padding: 10px 20px 10px 10px;
    text-decoration: none;
    color: #000;
    font-size: 15px;
    line-height: 42px;
    font-family: "NotoSansKR Medium", sans-serif;
}
ul.playUtil > li:nth-child(3) > a,
ul.playUtil > li:nth-child(4) > a {
    border-top: 1px solid #f2f2f2;
    border-bottom: 1px solid #f2f2f2;
}
ul.playUtil > li:nth-child(odd) > a {
    border-right: 1px solid #f2f2f2;
}
ul.playUtil > li.wide a {
    border-right: 0 none;
    text-align: center;
}
ul.playUtil > li > a > img {
    display: inline-block;
    vertical-align: top;
    width: 42px;
    margin-right: 10px;
}
ul.playUtil > li > a.twoLine {
    padding: 13px 10px 13px 70px;
}
ul.playUtil div.toolTip {
    display: none;
    margin-bottom: -40%;
    bottom: 40%;
    z-index: 999;
    position: absolute;
    left: 2%;
    width: calc(100% - 20px);
    padding: 10px 15px 10px 10px;
    border-radius: 4px;
    border: 1px solid #313131;
    background-color: #fff;
    box-sizing: border-box;
    box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.18);
}
ul.playUtil div.toolTip .tooltip_msg {
    margin-top: 25px;
    max-height: 400px;
    overflow-x: hidden;
    overflow-y: auto;
}
ul.playUtil div.toolTip:after {
    position: absolute;
    left: 20px;
    bottom: -7px;
    width: 10px;
    height: 10px;
    border-bottom: 1px solid #313131;
    border-right: 1px solid #313131;
    background-color: #fff; /* content: " " */
    transform: rotate(45deg);
}
ul.playUtil div.toolTip .close {
    position: absolute;
    right: 10px;
    top: 20px;
    width: 30px;
    height: 30px;
}
ul.playUtil div.toolTip .close a,
ul.playUtil div.tooltip .close img {
    display: block;
}
div.btnOut {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}
div.btnOut a {
    display: block;
    width: 100%;
    padding: 13px 0 15px;
    text-align: center;
    font-size: 17px;
    font-family: "NotoSansKR Regular", sans-serif;
}
ul.menu div.toolTip {
    display: none;
    margin-bottom: -40%;
    bottom: 40%;
    z-index: 999;
    position: absolute;
    left: 2%;
    width: calc(100% - 20px);
    padding: 10px 15px 10px 15px;
    border-radius: 4px;
    border: 1px solid #313131;
    background-color: #fff;
    box-sizing: border-box;
    box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.18);
}
ul.menu div.toolTip .tooltip_msg {
    margin-top: 30px;
    max-height: 280px;
    overflow-x: hidden;
    overflow-y: auto;
}
ul.menu div.toolTip:after {
    position: absolute;
    left: 20px;
    bottom: -7px;
    width: 10px;
    height: 10px;
    border-bottom: 1px solid #313131;
    border-right: 1px solid #313131;
    background-color: #fff; /* content: " " */
    transform: rotate(45deg);
}
ul.menu div.toolTip .close {
    position: absolute;
    right: 10px;
    top: 12px;
    width: 30px;
    height: 30px;
}
ul.menu div.tooltip .close img {
    display: block;
}
ul.menu,
ul.menu li,
ul.menu a {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
ul.menu {
    padding: 15px 10px;
    background-color: #ffffff;
}
ul.menu:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    font-size: 0;
    content: "";
}
ul.menu > li {
    float: left;
    width: 50%;
}
ul.menu > li:first-child {
    width: 50%;
}
ul.menu a {
    display: block;
    text-align: center;
    color: #000;
    font-size: 15px;
    font-family: "NotoSansKR Medium", sans-serif;
    font-weight: 400;
}
ul.menu img {
    display: block;
    width: 46px;
    margin: 0 auto 6px;
}
ul.menu > li:nth-child(n + 3) {
    margin-top: 10px;
}
/* 긴급공지 */
dl.popupAlert {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    margin: 0;
    padding: 25px 20px;
    background-color: #fff;
    box-sizing: border-box;
    max-height: 300px;
    overflow-y: scroll;
}
dl.popupAlert dt {
    color: #111;
    text-align: center;
    margin: 0;
    font-size: 24px;
    line-height: 30px;
    font-family: "Roboto-Medium", "NotoSansKR Medium", sans-serif;
}
dl.popupAlert dd {
    margin: 0;
}
dl.popupAlert dd.con {
    margin-top: 15px;
    color: #333;
    font-size: 15px;
    line-height: 21px;
    word-break: keep-all;
    font-family: "NotoSansKR DemiLight", sans-serif;
}
#popupAlert dd.close {
    left: auto;
    bottom: auto;
    width: auto;
}
#popupAlert dd.close a {
    background: none;
    height: auto;
    line-height: auto;
}
#popupAlert dd.close,
dl.popupAlert dd.close {
    position: absolute;
    right: 20px;
    top: 25px;
}
#popupAlert dd.close a,
#popupAlert dd.close img,
dl.popupAlert dd.close a,
dl.popupAlert dd.close img {
    display: block;
    width: 23px;
}
/* 레이어 팝업*/
div.layerPopup {
    display: none;
    z-index: 250;
    position: fixed;
    left: 0;
    top: 0;
    overflow: auto;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    font-family: "NotoSansKR Regular", sans-serif;
}
div.layerPopup div.popupWrap {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}
div.layerPopup h1 {
    padding: 10px 0;
    text-align: center;
    color: #fff;
    font-weight: normal;
    background-color: #2f356d;
    font-size: 23px;
    line-height: 35px;
    font-family: "NotoSansKR Medium", sans-serif;
}
div.layerPopup .close {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}
div.layerPopup .close a {
    display: block;
    width: 100%;
    line-height: 55px;
    height: 55px;
    padding: 0;
    font-size: 18px;
    font-family: "NotoSansKR Bold", sans-serif;
    text-align: center;
    box-sizing: border-box;
    text-decoration: none;
}
div#popupVod .popupWrap {
    left: 20px;
    top: 30%;
    width: calc(100% - 40px);
}
div#popupVod .close {
    position: absolute;
    left: auto;
    right: 0;
    bottom: auto;
    top: -40px;
    width: 30px;
}
div#popupVod .close a,
div#popupVod .close img {
    display: block;
    width: 30px;
    height: 30px;
    background: none;
}
div#popupAgree .popupWrap {
    /* overflow: hidden; */
    position: absolute;
    left: 25px;
    top: 50%;
    width: calc(100% - 40px);
    height: 511px;
    transform: translateY(-50%);
    padding: 20px;
    background-color: #fff;
    box-sizing: border-box;
}
div#popupAgree h1 {
    margin: 0;
    padding: 0;
    text-align: center;
    color: #000;
    font-size: 16px;
    font-family: "NotoSansKR Medium", sans-serif;
    background: none;
}
div#popupAgree h1 img {
    display: inline-block;
    height: 28px;
    padding: 5px 0 0;
    vertical-align: top;
}
div#popupAgree h1 + p {
    display: table-cell;
    width: 1000px;
    height: 55px;
    margin: 0;
    padding: 0;
    text-align: center;
    color: #000;
    font-size: 12px;
    vertical-align: middle;
    line-height: 17px;
    letter-spacing: -0.6px;
    font-family: "NotoSansKR Medium", sans-serif;
}
div#popupAgree h1 + p span {
    color: #e81e1e;
}
div#popupAgree div.bg {
    position: relative;
    padding: 10px;
    background-color: #f2f2f2;
}
div.agreeCon {
    position: relative;
    font-size: 13px;
    font-family: "NotoSansKR", sans-serif;
    overflow-x: hidden;
    overflow-y: auto;
    height: 250px;
    padding-right: 10px;
    text-align: justify;
}
div.agreeCon::-webkit-scrollbar {
    width: 10px;
    margin: 10px;
}
div.agreeCon::-webkit-scrollbar-track {
    background-color: #fff;
}
div.agreeCon::-webkit-scrollbar-thumb {
    background-color: #222;
}
div.agreeCon h4 {
    margin: 20px 0 5px;
}
div.agreeCon h4:first-child {
    margin-top: 0;
}
div.agreeCon dt {
    margin-top: 20px;
    font-family: "NotoSansKR Medium", sans-serif;
    color: #1b1b1b;
    font-size: 14px;
}
div.agreeCon dt:first-child {
    margin-top: 0;
}
div.agreeCon dd,
div.agreeCon dd p,
div.agreeCon dd li {
    color: #1b1b1b;
    font-family: "NotoSansKR Regular", sans-serif;
    font-size: 12px;
    line-height: 1.4;
}
div#popupAgree .agree {
    text-align: center;
    margin: 0;
    padding: 20px 0 0;
}
div#popupAgree .agree span.inputC {
    margin-right: 10px;
    vertical-align: top;
}
div#popupAgree .agree label {
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    line-height: 24px;
    font-size: 13px;
    color: #222;
    font-family: "NotoSansKR Medium", sans-serif;
}
div#popupAgree .btnArea {
    padding-top: 25px;
    text-align: center;
}
div#popupAgree .btnArea * {
    width: 155px;
    height: 40px;
    font-size: 15px;
    font-family: "NotoSansKR Medium", sans-serif;
    background-color: #4183c0 !important;
    border-color: #4183c0 !important;
}
.pro div#popupAgree .btnArea * {
	background-color: #d76138 !important;
	border-color: #d76138 !important;
}
div#popupAgree .close {
    position: absolute;
    right: 0;
    top: -45px;
    left: auto;
    width: 30px;
    height: 30px;
    background-size: 30px;
    margin: 0;
    padding: 0;
}
div#popupAgree .close a {
    width: 30px;
    height: 30px;
    background: url("mobile/popup_close_w.png") center center no-repeat;
    text-indent: -9999px;
}
div#popupPlayer {
}
div#popupPlayer .popupWrap {
    position: absolute;
    left: 0;
    top: auto;
    bottom: 0;
    width: 100%;
    height: auto;
    padding: 10px 15px 75px;
    background-color: #f2f2f2;
    box-sizing: border-box;
}
div#popupPlayer h1 {
    padding: 0 0 10px;
    margin: 0;
    color: #1b2646;
    text-align: left;
    font-size: 22px;
    font-family: "NotoSansKR Bold", sans-serif;
    background: none;
}
div#popupPlayer textarea {
    width: 100%;
    height: 170px;
    border: 1px solid #d6d8e3;
    padding: 10px;
    color: #7f7f7f;
    font-size: 14px;
    box-sizing: border-box;
}
/* div#popupPlayer .formArea {position: relative;} */
div#popupPlayer .formArea p {
    font-size: 14px;
    color: #4d4d4d;
}
/* div#popupPlayer div.textareaBox {position: relative;border: 1px solid #d6d8e3;background-color: #fff;} */
div#popupPlayer div.textareaBox textarea {
    position: relative;
    z-index: 10;
    color: #000;
    font-size: 14px;
    line-height: 1.2;
    font-family: "NotoSansKR Regular", sans-serif;
    border: 1px solid #d6d8e3;
}
div#popupPlayer textarea:placeholder {
    color: #7f7f7f;
    font-size: 14px;
    font-family: "NotoSansKR Light", sans-serif;
}
/* div#popupPlayer div.textareaBox textarea:focus + span.placeholder {display: none;} */
ul.voting,
ul.voting > li,
ul.voting a {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
ul.voting {
    padding: 40px 0 20px;
}
ul.voting:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    font-size: 0;
    content: "";
}
ul.voting > li {
    float: left;
    width: 20%;
    vertical-align: top;
    margin: auto 0%;
}
ul.voting a {
    position: relative;
    display: block;
    width: 60px;
    margin: 0 auto;
    padding: 18px 0;
    text-align: center;
    border-radius: 30px;
    color: #c8c9d1;
    font-size: 22px;
    line-height: 24px;
    font-family: "NotoSansKR Bold", sans-serif;
    background-color: #fff;
    box-shadow: 5px 5px 7px rgba(0, 0, 0, 0.1);
}
ul.voting > li.on a {
    color: #fff;
    background-color: #263b80;
}
ul.voting > li.on a:before {
    position: absolute;
    left: 5px;
    top: 5px;
    width: 48px;
    height: 48px;
    border-radius: 25px;
    content: " ";
    border: 1px solid rgba(255, 255, 255, 0.25);
}
div#popupPlayer .formArea .btn {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 55px;
}
div#popupPlayer .formArea .btn * {
    float: left;
    width: 50%;
    height: 55px;
    font-size: 18px;
    font-family: "NotoSansKR Medium", sans-serif;
    text-align: center;
    box-sizing: border-box;
    border-radius: 0;
    background-color: #4183c0 !important;
    border-color: #4183c0 !important;
    color: #fff;
}
div#popupPlayer .formArea .btn a {
    line-height: 35px;
    background-color: #394e72 !important;
    border-color: #394e72 !important;
}
div#popupPlayer .popupWrap > .close {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}
div#popupPlayer .popupWrap > .close a {
    display: block;
    width: 100%;
    line-height: 55px;
    height: 55px;
    font-size: 18px;
    font-family: "NotoSansKR Bold", sans-serif;
    text-align: center;
    box-sizing: border-box;
    text-decoration: none;
    color: #fff;
    background-color: #242b37;
}
div#popupNotice {
    background-color: #fff;
    box-sizing: border-box;
}
div#popupNotice div.popupCon {
    padding: 15px 15px 70px;
}
dl.notice,
dl.notice > dt,
dl.notice > dd {
    margin: 0;
    padding: 0;
}
dl.notice {
    border: 1px solid #dcdcdc;
}
div.contents > dl.notice {
    margin: 0 15px;
}
dl.notice + dl.notice {
    border-top: 0 none;
}
dl.notice a.trigger {
    position: relative;
    overflow: hidden;
    display: block;
    padding: 15px 40px 14px 20px;
    text-decoration: none;
    color: #000;
    font-size: 15px;
    font-family: "NotoSansKR Medium", sans-serif;
    text-overflow: ellipsis;
    white-space: nowrap;
}
dl.notice a.trigger:after {
    position: absolute;
    right: 20px;
    top: 50%;
    width: 10px;
    height: 6px;
    margin-top: -3px;
    content: "";
    background: url("mobile/trigger.png") center center no-repeat;
    background-size: 9px;
}
dl.notice .view a.trigger:after {
    transform: rotate(-180deg);
}
dl.notice > dd {
    padding: 15px 20px;
    border-top: 1px solid #dcdcdc;
    color: #777;
    font-size: 14px;
}
dl.notice:nth-child(even) a.trigger {
    background-color: #f8f8f8;
}
div#popupNotice .popup > .close {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}
div#popupNotice .popup > .close a {
    display: block;
    width: 100%;
    height: 55px;
    font-size: 18px;
    font-family: "NotoSansKR Bold", sans-serif;
    text-align: center;
    box-sizing: border-box;
}
ul.tabMenu,
ul.tabMenu > li,
ul.tabMenu a,
ul.subMenu,
ul.subMenu > li,
ul.subMenu a,
ul.conMenu,
ul.conMenu > li,
ul.conMenu a {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
ul.tabMenu,
ul.subMenu,
ul.conMenu {
}
ul.tabMenu:after,
ul.subMenu:after,
ul.conMenu:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    font-size: 0;
    content: " ";
}
ul.tabMenu > li,
ul.subMenu > li,
ul.conMenu > li {
    float: left;
}
ul.tabMenu a,
ul.subMenu a,
ul.conMenu a {
    display: block;
    text-align: center;
}
ul.tabMenu,
ul.subMenu,
ul.conMenu {
    border-top: 1px solid #dcdcdc;
}
ul.tabMenu a,
ul.subMenu a,
ul.conMenu a {
    padding: 7px 0;
    background-color: #fff;
    border-right: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
    color: #696969;
    font-family: "NotoSansKR Medium", sans-serif;
    font-size: 14px;
}
ul.tabMenu .on a,
ul.subMenu .on a,
ul.conMenu .on a {
    background-color: #589715;
    border-color: #589715;
    color: #fff;
}
.pro ul.tabMenu .on a,
.pro ul.subMenu .on a,
.pro ul.conMenu .on a {
    background-color: #d76138;
    border-color: #d76138;
}


ul.col2ea > li {
    width: 50%;
}
ul.col3ea > li {
    width: 33.3%;
}
ul.col3ea > li:nth-child(3n + 1) {
    width: 33.4%;
}
ul.col4ea > li {
    width: 25%;
}
ul.col5ea > li {
    width: 20%;
}
ul.col2ea li:nth-child(2n + 1) a,
ul.col3ea li:nth-child(3n + 1) a,
ul.col3ea li:nth-child(4n + 1) a ul.col5ea li:nth-child(3n + 1) a {
    border-left: 1px solid #dcdcdc;
}
div#popupProgram {
    background-color: #fff;
    box-sizing: border-box;
}
div#popupProgram ul.subMenu {
    margin: 15px;
}
div.webinar h3 + ul.subMenu {
    margin-top: 0 !important;
}
div#popupProgram .popupCon {
    padding: 0 15px 70px;
}
/* div.webinar div#popupProgram .popupCon {padding-bottom: 15px;} */
div#popupProgram div.popupCon p {
    padding-bottom: 10px;
    color: #111;
    font-size: 18px;
    font-family: "NotoSansKR Medium", sans-serif;
    line-height: 23px;
}
div#popupProgram div.popupCon p span {
    display: inline-block;
    font-weight: normal;
    color: #5e5e5e;
    font-size: 12px;
    vertical-align: top;
}
div#popupProgram h4,
div.program h4 {
    margin: 15px 15px 0;
    color: #111;
    font-weight: normal;
    font-family: "NotoSansKR Medium", sans-serif;
    font-size: 18px;
    line-height: 29px;
}
div.program h4 {
    margin: 15px 0 10px;
}
div#popupProgram h4 span,
div.program h4 span {
    display: inline-block;
    padding-left: 5px;
    vertical-align: top;
    color: #5e5e5e;
    font-size: 12px;
}
div#popupProgram strong,
div#popupProgram span {
    display: block;
}
dl.programList,
dl.programList > dt,
dl.programList > dd {
    margin: 0;
    padding: 0;
}
div#popupProgram p + dl.programList {
    border-top: 2px solid #000;
}
dl.programList + dl.programList {
    border-top: 1px solid #f9f9f9;
}
dl.programList a.trigger {
    position: relative;
    overflow: hidden;
    display: block;
    padding: 10px 30px 10px 15px;
    text-decoration: none;
    color: #000;
    font-size: 15px;
    background-color: #f1f1f1;
    font-family: "NotoSansKR Medium", sans-serif;
    text-overflow: ellipsis;
    white-space: nowrap;
}
dl.programList a.trigger:after {
    position: absolute;
    right: 14px;
    top: 50%;
    width: 15px;
    height: 7px;
    transform: translateY(-50%);
    content: "";
    background: url("mobile/program_trigger.png") center center no-repeat;
    background-size: 9px;
}
dl.programList .view a.trigger:after {
    transform: rotate(-180deg);
}
dl.programList > dd {
    border-top: 1px solid #e7e7e7;
    color: #333;
    font-size: 15px;
}
dl.program > dt {
    border-bottom: 1px solid #eaeaea;
}
dl.program a.trigger {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    width: 2000px;
    height: 45px;
    padding: 5px 10px;
    background-color: #f1f1f1;
    color: #000;
    font-size: 16px;
    font-family: "NotoSansKR Medium", sans-serif;
    text-decoration: none;
}
dl.program a.trigger:after {
    position: absolute;
    right: 20px;
    top: 50%;
    width: 15px;
    height: 8px;
    margin-top: -4px;
    content: "";
    background: url("player/toggle.png") center center no-repeat;
    background-size: 15px;
}
dl.program dt.view a.trigger:after {
    transform: rotate(-180deg);
}
dl.program {
    border-top: 1px solid #eaeaea;
}
dl.program:first-of-type {
    border-top: 2px solid #000;
}
dl.program dt {
    padding: 15px;
    font-family: "NotoSansKR DemiLight", sans-serif;
    font-size: 14px;
    line-height: 17px;
}
dl.program dt span {
    font-family: "NotoSansKR Medium", sans-serif;
    font-size: 15px;
    color: #000;
}
/* 심포지엄 */
dl.program.typeA {
    background-color: #f1f1f1;
}
dl.program.typeA dt span {
    color: #000000;
}
/* 연수강좌 */
dl.program.typeB {
    background-color: #fceef3;
}
dl.program.typeB dt span {
    color: #bd459a;
}
/* 특강 */
dl.program.typeC {
    background-color: #fceef3;
}
dl.program.typeC dt span {
    color: #ea0a49;
}
dl.program.typeC dt span.tit {
    color: #333;
}
dl.program dd {
    background-color: #fff;
}
dl.programList ul,
dl.programList li,
dl.program ul,
dl.program li {
    margin: 0;
    padding: 0;
    list-style: none;
}
dl.programList li,
dl.program li {
    border-bottom: 1px solid #e7e7e7;
    padding: 15px;
    color: #333;
    font-size: 15px;
    font-family: "NotoSansKR Regular", sans-serif;
}
dl.programList dd.toggleCon li:last-child,
dl.program dd.toggleCon li:last-child {
    border-bottom: 0 none;
}
dl.programList span.tit,
dl.program span.tit {
    display: block;
    font-size: 15px;
    font-family: "NotoSansKR Bold", sans-serif;
}
dl.programList li span.tit,
dl.program li span.tit {
    padding-top: 5px;
}
div.break {
    border-bottom: 1px solid #e7e7e7;
}
table.tblProgram {
    width: 100%;
    border: 0 none;
    border-top: 1px solid #d3d3d3;
    border-left: 1px solid #d3d3d3;
}
table.tblProgram th,
table.tblProgram td {
    padding: 5px 5px 7px;
    border: 0 none;
    border-bottom: 1px solid #d3d3d3;
    border-right: 1px solid #d3d3d3;
    font-size: 11px;
    font-family:
        Malgun Gothic,
        "Malgun Gothic",
        malgungothic,
        Dotum,
        "Apple Gothic",
        sans-serif;
    vertical-align: middle;
    line-height: 1.2em;
    background-color: #fff;
}
table.tblProgram th {
    background-color: #f2dcdb;
    font-weight: bold;
    text-align: center;
}
table.tblProgram td {
    height: 30px;
}
table.tblProgram td.time {
    width: 80px;
    padding: 5px 0 7px;
    text-align: center;
    background-color: #ededed;
    text-align: center;
}
table.tblProgram td.speaker {
    width: 90px;
    text-align: left;
    letter-spacing: -1px;
}
table.tblProgram td.tit {
    max-width: 250px;
    text-align: left;
}
table.tblProgram td.break {
    text-align: center;
    background-color: #dce6f1;
    font-weight: bold;
}
table.tblProgram td.luncheon {
    background-color: #dce6f1;
    font-weight: bold;
    text-align: center;
}
table.tblProgram td.dinner {
    background-color: #da9694;
    font-weight: bold;
}
table.tblProgram td.handtit {
    width: 80px;
    text-align: center;
}
table.tblProgram td.handtime {
    width: 80px;
    padding: 5px 0 7px;
    text-align: center;
    background-color: #ededed;
    text-align: center;
}
table.tblProgram td.handspeaker {
    width: 80px;
    padding: 5px 0 7px;
    text-align: center;
}
/* Essentials */
table.tblProgram td.essen {
    background-color: #fdfec2 !important;
    font-weight: bold;
}
/* General */
table.tblProgram td.general {
    background-color: #fbcede !important;
    font-weight: bold;
}
/* 입원전담전문의 */
table.tblProgram td.special {
    background-color: #b7dee8 !important;
    font-weight: bold;
}
/* Advanced */
table.tblProgram td.advanced {
    background-color: #ebf1de !important;
    font-weight: bold;
}
/* 노년내과 심포지엄 */
table.tblProgram td.sympo {
    background-color: #d6cde1 !important;
    font-weight: bold;
}
/* Non-medical */
table.tblProgram td.non {
    background-color: #49bef9 !important;
    font-weight: bold;
}
table.tblProgram td.quiz {
    background-color: #ffcc00 !important;
    font-weight: bold;
}
table.tblProgram td.essen2 {
    background-color: #ffc6aa !important;
    font-weight: bold;
}
table.tblProgram td.edu {
    background-color: #ddd9c4 !important;
    font-weight: bold;
}
table.tblProgram td.hands {
    background-color: #ddd9c4 !important;
    font-weight: bold;
}
table.tblProgram td.medical {
    background-color: #61c7ec !important;
    font-weight: bold;
}
table.tblProgram td.poster {
    background-color: #95b3d7 !important;
    font-weight: bold;
}
table.tblProgram td.posterCon {
    background-color: #dce6f1 !important;
}
table.tblProgram td.hospital {
    background-color: #f8ead6 !important;
    font-weight: bold;
}
table.tblProgram td.joint {
    background-color: #ffc698 !important;
    font-weight: bold;
}
table.tblProgram td.chief {
    background-color: #f2f2f2 !important;
    font-weight: bold;
}
table.tblProgram td.board {
    background-color: #fcd5b4 !important;
    font-weight: bold;
}
table.tblProgram td.workshop {
    background-color: #b7dee8;
    text-align: center;
    font-weight: bold;
}
table.tblProgram td.workshop2 {
    background-color: #8db4e2;
    text-align: center;
    font-weight: bold;
}
table.tblProgram td.poster,
table.tblProgram td.posterCon,
.ac {
    text-align: center;
}
.fwBold {
    font-weight: bold;
}
div.program {
    padding: 0 15px 15px;
}
/* E-Poster */
.subTit {
    padding: 15px;
    font-family: "NotoSansKR Medium", sans-serif;
    font-size: 24px;
    color: #222;
}
.subTit_bl {
    margin: 0 15px 15px;
    padding-left: 20px;
    font-family: "NotoSansKR Medium", sans-serif;
    font-weight: normal;
    font-size: 15px;
    color: #222;
    background: url("mobile/subTit_bl_m.png") no-repeat left center;
    background-size: 15px;
}
h4.subTit_bl2 {
    text-align: center;
    font-family: "NotoSansKR Medium", sans-serif;
    font-weight: normal;
    font-size: 20px;
    color: #252361;
}
div.session {
    padding: 15px;
}
div.searchArea {
    position: relative;
    padding: 15px 15px 0;
    background-color: #f2f3f8;
}
div.searchArea input[type="text"] {
    width: 100%;
    height: 40px;
    padding: 0 40px 0 10px;
    box-sizing: border-box;
    border-color: #485074;
    background: #485074 url("mobile/btn_search.png") right center no-repeat;
    background-size: 40px;
    color: #fff;
    font-size: 14px;
}
div.searchArea input[type="text"]::placeholder {
    line-height: 49px;
    color: #fff;
    font-size: 13px;
}
div.searchArea input[type="submit"] {
    position: absolute;
    right: 15px;
    top: 15px;
    width: 40px;
    height: 33px;
    opacity: 0;
}
dl.toggleArea,
dl.toggleArea * {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
dl.toggleArea a {
    display: block;
}
dl.toggleArea {
    z-index: 50;
    position: relative;
    padding: 15px;
    background-color: #f2f3f8;
}
dl.toggleArea a.trigger {
    position: relative;
    padding: 9px 30px 9px 10px;
    border: 1px solid #ccc;
    background-color: #fff;
    color: #222;
    font-size: 14px;
    line-height: 20px;
}
dl.toggleArea a.trigger:after {
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -6px;
    content: "▼";
    line-height: 12px;
    font-size: 10px;
}
dl.toggleArea.view a.trigger:after {
    transform: rotate(180deg);
}
dl.toggleArea > dd {
    position: absolute;
    left: 15px;
    top: 55px;
    width: calc(100% - 30px);
    border: 1px solid #ccc;
    border-top: 0 none;
    background-color: #fff;
    box-sizing: border-box;
}
dl.toggleArea ul {
    max-height: 250px;
    padding: 5px 10px 10px;
    height: auto;
    overflow-y: scroll;
}
dl.toggleArea li {
    margin-top: 5px;
    border-bottom: 1px solid #dfdfdf;
}
dl.toggleArea li:last-child {
    border-bottom: none;
}
dl.toggleArea li a {
    font-size: 12px;
    color: inherit;
    padding: 10px;
}
dl.session,
dl.session * {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
dl.session {
    margin-top: 15px;
    border: 1px solid #ccc;
}
dl.session:first-child {
    margin-top: 0;
}
dl.session a,
dl.session span {
    display: block;
    font-family: "NotoSansKR Regular", sans-serif;
    font-size: 13px;
    line-height: 16px;
}
dl.session a.trigger {
    position: relative;
    padding: 15px 87px 15px 15px;
    color: #444;
    font-size: 12px;
    font-family: "NotoSansKR Light", sans-serif;
}
dl.session a.trigger:after {
    position: absolute;
    right: 13px;
    top: 50%;
    width: 20px;
    height: 10px;
    content: "";
    background: url("mobile/toggle.png") center center no-repeat;
    background-size: 15px;
}
dl.session.view {
    border-color: #0071bb;
}
dl.session.view a.trigger:after {
    transform: rotate(180deg);
}
dl.session span.num {
    color: #3a0ca3;
    font-family: "NotoSansKR Medium", sans-serif;
    font-size: 12px;
}
dl.session span.tit {
    padding: 5px 0px;
    color: #222;
    font-family: "NotoSansKR Medium", sans-serif;
    font-size: 14px;
    line-height: 20px;
}
dl.session > dd {
    padding: 0 15px 15px;
}
div.vod {
    min-height: 150px;
    background: #dfdfe2 url("mobile/bg_play.png") center center no-repeat;
    background-size: 49px;
}
div.poster {
    position: relative;
    overflow: hidden;
    height: 150px;
    background-color: #dfdfe2;
}
div.poster img {
    display: block;
    width: 100%;
}
div.poster a.viewBig {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 30px;
    height: 30px;
    text-indent: -10000px;
    background: #2bace8 url("mobile/viewBig.png") center center no-repeat;
    background-size: 11px;
}
div#popupSession {
    background-color: #fff;
    box-sizing: border-box;
}
/* 이부스 */
div#eBooth {
    position: relative;
    font-family: "NotoSansKR Regular", sans-serif;
}
ul.eboothList,
ul.eboothList li,
ul.eboothList a {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
ul.eboothList {
    padding: 0 20px 20px;
}
ul.eboothList:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    font-size: 0;
    content: "";
}
ul.eboothList li {
    float: right;
    width: calc(50% - 5px);
    padding-top: 10px;
}
ul.eboothList li:nth-child(odd) {
    clear: both;
    float: left;
}
ul.eboothList li:nth-child(1),
ul.eboothList li:nth-child(2) {
    padding-top: 0;
}
ul.eboothList a {
    position: relative;
    display: table-cell;
    height: 40px;
    padding: 10px 0;
    border: 1px solid #e0e0e0;
    text-align: center;
    vertical-align: middle;
}
ul.eboothList img {
    display: inline-block;
    max-width: 100%;
    height: 50px;
}
ul.eboothList .visited a {
    border-color: #c23d54;
}
ul.eboothList .visited a:before {
    position: absolute;
    right: 0;
    top: 0;
    padding: 1px 10px 4px;
    background-color: #c23d54;
    color: #fff;
    font-family: "NotoSansKR Regular", sans-serif;
    font-size: 10px;
    line-height: 16px;
    content: "방문완료";
}
div#eboothView {
    position: relative;
    padding: 54px 15px 15px;
}
div#eboothView div.close {
    position: absolute;
    right: 15px;
    top: 15px;
}
div#eboothView div.close > a {
    display: block;
}
div#eboothView div.close img {
    width: 24px;
}
div#eboothView h1 {
    padding: 10px 0;
}
div#eboothView h1 img {
    display: block;
    height: 45px;
    margin: 0 auto;
}
div#eboothView div.vodArea {
    height: 190px;
    background-color: #ccc;
}
div#eboothView ul.util {
    padding: 20px 0;
    margin: 0;
}
div#eboothView ul.util:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    font-size: 0;
    content: "";
}
div#eboothView ul.util li {
    margin: 10px 0 0;
    list-style: none;
}
div#eboothView ul.util li:first-child {
    margin-top: 0;
}
div#eboothView ul.util a {
    position: relative;
    display: block;
    height: 20px;
    padding: 9px 15px;
    text-decoration: none;
    color: #fff;
    background-color: #2d3456;
    font-size: 12px;
    line-height: 20px;
    font-family: "NotoSansKR Medium", sans-serif;
}
div#eboothView ul.util a:after {
    position: absolute;
    right: 15px;
    top: 50%;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    content: "";
    background: url("ebooth/btnBl_plus.png") center center no-repeat;
    background-size: 12px;
}
div.eboothCon {
    padding: 15px 0 20px;
    background-color: #f4f4f4;
    color: #000;
    font-size: 14px;
    line-height: 25px;
    font-family: "NotoSansKR Regular", sans-serif;
}
div.eboothCon p {
    height: 275px;
}
div.eboothCon > * {
    margin-top: 20px;
}
div.eboothCon > *:first-child {
    margin-top: 0;
}
div.eboothCon img {
    max-width: 100%;
}
div.boothVisit {
    position: relative;
    padding-top: 1px;
    margin: 0;
    background-color: #fff;
    box-shadow: 0 0 25px rgba(152, 161, 190, 0.5);
    box-sizing: border-box;
    font-family: "Roboto-Regular", "NotoSansKR Regular", sans-serif;
}
div.boothVisit div.stamp {
    position: relative;
    width: 105px;
    height: 105px;
    margin: 20px auto;
    background: url("ebooth/stampBg.png") center 0 no-repeat;
    background-size: 105px;
}
div.boothVisit div.stamp span {
    display: table-cell;
    width: 105px;
    height: 105px;
    vertical-align: middle;
    text-align: center;
}
div.boothVisit div.stamp img {
    display: inline-block;
    max-width: 60px;
    margin: 0 auto;
}
div.boothVisit div.btn {
}
div.boothVisit div.btn a {
    display: block;
    padding: 0;
    border: 0 none;
    line-height: 50px;
    text-align: center;
    font-size: 15px;
    background-color: #b12754;
    color: #fff;
}
div.boothVisit div.stamp.visited {
    padding-bottom: 20px;
}
div.boothVisit div.stamp.visited:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    border-radius: 50%;
    background-color: rgba(177, 39, 84, 0.75);
    content: "Visited";
    text-align: center;
    line-height: 105px;
    color: #fff;
    font-size: 16px;
    font-family: "Roboto-Medium", "NotoSansKR Medium", sans-serif;
}
div.boothVisit div.stamp.visited + div.btn {
    display: none;
}
/* My Page */
div.mypage {
    position: relative;
    font-family: "NotoSansKR Regular", sans-serif;
}
div.mypage ul.subMenu {
    margin: 0 15px 15px;
}
div.mypage ul.subMenu span {
    display: block;
}
div.mypage ul.subMenu.typeA {
    border-top: none;
    border-bottom: 1px solid #3c60b9;
}
div.mypage ul.subMenu.typeA li {
    width: 98px;
    margin-left: -1px;
}
div.mypage ul.subMenu.typeA li:first-child {
    margin-left: 0;
}
div.mypage ul.subMenu.typeA li a {
    margin-bottom: -1px;
    padding: 8px 0;
    border-bottom: none;
    border-top: 1px solid #a8a8a8;
    border-left: 1px solid #a8a8a8;
    font-size: 13px;
}
div.mypage ul.subMenu.typeA li:last-child a {
    border-left: 1px solid #238583;
}
div.mypage ul.subMenu.typeA .on a {
    border-top: 3px solid #3c60b9;
    border-bottom: none;
    border-left: 1px solid #3c60b9;
    border-right: 1px solid #3c60b9;
    background-color: #fff;
    color: #3c60b9;
}
div.mypage div.note {
    margin: 0 15px 15px;
    font-size: 15px;
    line-height: 25px;
    color: #d82900;
    font-family: "NotoSansKR Regular", sans-serif;
}
div.mypage ul.subMenu + p {
    margin-bottom: 15px;
    text-align: center;
    color: #252361;
    font-family: "NotoSansKR Bold", sans-serif;
    font-size: 19px;
}
div.mypage {
    padding: 0 0 65px;
}
div.mypage ul.conMenu {
    margin: 15px;
    text-align: left;
    border-bottom: 1px solid #3c60b9;
    border-top: 0 none;
}
div.mypage ul.conMenu li {
    margin: 0;
    padding: 0;
}
div.mypage ul.conMenu a {
    height: 33px;
    padding: 0 25px;
    margin-bottom: -1px;
    color: #adadad;
    border: 1px solid #adadad;
    border-left: 0 none;
    border-bottom: 1px solid #3c60b9;
    box-sizing: border-box;
    font-size: 13px;
    line-height: 30px;
}
div.mypage ul.conMenu li:first-child a {
    border-left: 1px solid #adadad;
}
div.mypage ul.conMenu li.on a {
    background-color: #fff;
    color: #3c60b9;
    border-top: 3px solid #3c60b9;
    border-left: 1px solid #3c60b9;
    box-shadow: none;
    border-bottom: 0 none;
    border-right: 1px solid #3c60b9;
    line-height: 26px;
}
div.mypage table.tblDef {
    width: calc(100% - 30px);
    margin: 0 15px;
}
div.mypage table.tblDef tr:last-child th {
    background-color: #f5f5f5;
}
div.mypage h4 {
    margin: 20px 15px 15px;
}
div.mypageNote {
    margin: 0 15px 15px;
    padding: 15px;
    font-size: 15px;
    line-height: 20px;
    font-family: "NotoSansKR Regular", sans-serif;
    color: #333;
    background-color: #fdf3e7;
}
div.mypageNote.bg {
    padding: 20px;
    background-color: #f3f6fb;
}
div.mypageNote dl {
    overflow: hidden;
    margin: 0;
    padding-bottom: 10px;
    line-height: 28px;
    border-bottom: 1px solid #d3d3d3;
}
div.mypageNote dt {
    font-size: 15px;
    color: #b9113c;
}
div.mypageNote dt span {
    display: block;
    font-size: 15px;
    font-family: "NotoSansKR bold", sans-serif;
}
div.mypageNote dd {
    position: relative;
    margin: 5px 0 0;
    font-family: "NotoSansKR DemiLight", sans-serif;
    font-size: 15px;
    color: #3c60b9;
    line-height: 20px;
}
div.mypageNote dd span {
    position: absolute;
    top: 0;
    left: 0;
    padding-left: 6px;
    font-family: "NotoSansKR Medium", sans-serif;
}
div.mypageNote dd span::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background-color: #5984c3;
}
div.mypageNote + div.formArea {
    margin-top: 15px;
}
.pointTit {
    margin: 15px;
}
.pointTit span {
    padding: 0 5px;
    color: #256ccc;
    font-size: 15px;
    font-family: "NotoSansKR Bold", sans-serif;
    box-shadow: inset 0 -10px 0 0 #e9f0fa;
}
div.mypage ul.tabMenu {
    margin: 0 15px;
}
div.mypageNote ul {
    padding-top: 10px;
    margin: 0;
}
div.mypageNote li {
    position: relative;
    margin-top: 5px;
    padding-left: 6px;
    font-size: 12px;
    line-height: 15px;
    color: #656565;
    list-style: none;
    font-family: "NotoSansKR Regular", sans-serif;
}
div.mypageNote li:first-child {
    margin-top: 0;
}
div.mypageNote li:before {
    content: "";
    position: absolute;
    top: 7px;
    left: 0;
    width: 2px;
    height: 2px;
    border-radius: 50%;
    background-color: #656565;
}
h5.process_bx {
    margin: 15px;
    height: 35px;
    text-align: center;
    line-height: 35px;
    font-size: 14px;
    color: #fff;
    background-color: #50667a;
}
div.mypage th.enter {
    background-color: #e6e6e6;
    color: #111;
    font-size: 16px;
    font-family: "NotoSansKR Medium", sans-serif;
}
div.mypage td {
    font-size: 0.9em;
}
div.mypage dl.note,
div.mypage dl.note dt,
div.mypage dl.note dd {
    margin: 0;
    padding: 0;
}
div.mypage dl.note {
    margin: 0;
    padding: 15px;
    background-color: #f0f8fd;
    color: #0066b3;
    font-size: 15px;
    text-align: center;
    font-family: "NotoSansKR Regular", sans-serif;
}
div.mypage dl.note dt {
    font-size: 18px;
    font-family: "NotoSansKR Medium", sans-serif;
}
div.mypage div.formArea h3 {
    font-size: 16px;
    line-height: 20px;
    text-align: left;
}
dl.quiz,
dl.quiz dt,
dl.quiz dd {
    margin: 0;
    padding: 0;
}
dl.quiz {
    padding: 0 15px;
}
dl.quiz > dt {
    padding: 15px 0 5px;
    color: #111;
    font-size: 15px;
    line-height: 20px;
    font-family: "NotoSansKR Medium", sans-serif;
}
dl.quiz > dt:first-child {
    padding-top: 0;
}
dl.quiz > dt p {
    display: inline;
    margin: 0;
}
dl.quiz > dt p + p {
    display: block;
}
dl.quiz > dd {
    padding: 15px;
    background-color: #f7f7f7;
}
.multi {
}
.multi:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    font-size: 0;
    content: "";
}
.multi input,
.multi label,
.multi span {
    float: left;
}
.multi input[type="radio"],
.multi input[type="checkbox"] {
    display: inline-block;
    vertical-align: top;
    margin: 3px 5px 0 25px;
}
.multi input:first-child {
    margin-left: 0;
}
.multi span {
    margin-left: 5px;
}
div.mypage div.formArea .btn {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}
div.mypage div.formArea .btn * {
    display: block;
    width: 100%;
    height: 55px;
    font-size: 16px;
    background-color: #242b37;
    border-color: #242b37;
    color: #fff;
}
dl.career,
dl.career dt,
dl.career dd,
dl.career ul,
dl.career li {
    margin: 0;
    padding: 0;
    list-style: none;
}
dl.career {
    margin: 0 15px;
    padding: 0 15px 15px;
    background-color: #f7f7f7;
    font-family: "NotoSansKR Medium", sans-serif;
}
dl.career > dt {
    color: #111;
    font-size: 16px;
    padding: 15px 0 10px;
}
dl.career ul {
    overflow: hidden;
}
dl.career li {
    float: left;
    padding: 5px 0 0 15px;
    font-family: "NotoSansKR Regular", sans-serif;
    font-size: 15px;
}
dl.career .multi input[type="checkbox"] {
    margin: 3px 5px 0 10px;
}
dl.career .multi input[type="checkbox"]:first-child {
    margin-left: 0;
}
dl.career .multi:last-child input[type="checkbox"]:nth-of-type(3n + 1) {
    margin-left: 0;
}
dl.career input[type="text"] {
    margin: 10px 0 0 15px;
    height: 30px;
}
dl.career input[type="text"] + span {
    margin-left: 10px;
    line-height: 30px;
}
dl.survey,
dl.survey dt,
dl.survey dd {
    margin: 0;
    padding: 0;
}
dl.survey {
    padding: 25px 15px 0;
}
dl.survey > dt {
    overflow: hidden;
    position: relative;
    display: table-cell;
    width: 2000px;
    height: 45px;
    padding: 0 20px 0 80px;
    color: #222;
    font-size: 13px;
    line-height: 1.3;
    background-color: #edeff2;
    border-radius: 25px;
    font-family: "NotoSansKR Medium", sans-serif;
    vertical-align: middle;
}
dl.survey > dt:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 72px;
    height: 100%;
    border-radius: 25px;
    content: "";
    background-color: #404752;
}
dl.survey > dt span {
    position: absolute;
    left: 0;
    top: 50%;
    width: 72px;
    height: 36px;
    margin-top: -15px;
    color: #fff;
    font-size: 17px;
    line-height: 30px;
    font-family: "Roboto-Medium", sans-serif;
    text-align: center;
}
dl.survey > dd {
    padding-top: 20px;
}
div.mypage div.formArea h3 + div {
    padding: 0 15px;
}
ul.survey,
ul.survey li {
    margin: 0;
    padding: 0;
    list-style: none;
}
ul.survey {
    text-align: center;
    font-size: 0;
    line-height: 0;
}
ul.survey li {
    display: inline-block;
    width: 20%;
    vertical-align: top;
}
ul.survey li:first-child {
    padding-left: 0;
}
ul.survey span.input {
    overflow: hidden;
    position: relative;
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin: 0 auto 10px;
    background: #e1e4e9 url("mobile/check.png") center center no-repeat;
    background-size: 23px;
}
ul.survey span.input input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    margin: 0;
}
ul.survey span.input.on {
    background-color: #404752;
    background-image: url("mobile/check_on.png");
}
ul.survey label {
    display: block;
    color: #1b1b1b;
    font-size: 14px;
    line-height: 20px;
    font-family: "NotoSansKR Regular", sans-serif;
}
ul.stamp,
ul.stamp li {
    margin: 0;
    padding: 0;
    list-style: none;
}
ul.stamp {
    width: 210px;
    margin: 0 auto;
}
ul.stamp:after {
    clear: both;
    display: block;
    height: 0;
    line-height: 0;
    font-size: 0;
    content: "";
}
ul.stamp > li {
    overflow: hidden;
    position: relative;
    float: left;
    width: 60px;
    height: 60px;
    margin: 10px 0 10px 15px !important;
    border-radius: 30px;
    background: url("mobile/stamp_bg.png") center center no-repeat;
    background-size: 60px;
}
ul.stamp > li:nth-child(3n + 1) {
    clear: both;
    margin-left: 0 !important;
}
ul.stamp span {
    display: table-cell;
    width: 60px;
    height: 60px;
    vertical-align: middle;
    text-align: center;
}
ul.stamp img {
    width: 70%;
    display: inline-block;
}
ul.stamp .visit:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(155, 12, 63, 0.75);
    content: "참여완료";
    text-align: center;
    line-height: 60px;
    color: #fff;
    font-size: 12px;
    font-family: "NotoSansKR Medium", sans-serif;
}
div.mypage div.bx-wrapper {
    position: relative;
    padding-top: 20px;
    margin: 0 auto;
}
div.mypage a.bx-prev,
div.mypage a.bx-next {
    position: absolute;
    top: 50%;
    width: 22px;
    height: 41px;
    margin-top: -10px;
    text-indent: -10000px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 22px;
}
div.mypage a.bx-prev {
    left: -50px;
    background-image: url("mobile/stamp_prev.png");
}
div.mypage a.bx-next {
    right: -50px;
    background-image: url("mobile/stamp_next.png");
}
div.mypage div.bx-pager {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    text-align: center;
}
div.mypage div.bx-pager > * {
    display: inline-block;
    vertical-align: top;
    margin-left: 10px;
}
div.mypage div.bx-pager > *:first-child {
    margin-left: 0;
}
div.mypage div.bx-pager a {
    display: block;
    width: 10px;
    height: 10px;
    line-height: 10px;
    border-radius: 5px;
    text-indent: -10000px;
    text-decoration: none;
    background-color: #ccc;
}
div.mypage div.bx-pager a.active {
    width: 30px;
    background-color: #4757a5;
}
div.mypage div.close {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}
div.mypage div.close > a {
    display: block;
    width: 100%;
    height: 55px;
    line-height: 53px;
    font-size: 18px;
    padding: 0;
    font-family: "NotoSansKR Medium", sans-serif;
    text-align: center;
    box-sizing: border-box;
    background-color: #b82430;
    border-color: #b82430;
    color: #fff;
}
/* 강의평가 */
ul.surveyList,
ul.surveyList li,
ul.surveyList a {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
ul.surveyList {
    border-top: 2px solid #000;
}
ul.surveyList > li {
    position: relative;
    border-bottom: 1px solid #e7e7e7;
    padding: 10px 90px 10px 10px;
    color: #333;
    font-size: 15px;
    font-family: "NotoSansKR Regular", sans-serif;
}
ul.surveyList > li:nth-child(even) {
    background-color: #f0f1f2;
}
ul.surveyList span {
    display: block;
}
ul.surveyList span.tit {
    font-size: 16px;
    font-family: "NotoSansKR Bold", sans-serif;
}
ul.surveyList a {
    position: absolute;
    right: 10px;
    top: 50%;
    width: 70px;
    padding: 5px 0 4px;
    margin-top: -14px;
    border-radius: 4px;
    font-size: 14px;
    background-color: #273b80;
    color: #fff;
    text-align: center;
}
.flicker {
    display: inline-block;
    animation-duration: 1s;
    animation-name: flicker;
    animation-iteration-count: infinite;
}
@keyframes flicker {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
/*  서브 페이지 */
div.webinar {
    box-sizing: border-box;
    background-color: #fff;
    color: #222;
    font-size: 14px;
    line-height: 1.4;
    font-family: "NotoSansKR Regular", sans-serif;
}
div.titArea {
    position: relative;
    padding: 0 55px 0 0;
    background-color: #5984c3;
}
div.titArea h1 {
    position: relative;
    height: 55px;
    margin: 0;
    padding: 0;
    font-size: 0;
    line-height: 0;
    background: url("mobile/header_logo.png") 15px center no-repeat #3c60b9;
    background-size: auto 16px;
}
div.titArea p.viewMenu {
    position: absolute;
    right: 0;
    top: 0;
    width: 55px;
    height: 55px;
    background: #3b3b3b url("mobile/viewMenu.png") center center no-repeat;
    background-size: 26px;
}
div.titArea p.viewMenu a {
    display: block;
    height: 55px;
    font-size: 0;
    line-height: 0;
}
div.webinar h3 {
    padding: 15px;
    color: #333;
    font-size: 25px;
    line-height: 40px;
    font-weight: normal;
    font-family: "NotoSansKR Medium", sans-serif;
    text-align: center;
}
div.contents {
    padding-bottom: 15px;
}
div.gnbWrap {
    z-index: 100;
    position: fixed;
    right: 100%;
    top: 0;
    width: 100%;
    min-width: 320px;
    height: 100%;
    padding-left: 70px;
    background-color: rgba(0, 0, 0, 0.7);
    box-sizing: border-box;
}
div.gnbWrap div.gnbGoto_01 {
    position: absolute;
    left: 70px;
    bottom: 55px;
    width: calc(100% - 70px);
    height: 55px;
    font-size: 0;
}
div.gnbWrap div.gnbGoto_01 a {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    text-align: center;
    color: #fff;
    background-color: #3d82ae;
    font-size: 17px;
    line-height: 55px;
    font-family: "Roboto-Bold", "NotoSansKR Bold", sans-serif;
    text-decoration: none;
}
/* div.gnbWrap div.gnbGoto_01 a:first-child {background-color: #45afe1;} */
div.gnbWrap div.close {
    position: absolute;
    left: 0;
    top: 0;
    width: 70px;
    height: 70px;
}
div.gnbWrap div.close a,
div.gnbWrap div.close img {
    display: block;
}
div.gnbWrap div.gnbGoto {
    position: absolute;
    left: 70px;
    bottom: 0;
    width: calc(100% - 70px);
    height: 55px;
    font-size: 0;
}
div.gnbWrap div.gnbGoto a {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    text-align: center;
    color: #fff;
    background-color: #4183c1;
    font-size: 17px;
    line-height: 55px;
    font-family: "Roboto-Bold", "NotoSansKR Bold", sans-serif;
    text-decoration: none;
}
.pro div.gnbWrap div.gnbGoto a {
	background-color: #d76138;
}
/* div.gnbWrap div.gnbGoto a:first-child {background-color: #45afe1;} */
div.gnbWrap div.close {
    position: absolute;
    left: 0;
    top: 0;
    width: 70px;
    height: 70px;
}
div.gnbWrap div.close a,
div.gnbWrap div.close img {
    display: block;
}
ul#gnb {
    height: 100%;
    background-color: #fff;
}
ul#gnb li {
    margin: 0;
    border-bottom: 1px solid #ccc;
    list-style: none;
}
ul#gnb a {
    position: relative;
    display: block;
    padding: 16px 20px 16px 67px;
    color: #000;
    font-size: 16px;
    line-height: 23px;
    font-family: "NotoSansKR Bold", sans-serif;
    word-break: keep-all;
    text-decoration: none;
    background-repeat: no-repeat;
    background-position: 20px center;
    -webkit-background-size: auto 29px;
    background-size: auto 29px;
}
ul#gnb a img {
    position: absolute;
    left: 25px;
    top: 50%;
    height: 29px;
    transform: translateY(-50%);
}
ul#gnb li:nth-child(1) a {
    background-image: url("/asset/mobile/gnb_01.png");
}
ul#gnb li:nth-child(2) a {
    background-image: url("/asset/mobile/gnb_02.png");
}
ul#gnb li:nth-child(3) a {
    background-image: url("/asset/mobile/gnb_03.png");
}
ul#gnb li:nth-child(4) a {
    background-image: url("/asset/mobile/gnb_04.png");
}
ul#gnb li:nth-child(5) a {
    background-image: url("/asset/mobile/gnb_05.png");
}

/* 심화 */
.pro ul#gnb li:nth-child(1) a {
    background-image: url("/asset/mobile/gnb_01_pro.png");
}
.pro ul#gnb li:nth-child(2) a {
    background-image: url("/asset/mobile/gnb_02_pro.png");
}
.pro ul#gnb li:nth-child(3) a {
    background-image: url("/asset/mobile/gnb_03_pro.png");
}
.pro ul#gnb li:nth-child(4) a {
    background-image: url("/asset/mobile/gnb_04_pro.png");
}
.pro ul#gnb li:nth-child(5) a {
    background-image: url("/asset/mobile/gnb_05_pro.png");
}
.gnb-bg {
	display: flex;
	justify-content: flex-end;
    padding: 18px 10px 14px;
    background: #c0dd9a url("mobile/gnb_bg.png") 0 0 no-repeat;
    background-size: 275px auto;
}
.gnb-bg img {
    height: 63px;
}
.pro .gnb-bg {
	background: #f8dba3 url("mobile/gnb_bg_pro.png") 0 0 no-repeat;
	background-size: 275px auto;
}

div.webinar .close {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
}
div.webinar .close a {
    display: block;
    width: 100%;
    line-height: 55px;
    height: 55px;
    padding: 0;
    font-size: 18px;
    font-family: "NotoSansKR Bold", sans-serif;
    text-align: center;
    box-sizing: border-box;
    text-decoration: none;
    color: #fff;
    background-color: #394e72;
}
div.mypage .process-tit {
    margin: 0 15px 15px;
    padding: 0;
    background-color: #425489;
    font-weight: normal;
    font-family: "NotoSansKR Medium", sans-serif;
    font-size: 14px;
    line-height: 40px;
    text-align: center;
    color: #fff;
}

.alert-info {
    margin: 10px 15px;
}
.alert-info strong {
    font-family: "NotoSansKR Medium", sans-serif;
    font-size: 18px;
    color: #111;
}
.alert-info span {
    color: #5e5e5e;
    font-size: 12px;
}
