@import'../../../common/css/style.scss';
@import'../../../common/css/common.scss';
.container {
    @extend .publicContainer;
}

.courseSum {
    @include screenWidthAndHeight;
}
.courseItem, courseItemChild {
    width: $screenWidth;
    height: 604px;
    justify-content:center;
    align-items: center;
}
.courseItem {
    height: 624px;
}
.listItemBtm {
    width: $screenWidth;
    height: 186px;
    justify-content: center;
    align-items: center;
}
.content {
    width: 368px;
    height: 614px;
    flex-direction: column;
    align-items: center;
}
.courseItemChild, .contentChild {
    height: 536px;
}
.courseNameBox {
    width: 328px;
    height: 42px;
}
.courseName {
    width: 328px;
    height: 42px;
    text-align: center;
    text-overflow: ellipsis;
}
.courseNameParent {
    margin-top: 54px;
}

.totalTime {
    width: 328px;
    height: 97px;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 30px;
}

.totalTimeTop {
    width: 328px;
    height: 42px;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.orangeTime {
    width: 32px;
    height: 32px;
}
.totalTimeBom {
    font-size: $maxTextFontSize;
    color: #EE5928;
}

.calorie {
    margin-top: 37px;
}

.calorieBom {
    width: 328px;
    height: 50px;
    text-align: left;
    align-items: center;
}

.calorieTxt {
    font-size: $maxTextFontSize;
    color: #FFBD60;
}

.calorieSubTxt {
    font-size: $subTextFontSize;
    color: #AAAAAA;
    margin-left: 10px;
}

.rate {
    color: $subTextColor;
}
.rateRangeBox {
    width: 328px;
    height: 47px;
    text-align: left;
}
.rateRange {
    font-size: $subTextFontSize;
    height: 44px;
    color: $apnsTextColor;
}
.line {
    margin-top: 15px;
}
.line, .dashLine {
    width: 368px;
    height: 2px;
    background-color: rgba(255,255,255,0.1);
}
.dashLine {
    background-color: rgba(255,255,255,0.3);
}
.dateBox {
    width: 328px;
    height: 68px;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.dateTxt {
    font-size: 20px;
    color: $apnsTextColor;
}
.finishBtn {
    width: 230px;
    height: 86px;
    font-size: $subTextFontSize;
    margin-top: 50px;
    margin-bottom: 50px;
    background-color: $greyButtonBackgroundColor;
}
.totalTimeTopTxt {
    font-size: $subTextFontSize;
    height: 44px;
}