/*@container_width: 1625px;*/ .history-milestones-container .title { font-size: 20px; font-weight: bold; } .history-milestones-container .box-content { margin-bottom: 40px; } .history-milestones-container .milestone-item { display: block; *border-bottom: 1px solid #ccc; } @media only screen and (min-width: 992px) { .history-milestones-container .milestone-item { display: flex; } } .history-milestones-container .milestones-each-year .sub-each-year { display: flex; padding-left: 15px; } @media only screen and (min-width: 992px) { .history-milestones-container .milestones-each-year .sub-each-year { padding-left: 0; } } .history-milestones-container .year, .history-milestones-container .period, .history-milestones-container .detail { padding: 8px 10px; } .history-milestones-container .period { width: 56px; } .history-milestones-container .year { width: 75px; } .history-milestones-container .vertical-line { display: none; width: 10px; padding-top: 15px; } @media only screen and (min-width: 992px) { .history-milestones-container .vertical-line { display: block; } } .history-milestones-container .vertical-line .circle { width: 10px; border-radius: 5px; height: 10px; background: #fff; border: 1px solid #eb6338; } .history-milestones-container .vertical-line .circle.bottom { display: none; } .history-milestones-container .vertical-line .line { margin-left: 4px; width: 1px; background: #eb6338; height: 120%; } .history-milestones-container .corporate-milestone .milestone-item:last-child .vertical-line .circle.bottom, .history-milestones-container .product-milestone .milestone-item:last-child .vertical-line .circle.bottom { display: block; background: #eb6338; } .history-milestones-container .corporate-milestone .milestone-item:last-child .vertical-line .line, .history-milestones-container .product-milestone .milestone-item:last-child .vertical-line .line { height: calc(100% - 34px); } .history-milestones-container .last-line { background: #fff; width: 10px; height: 20px; }