@import 'timeline2.css';
@import 'timeline1.css';
#content-wrapper {
    width: 100%;
}
#rse-back {
    background-image: url("/image/image_gallery?img_id=15105");
}
.box-infograp {
    width: 90%;
    margin: 0 auto;
}
.portfolio-box-6 {
    border: 0.1em solid #585858;
    margin: 10px;
    padding: 5px;
    height: 235px;
}
.portfolio-box-6 .portfolio-title {
    color: #fff;
    height: 50px;
    font-size: 1.8em;
    margin: 20px 5px 5px 5px;
}
.portfolio-box-6 .portfolio-desc {
    color: #dedede;
    margin: 20px 10px 10px 10px;
    text-align: center;
    font-size: 1em;
}
@media only screen and (max-width : 32em) {
.portfolio-box-6 {
    height: 110px;
}
.portfolio-box-6 br {
    display: none;
}
.portfolio-box-6 .icon {
    float: left;
    height: 110px;
    margin: 0px 10px 0px 0px;
}
.portfolio-box-6 .portfolio-title {
    height: auto;
    margin: 5px;
    text-align: left;
    font-size: 1.5em;
}
.portfolio-box-6 .portfolio-desc {
    margin: 10px 5px 5px;
    text-align: left;
}
}
.boxInfographic {
    width: 98%;
    margin: 0 auto;
    padding: 20px 0;
}
.portfolio-box-7 {
    border: 0.1em solid #ededed;
    margin: 10px;
    height: 245px;
}
.boxcolor1 .icon img {
    width: 90px;
}
.boxcolor2 .icon img {
    width: 75px;
}
.boxcolor3 .icon img {
    width: 115px;
}
.portfolio-box-7 .portfolio-desc strong {
    color: #007b00;
    font-size: 1.2em;
}
.portfolio-box-7 .portfolio-desc {
    font-size: 0.9em;
    margin: 0.6em 0.3em;
}
@media only screen and (max-width : 60em) {
.boxcolor3 .icon img {
    width: 100px;
}
}
@media only screen and (max-width : 55em) {
.portfolio-box-7 {
    height: 250px;
}
.boxcolor2 .icon img {
    width: 60px;
}
}
@media only screen and (max-width : 48em) {
.portfolio-box-7 {
    height: auto;
}
.boxcolor1 .icon img, .boxcolor2 .icon img, .boxcolor3 .icon img {
    width: 80px;
}
}
#timeline .demo-card .head {
    position: relative;
    display: flex;
    align-items: center;
    color: #fff;
    font-weight: 400;
    padding: 10px;
    border-radius: 10px 10px 0 0;
}
#timeline .demo-card .head .number-box {
    display: inline;
    float: left;
    margin: 5px 5px 5px 10px;
    padding: 5px 2px;
    font-size: 2.2em;
    line-height: 35px;
    font-weight: 600;
    background: rgba(0, 0, 0, 0.17);
}
#timeline .demo-card .head h2 {
    text-transform: uppercase;
    font-size: 1.3rem;
    font-weight: inherit;
    letter-spacing: 2px;
    margin: 0;
    padding-bottom: 6px;
    line-height: 1rem;
}
#timeline .demo-card .head h2 span {
    font-size: 0.8rem;
    display: block;
    margin: 0;
}
#timeline .demo-card .body {
    padding: 10px;
    border: 2px solid #dfdfdf;
    border-radius: 0 0 10px 10px;
}
#timeline .demo-card .body p {
    margin: 1em 0;
    text-align: justify;
}
 #timeline .demo-card .body img {
  display: block;
  width: 100%;
}
 #timeline  .card--step1 .head, #timeline > li .card--step1::before, #timeline .card--step1 .number-box .entry-date::after,
 #timeline  .card--step11 .head, #timeline > li .card--step11::before,  #timeline  .card--step11 .number-box .entry-date::after,
 #timeline  .card--step21 .head, #timeline > li .card--step21::before,  #timeline  .card--step21 .number-box .entry-date::after,
 #timeline  .card--step31 .head, #timeline > li .card--step31::before,  #timeline  .card--step31 .number-box .entry-date::after  {
  background-color: #f80995;
}
 #timeline  .card--step1 .head, #timeline .card--step1 .body,
 #timeline  .card--step11 .head, #timeline .card--step11 .body,
 #timeline  .card--step21 .head, #timeline .card--step21 .body,
 #timeline  .card--step31 .head, #timeline .card--step31 .body {
  border-color: #f80995;
}
 #timeline  .card--step2 .head, #timeline > li .card--step2::before,  #timeline  .card--step2 .number-box .entry-date::after,
 #timeline  .card--step12 .head, #timeline > li .card--step12::before,  #timeline  .card--step12 .number-box .entry-date::after,
 #timeline  .card--step22 .head, #timeline > li .card--step22::before,  #timeline  .card--step22 .number-box .entry-date::after,
 #timeline  .card--step32 .head, #timeline > li .card--step32::before,  #timeline  .card--step32 .number-box .entry-date::after  {
  background-color: #ff2038;
}
 #timeline  .card--step2 .head, #timeline .card--step2 .body,
 #timeline  .card--step12 .head, #timeline .card--step12 .body,
 #timeline  .card--step22 .head, #timeline .card--step22 .body,
 #timeline  .card--step32 .head, #timeline .card--step32 .body {
  border-color: #ff2038;
}
 #timeline  .card--step3 .head, #timeline > li .card--step3::before,  #timeline  .card--step3 .number-box .entry-date::after,
 #timeline  .card--step13 .head, #timeline > li .card--step13::before,  #timeline  .card--step13 .number-box .entry-date::after,
 #timeline  .card--step23 .head, #timeline > li .card--step23::before,  #timeline  .card--step23 .number-box .entry-date::after,
 #timeline  .card--step33 .head, #timeline > li .card--step33::before,  #timeline  .card--step33 .number-box .entry-date::after  {
  background-color: #fcd813;
}
 #timeline  .card--step3 .head, #timeline .card--step3 .body,
 #timeline  .card--step13 .head, #timeline .card--step13 .body,
 #timeline  .card--step23 .head, #timeline .card--step23 .body,
 #timeline  .card--step33 .head, #timeline .card--step33 .body {
  border-color: #fcd813;
}
 #timeline  .card--step4 .head, #timeline > li .card--step4::before,  #timeline  .card--step4 .number-box .entry-date::after,
 #timeline  .card--step14 .head, #timeline > li .card--step14::before,  #timeline  .card--step14 .number-box .entry-date::after,
 #timeline  .card--step24 .head, #timeline > li .card--step24::before,  #timeline  .card--step24 .number-box .entry-date::after,
 #timeline  .card--step34 .head, #timeline > li .card--step34::before,  #timeline  .card--step34 .number-box .entry-date::after  {
  background-color: #00b656;
}
 #timeline  .card--step4 .head, #timeline .card--step4 .body,
 #timeline  .card--step14 .head, #timeline .card--step14 .body,
 #timeline  .card--step24 .head, #timeline .card--step24 .body,
 #timeline  .card--step34 .head, #timeline .card--step34 .body {
  border-color: #00b656;
}
 #timeline  .card--step5 .head, #timeline > li .card--step5::before,  #timeline  .card--step5 .number-box .entry-date::after,
 #timeline  .card--step15 .head, #timeline > li .card--step15::before,  #timeline  .card--step15 .number-box .entry-date::after,
 #timeline  .card--step25 .head, #timeline > li .card--step25::before,  #timeline  .card--step25 .number-box .entry-date::after,
 #timeline  .card--step35 .head, #timeline > li .card--step35::before,  #timeline  .card--step35 .number-box .entry-date::after  {
  background-color: #4d92eb;
}
 #timeline  .card--step5 .head, #timeline .card--step5 .body,
 #timeline  .card--step15 .head, #timeline .card--step15 .body,
 #timeline  .card--step25 .head, #timeline .card--step25 .body,
 #timeline  .card--step35 .head, #timeline .card--step35 .body {
  border-color: #4d92eb;
}
 #timeline  .card--step6 .head, #timeline > li .card--step6::before,  #timeline  .card--step6 .number-box .entry-date::after,
 #timeline  .card--step16 .head, #timeline > li .card--step16::before,  #timeline  .card--step16 .number-box .entry-date::after,
 #timeline  .card--step26 .head, #timeline > li .card--step26::before,  #timeline  .card--step26 .number-box .entry-date::after,
 #timeline  .card--step36 .head, #timeline > li .card--step36::before,  #timeline  .card--step36 .number-box .entry-date::after  {
  background-color: #ffa246;
}
 #timeline  .card--step6 .head, #timeline .card--step6 .body,
 #timeline  .card--step16 .head, #timeline .card--step16 .body,
 #timeline  .card--step26 .head, #timeline .card--step26 .body,
 #timeline  .card--step36 .head, #timeline .card--step36 .body {
  border-color: #ffa246;
}
 #timeline  .card--step7 .head, #timeline > li .card--step7::before,  #timeline  .card--step7 .number-box .entry-date::after,
 #timeline  .card--step17 .head, #timeline > li .card--step17::before,  #timeline  .card--step17 .number-box .entry-date::after,
 #timeline  .card--step27 .head, #timeline > li .card--step27::before,  #timeline  .card--step27 .number-box .entry-date::after,
 #timeline  .card--step37 .head, #timeline > li .card--step37::before,  #timeline  .card--step37 .number-box .entry-date::after  {
  background-color: #abd25f;
}
 #timeline  .card--step7 .head, #timeline .card--step7 .body,
 #timeline  .card--step17 .head, #timeline .card--step17 .body,
 #timeline  .card--step27 .head, #timeline .card--step27 .body,
 #timeline  .card--step37 .head, #timeline .card--step37 .body {
  border-color: #abd25f;
}
 #timeline  .card--step8 .head, #timeline > li .card--step8::before,  #timeline  .card--step8 .number-box .entry-date::after,
 #timeline  .card--step18 .head, #timeline > li .card--step18::before,  #timeline  .card--step18 .number-box .entry-date::after,
 #timeline  .card--step28 .head, #timeline > li .card--step28::before,  #timeline  .card--step28 .number-box .entry-date::after,
 #timeline  .card--step38 .head, #timeline > li .card--step38::before,  #timeline  .card--step38 .number-box .entry-date::after  {
  background-color: #e05ee2;
}
 #timeline  .card--step8 .head, #timeline .card--step8 .body,
 #timeline  .card--step18 .head, #timeline .card--step18 .body,
 #timeline  .card--step28 .head, #timeline .card--step28 .body,
 #timeline  .card--step38 .head, #timeline .card--step38 .body {
  border-color: #e05ee2;
}
 #timeline  .card--step9 .head, #timeline > li .card--step9::before,  #timeline  .card--step9 .number-box .entry-date::after,
 #timeline  .card--step19 .head, #timeline > li .card--step19::before,  #timeline  .card--step19 .number-box .entry-date::after,
 #timeline  .card--step29 .head, #timeline > li .card--step29::before,  #timeline  .card--step29 .number-box .entry-date::after,
 #timeline  .card--step39 .head, #timeline > li .card--step39::before,  #timeline  .card--step39 .number-box .entry-date::after  {
  background-color: #3ee9d1;
}
 #timeline  .card--step9 .head, #timeline .card--step9 .body,
 #timeline  .card--step19 .head, #timeline .card--step19 .body,
 #timeline  .card--step29 .head, #timeline .card--step29 .body,
 #timeline  .card--step39 .head, #timeline .card--step39 .body {
  border-color: #3ee9d1;
}
 #timeline  .card--step10 .head, #timeline > li .card--step10::before,  #timeline  .card--step10 .number-box .entry-date::after,
 #timeline  .card--step20 .head, #timeline > li .card--step20::before,  #timeline  .card--step20 .number-box .entry-date::after,
 #timeline  .card--step30 .head, #timeline > li .card--step30::before,  #timeline  .card--step30 .number-box .entry-date::after,
 #timeline  .card--step40 .head, #timeline > li .card--step40::before,  #timeline  .card--step40 .number-box .entry-date::after  {
  background-color: #46b8e9;
}
 #timeline  .card--step10 .head, #timeline .card--step10 .body,
 #timeline  .card--step20 .head, #timeline .card--step20 .body,
 #timeline  .card--step30 .head, #timeline .card--step30 .body,
 #timeline  .card--step40 .head, #timeline .card--step40 .body {
  border-color: #46b8e9;
}
@media screen and (max-width: 28em) {
#timeline .demo-card .head .number-box {
    font-size: 1.9em;
}
#timeline .demo-card .head {
    padding: 10px 0.1em;
}
#timeline .demo-card .head h2 {
    font-size: 1.2rem;
    letter-spacing: 0px;
    line-height: 1.3rem;
}
#timeline .demo-card .head h2 span {
    font-size: 0.7rem;
}
}