.article-container > article .section-container:after {
    content: ''; display: block; clear: both;
}
.article-container > article .section-container > section {
    float: left; width: 50%; margin-top: 0;
}
.article-container > article .section-container > .schedule {
    width: 30%;
}
.article-container > article .section-container > .lease-group {
    width: calc(30% - 22px); padding: 10px;
    border: 1px solid #eee;
}
.article-container > article .section-container > .schedule .table-response {
    margin-top: 13px;
}

.article-container > article .section-container > .lease-group .form-control {
    padding: 0 10px; margin: 10px 0; width: calc(100% - 20px);
    font-size: 15px;
}
.article-container > article .section-container > .lease-group select.form-control,
.article-container > article .section-container > .lease-group button[type="submit"] { width: 100%; }

.article-container > article .section-container > .video,
.article-container > article .section-container > .family-contact {
    width: 70%; margin-bottom: 15px;
}
.article-container > article .section-container > .video > h2,
.article-container > article .section-container > .family-contact > h2 {
    margin-left: 10px; position: relative;
}
.article-container > article .section-container > .video > h2 a,
.article-container > article .section-container > .family-contact > h2 a {
    position: absolute; top: -8px; right: 10px; cursor: pointer;
    display: block; width: 20px; height: 20px; padding: 10px;
    text-align: center; 
}
.article-container > article .section-container > .video > h2 a i,
.article-container > article .section-container > .family-contact > h2 a i { line-height: 20px; }

.article-container > article .section-container > .family-contact > .familyuserlist {
    padding: 10px;
}
.article-container > article .section-container > .family-contact > .familyuserlist ul li {
    margin: 5px 0; padding: 5px 0;
    border-bottom: 1px solid #eee;
}
.article-container > article .section-container > .family-contact > .familyuserlist ul li:first-child {
    margin: 0 0 5px; padding: 5px 0;
    border-top: 1px solid #eee;
}
.article-container > article .section-container > .family-contact > .familyuserlist ul li > b {}

@media screen and (max-width: 1100px) {
    .article-container > article .section-container > .schedule,
    .article-container > article .section-container > .video,
    .article-container > article .section-container > .family-contact { width: 100%; }
    .article-container > article .section-container > .lease-group { width: calc(100% - 22px); }

    .article-container > article .section-container > section {
        margin-top: 20px;
    }
    .article-container > article .section-container > section:nth-of-type(1) {
        margin-top: 0;
    }
}

#scheduleResultGroup .list-process { display: none; }

.main-container .container .page-title {
    font-size: 18px; font-weight: 100;
    margin: 20px 0; padding: 10px 0;
    border-bottom: 1px solid #ddd;
}

.main-container label {
    font-size: 18px; font-weight: 100;
    margin-top: 20px;
}

.main-container .container .favorite > a {
	border: 1px solid #eee; border-radius: 5px;
    display: inline-block; width: 100px; height: 50px;
    text-align: center; line-height: 50px;
}
.main-container .container .favorite > a:hover {
	color: #a00; font-weight: bold;
}

.kcw-list { display: none; }
.list-container ul li {
	margin: 5px 0; padding: 5px 0;
	border-bottom: 1px solid #eee;
}
.list-container ul li > span {
	display: inline-block; margin-right: 10px;
	text-align: center; padding: 0 5px;
}
.list-container ul li .type { width: 50px; text-align: left; }

.list-container ul li.active {
    background-color: #a00;
}
.list-container ul li.active span {
    font-weight: 600;
    color: #fff;
}

.article-container article .article-header .btn {
    position: relative; top: -7px;
}
.article-container table {
    width: 100%; border-collapse: collapse;
}
.article-container table tr td {
    text-align: center;
    padding: 10px;
    border: 1px solid #eee;
}
.article-container table tr td label[onclick] {
    cursor: pointer; display: block;
}
.article-container table tr td span {
    display: inline-block; width: 30px; height: 30px;
    line-height: 30px;
}
#scheduleResultGroup {
    margin-top: 20px; display: none;
}
#scheduleResultGroup ul li .todoResultTitleGroup:after {
    content: ''; display: block; clear: both;
}
#scheduleResultGroup ul li {
    padding: 15px 10px;
    margin-bottom: 15px;
    /*border-bottom: 1px solid #eee;*/
    background-color: #f9f9f9;
}
#scheduleResultGroup ul li .todoResultTitleGroup h2 {
    float: left;
}
#scheduleResultGroup ul li .todoResultTitleGroup .list-process {
    float: right;
}
#scheduleResultGroup ul li .todoResultTitleGroup .list-process > span {
    cursor: pointer; font-size: 13px;
    border: 1px solid #bbb; border-radius: 3px; padding: 5px 10px;
}
#scheduleResultGroup ul li .todoResultTitleGroup .list-process > span.update {
    margin-right: 10px;
}

#scheduleResultGroup ul li img {
    max-width: 100%;
}
#scheduleResultGroup .todoResultTitle {
    font-size: 16px;
}
#scheduleResultGroup .todoResultContent {
    /*
    border-top:     1px solid #eee;
    border-bottom:  1px solid #eee;
    */
    padding: 10px 0 0; margin-bottom: 10px;
}
#scheduleResultGroup .todoResultDate {
    /*text-align: right;*/
}
#scheduleResultGroup .todoResultDate > span {
    display: inline-block; width: 80px;
    margin-right: 5px;
}

#calendar tr td span {
    border-radius: 50%;
    -webkit-transition: all .4s ease-out;
    -moz-transition:    all .4s ease-out;
    -o-transition:      all .4s ease-out;
    transition:         all .4s ease-out;
}
#calendar tr td span.active {
    background-color: #a00 !important; color: #fff !important;
}

/* calendar modal */
#schedule-insert .modal-head { padding: 0 16px; }
#schedule-insert .modal-head > h2 {
    font-size: 18px; font-weight: 500;
    padding: 10px 0;
}
#schedule-insert .modal-head > h2:after {
    content: ''; display: block; clear: both;
}
#schedule-insert .modal-head > h2 > span {
    display: block;
    font-size: 18px; font-weight: 500;
}
#schedule-insert .modal-head > h2 > span:first-child { float: left; }
#schedule-insert .modal-head > h2 > span:last-child { float: right; }
#schedule-insert .modal-head > h2 > span.calendar-close-btn { cursor: pointer; }

#schedule-update .modal-head { padding: 0 16px; }
#schedule-update .modal-head > h2 {
    font-size: 18px; font-weight: 500;
    padding: 10px 0;
}
#schedule-update .modal-head > h2:after {
    content: ''; display: block; clear: both;
}
#schedule-update .modal-head > h2 > span {
    display: block;
    font-size: 18px; font-weight: 500;
}
#schedule-update .modal-head > h2 > span:first-child { float: left; }
#schedule-update .modal-head > h2 > span:last-child { float: right; }
#schedule-update .modal-head > h2 > span.calendar-close-btn { cursor: pointer; }

@media screen and (max-width: 410px) {
    .container {
        padding: 0;
    }
    .container > div {
        margin: 0;
    }
    .container > div > div {
        padding: 0;
    }
    .table-response {
        overflow-x: scroll;
    }
}