#timeline-header {
    position          : relative;
    width             : 100%;
    padding-top       : 5px;
}

#timeline-header-close-button {
	position          : absolute;
	font-size         : 16px;
	top               : 5px;
	right             : 5px;
}

#timeline-title {
    width             : 100%;
    text-align        : center;
    font-size         : 12px;
}

#timeline-title-text {
    color             : #000;
    font-size         : 18px;
    font-weight       : bold;
}

#timeline-title-mosa-name {
    width             : 100%;
    text-align        : center;
    font-size         : 12px;
    line-height       : 20px;
}

#timeline-description {
    margin            : 5px 10px;
    line-height       : 1.5em;
    font-size         : 120%;
}

#timeline-description-text {
    margin            : 10px;
    line-height       : 1.5em;
    font-size         : 120%;
}

.timeline-tool-button {
    position          : relative;
    /*margin-top        : 8px;*/
    margin-bottom     : 8px;
    box-sizing        : border-box;
    float             : left;
}

#timeline-tool-button.owner {
	width             : 50%;
}

#timeline-tool-button.user {
	width             : 50%;
}

.timeline-button-style {
	height            : 29px;
    margin            : 5px 5px;
    padding           : 6px 5px 6px 24px;
    line-height       : 29px;
    color             : #fff!important;
    border-radius     : 6px;
    cursor            : pointer;
    -webkit-transition: all 0.3s;
    -moz-transition   : all 0.3s;
    transition        : all 0.3s;
}

#timeline-create,
#timeline-reflesh,
#timelineTopic-create {
	width             : 126px;
    background-color  : rgba(255, 0, 51, 0.8);
    margin            : 5px auto;
    text-align        : center;
}

#timeline-create img,
#timelineTopic-create img {
	margin-left       : -14px;
}

#timeline-create2,
#timelineTopic-create2 {
	position          : relative;
	margin-left       : 6px;
	margin-bottom     : 10px;
	/*width             : 92%;*/
    background-color  : rgba(255, 0, 51, 0.8);
    text-align        : center;
}

#sendMessageToTimeline2 {
    width             : calc( 100% - ( 100% - 252px ) / 2 + 1% );
    background-color  : rgba(219, 15, 134, 0.8);
    margin            : 5px auto;
    text-align        : center;
}

#sendMessageToTimeline3 {
	width             : 80px;
    background-color  : rgba(219, 15, 134, 0.8);
    margin            : 5px auto;
    text-align        : center;
}

#timeline-show-side-panel-icon,
#timeline-user-search-side-panel-icon {
	width             : 126px;
    padding-right     : 10px;
    background-color  : rgba( 60, 179, 113, 0.8);
    margin            : 5px auto;
    text-align        : center;
}

#timeline-goToList {
	width             : 126px;
    background-color  : rgba(235, 132, 30, 0.8);
    margin            : 5px auto;
    text-align        : center;
}

#timeline-user-search-side-panel-icon,
.timeline-tool-button.user #timeline-goToList {
	width             : 126px;
}

#timeline-goToList2 {
	width             : 99px;
    background-color  : rgba(235, 132, 30, 0.8);
    margin            : 5px auto;
    text-align        : center;
}

#timeline-goToMenu {
	width             : 73px;
    background-color  : rgba(235, 132, 30, 0.8);
    margin            : 5px auto;
    text-align        : center;
}

.timeline-tool-button.user #timeline-goToList2,
.timeline-tool-button.user #timeline-goToMenu {
	width             : 90%;
}

@media all and (min-width:500px) {
	#timeline-tool-button.owner {
		width         : 33%;
	}
}

#timeline-show-timeline {
	width             : calc( 100% - 50px );
    background-color  : rgb(25 177 12 / 80%);
    margin-left       : 20px;
    text-align        : center;
}

#timeline-show-timeline-list {
	width             : calc( 100% - 50px );
    background-color  : rgba(0, 143, 226, 0.8);
    margin-left       : 20px;
    text-align        : center;
}

.timeline-button-style img {
    width             : 18px;
    height            : 18px;
    position          : absolute;
    top               : 16px;
    margin-left       : -26px;
}

#timeline-create2 img
{
    position          : absolute;
    top               : 11px;
    width             : 18px;
    height            : 18px;
    margin-left       : -20px;
}

.timeline-button-style label {
	font-size         : 120%;
	vertical-align    : text-bottom;
}

@media and (max-width:666px) {
}

/* ２カラムレイアウト */
@media all and (min-width:667px) and (max-width:1024px) {
}

/* １カラムレイアウト */
@media all and (min-width:1025px) and (max-width:1172px) {
}

/* ２カラムレイアウト */
@media all and (min-width:1173px) {

}