@charset "UTF-8";
/* CSS Document */ 
/*bun contact*/
.story-sec-01 {margin-bottom: 100px; text-align: center; background:#fff; padding: 0;}
.story-sec-01 .story-cont-01 {padding: 0;} 
.story-sec-01 .story-cont-01 img {width: 100%;}
.story-sec-01  h5{text-align: center; font-family: 'db_heaventroundedbold','Kiwi Maru'; font-size: 20pt; line-height: 22pt; color: #50322e; padding: 0 30px;}
.story-sec-01 .story-cont-02 {text-align: center;}
.story-sec-01 .story-cont-02 h3 {padding: 30px 0 50px 0; margin: 0; color: #50322e; font-size: 42pt; font-family: 'db_heaventroundedbold','Kiwi Maru';  letter-spacing: 0.03em;} 
.story-sec-01 .story-cont-02 h3 img{width:auto; height: 35px; padding: 0 15px 0 0; margin: -12px 0 0 0;}  

.story-sec-01 .story-cont-03  {padding: 30px 50px;text-align: center;}
.story-sec-01 .story-cont-03 em {color: #ff5f07; font-size: 18pt; width: 100%; margin: 0; padding:0 5px; font-style: normal; 
font-weight: bold;} 
.story-sec-01 .story-cont-03 i {color: #50322e; font-size: 16pt; width: 100%; margin: 0; padding:0; font-style: normal; 
font-family: 'db_heaventroundedmed','Kiwi Maru'; }  
.story-sec-01 .story-cont-03 span {color: #50322e; font-size:14.5pt; line-height: 16.5pt;  padding: 15px 35px 10px 35px; letter-spacing: 0.02em; display: block;} 

 
/*time line*/

.story-sec-02 {padding: 100px 30px; text-align: center; color: #50322e;}
.story-sec-02 .title-sec-02 {padding:0 0 40px 0;}
.story-sec-02 .title-sec-02 h5{font-size: 22pt; color: #ff5f07; font-family: 'db_heaventroundedbold','Kiwi Maru';  padding: 0; margin-bottom: 0; letter-spacing: 0.02em; 
display: block;}
.story-sec-02 .title-sec-02 i{font-size: 16pt; font-style: normal; padding: 0; margin-bottom: 0; letter-spacing: 0.02em; display: block;}
.story-sec-02 .title-sec-02 img{width: 130px;}


.story-sec-02 {padding: 100px 30px 100px 30px; background: url("../images/tl-bg.png") top; background-repeat: no-repeat;
  background-size: cover; position: relative;}
.date-content .card {margin-left:auto;margin-right:auto;}
.story-sec-02 .card-img-top {padding: 10px 10px 0 10px;}
.story-sec-02 .card-text strong{color: #ff5f07;font-family: 'db_heaventroundedmed','Kiwi Maru';  font-size: 20pt; line-height: 22pt;}
.story-sec-02 .card-text span{font-size: 13pt; font-family: "db_heaventroundedregular",'Kiwi Maru';   line-height: 15pt;}


.story-sec-03 {padding: 80px 30px 50px 30px; background: url("../images/story-award-bg.jpg") no-repeat top center; background-size: cover;}
.story-sec-03 p{color: #ffffff;font-family: 'db_heaventroundedbold','Kiwi Maru';  font-size: 26pt; text-align: center;}
.story-sec-03 span{color: #ffffff; font-family: 'db_heaventroundedmed','Kiwi Maru';  font-size: 20pt; text-align: center; display: block; padding-bottom: 50px;}

.story-sec-03 .award-box {background: #ffffff; border-radius: 5px; padding:25px 50px 50px 50px; text-align: center;}
.story-sec-03 .award-box-img {padding: 0 20px;}
.story-sec-03 .award-box-img img{ width: 100%; height: 100%; border-radius: 50%; border: 1px solid #dedede;}
.story-sec-03 .award-year {font-size: 24pt; line-height: 26pt; color: #ff2d00;font-family: 'db_heaventroundedbold','Kiwi Maru'; padding-top: 5px;}
.story-sec-03 .award-box-det {padding: 0 25px; text-align: left;}
.story-sec-03 .award-name {font-size:18pt; line-height: 20pt; color: #ff5f07;font-family: 'db_heaventroundedmed','Kiwi Maru'; padding-top: 5px;}
.story-sec-03 .award-detail{font-size: 15pt; line-height: 17pt; color: #555555; padding-top: 5px;}

.story-sec-03 .carousel-indicators button{background-color: #7b7878;}
.story-sec-03 .carousel-indicators .active {  background-color: #ff2d00;}
.story-sec-03 span.carousel-control-prev-icon {
 background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%239a9da0'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e")
}
.story-sec-03 span.carousel-control-next-icon {
 background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%239a9da0'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")
}
.story-sec-03 .carousel-control-prev {width:10%;}
.story-sec-03 .carousel-control-next { width:10%;}


.story-sec-04 {padding: 100px 30px; text-align: center; color: #50322e;}
.story-sec-04 .title-sec-04 {padding:0 0 40px 0;}
.story-sec-04 .title-sec-04 h5{font-size: 22pt; color: #ff5f07; font-family: 'db_heaventroundedbold','Kiwi Maru';  padding: 0; margin-bottom: 0; 
letter-spacing: 0.02em; display: block;}
.story-sec-04 .title-sec-04 i{font-size: 16pt; font-style: normal; padding: 0; margin-bottom: 0; letter-spacing: 0.02em; display: block;}
.story-sec-04 .title-sec-04 img{width: 130px;}

.story-sec-04 .vision-ceo {padding: 30px;}
.story-sec-04 .vision-ceo p{font-size: 20pt; color: #111; font-family: 'db_heaventroundedbold','Kiwi Maru';  padding: 0; margin: 0;}
.story-sec-04 .vision-ceo span{font-size: 16pt; color: #f58220;  font-family: 'db_heaventroundedmed','Kiwi Maru'; text-transform:uppercase; padding: 0;}

.quote-ceo {padding: 0 30px; text-align: center;}
.quote-ceo img {width: 100%;}
.quote-ceo span{font-size: 14pt; line-height: 16pt; padding: 30px 20px; display: block;}


.story-sec-05 {padding: 100px 30px; background: #f7f7f7; text-align: center; color: #50322e;}
.story-sec-05 .title-sec-05 {padding:0 0 40px 0;}
.story-sec-05 .title-sec-05 h5{font-size: 22pt; color: #ff5f07; font-family: 'db_heaventroundedbold','Kiwi Maru';  padding: 0; margin-bottom: 0; letter-spacing: 0.02em;}
.story-sec-05 .title-sec-05 img{width: 130px;}

.story-sec-05  .content-sec-05{font-size: 14pt; line-height: 16pt;}
.story-sec-05  .content-sec-05 span {padding-top: 35px; display: block;}
.story-sec-05  .content-sec-05 p {font-size: 16pt; line-height: 18pt; font-family: 'db_heaventroundedbold','Kiwi Maru'; }

.story-sec-05  .img-sec-05 {text-align: center; padding: 40px 0 20px 0;}
.story-sec-05  .img-sec-05 img {height: 160px; width: auto;} 



@media (max-width: 992px) { 
/*bun story*/

	
.story-sec-01 .story-cont-03 {padding: 30px 20px; }
.story-sec-01 .story-cont-03 em { font-size: 13pt;} 
.story-sec-01 .story-cont-03 span { font-size: 12pt; line-height: 14pt; } 

	

.story-sec-05  .img-sec-05 img {height: 140px; width: auto; }
	
}


@media (max-width: 768px) { 
.story-sec-01 .story-cont-01 {padding: 0 100px; } 
.story-sec-01 .story-cont-01 img {width: 100%;}
	
.story-sec-01 .story-cont-03  {padding: 30px 20px; order: 2;}
.story-sec-01 .story-cont-03 em { font-size: 13pt;} 
.story-sec-01 .story-cont-03 span { font-size: 12pt; line-height: 14pt; } 

	
	
.story-sec-02 {padding: 100px 30px 100px 30px; background: url("../images/tl-bg-sm.png") top; background-repeat: no-repeat;
 background-size: cover; position: relative;}
	
.story-sec-03 {padding: 80px 20px 50px 20px;}	
.story-sec-03 .award-year {font-size: 22pt; line-height: 22pt; padding-top: 25px;}
.story-sec-03 .award-name { font-size: 17pt; line-height: 19pt; }
.story-sec-03 .award-box{text-align: center;}
.story-sec-03 .award-box img{ height: 200px; width: auto; padding-left:  0;}
.story-sec-03 .award-box-det {text-align: center;}
	
.story-sec-05  .content-sec-05 span {padding-top: 35px; font-size: 12pt; line-height: 14pt;}
.story-sec-05  .content-sec-05 p {font-size: 14pt; line-height: 16pt; font-family: 'db_heaventroundedbold','Kiwi Maru'; }
	
}

@media (max-width: 576px) { 
	
.story-sec-01 .story-cont-03  {padding: 30px 30px; } 
.story-sec-05  .img-sec-05 img {height: 100px; width: auto; }
}
 



/*timeline*/
 
.main-timeline {position: relative;}

.main-timeline:before { content: "";  display: block;   width: 2px;
    height: 100%;  background: #ff5f07;  margin: 0 auto;  position: absolute;
    top: 0;  left: 0; right: 0
}

.main-timeline .timeline {position: relative;} 
.main-timeline .timeline:after { content: ""; display: block; clear: both;} 
.main-timeline .icon {width: 14px; height: 14px; line-height: 14px; margin: auto; position: absolute; top: -15%; left: 0; bottom: 0; right: 0;}

.main-timeline .icon:before,
.main-timeline .icon:after {
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    transition: all 0.33s ease-out 0s
}

.main-timeline .icon:before {
    background: #ff5f07;
    border: 2px solid #ff5f07;
    left: 0;
}
 
 
.main-timeline .date-content {
    width: 50%;
    float: left;
    margin-top: 22px; 
    position: relative
}

.main-timeline .date-outer {
    width: 125px;
    height: 125px;
    font-size: 16px;
    text-align: center;
    margin: auto;
    z-index: 1
}

.main-timeline .date-outer:before,
.main-timeline .date-outer:after {
    content: "";
    width: 125px;
    height: 125px;
    margin: 0 auto;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    transition: all 0.33s ease-out 0s
}

.main-timeline .date-outer:before {
    background: #fff;
    border: 2px solid #232323;
    left: -6px
}

.main-timeline .date-outer:after {
    border: 2px solid #ff5f07;
    left: 6px
}

.main-timeline .timeline:hover .date-outer:before {
    left: 6px
}

.main-timeline .timeline:hover .date-outer:after {
    left: -6px
}

.main-timeline .date {
    width: 100%;
    margin: auto;
    position: absolute;
    top: 27%;
    left: 0
}


.main-timeline .timeline-content {width: 50%; float: right; text-align: center; padding: 50px 0;} 

.main-timeline .timeline-content img {height: auto; width: 60%; margin: 1% 15%;}

.main-timeline .title {
    font-size: 19px;
    font-weight: 700;
    line-height: 24px;
    margin: 0 0 15px 0
}

.main-timeline .description {
    margin-bottom: 0
}

.main-timeline .timeline:nth-child(2n) .date-content {
    float: right
}

.main-timeline .timeline:nth-child(2n) .date-content:before {
    left: 10px
}

.main-timeline .timeline:nth-child(2n) .timeline-content {
    text-align: right
}
@media (max-width: 1400px) { 
.main-timeline .timeline-content img {height: auto; width: 70%; margin: 1% 15%;}
}


@media (max-width: 1200px) { 
.main-timeline .timeline-content img {height: auto; width: 75%; margin: 2% 15%; }
}

@media (max-width: 991px) { 
.main-timeline .timeline-content img {height: auto; width: 75%; margin: 15% 15%;}
	
.main-timeline .icon {top: 0;}
    .main-timeline .date-content {
        margin-top: 35px
    }
    .main-timeline .date-content:before {
        width: 22.5%
    }
    .main-timeline .timeline-content {
        padding: 10px 0 10px 30px
    }
    .main-timeline .title {
        font-size: 17px
    }
    .main-timeline .timeline:nth-child(2n) .timeline-content {
        padding: 10px 30px 10px 0
    }
}
 
@media (max-width: 767px) {
.main-timeline .timeline-content {width: 50%; float: right; text-align: center; padding: 0; } 
.main-timeline .timeline-content img {height: auto; width: 45%; margin: 3% auto; }
	
.main-timeline .icon {top: -40%; } 
	
    .main-timeline:before {
        margin: 0;
        left: 7px
    }
    .main-timeline .timeline {
        margin-bottom: 20px
    }
    .main-timeline .timeline:last-child {
        margin-bottom: 0
    }
    .main-timeline .icon {
        margin: auto 0
    }
    .main-timeline .date-content {
        width: 95%;
        float: right;
        margin-top: 0
    }
    .main-timeline .date-content:before {
        display: none
    }
    .main-timeline .date-outer {
        width: 110px;
        height: 110px
    }
    .main-timeline .date-outer:before,
    .main-timeline .date-outer:after {
        width: 110px;
        height: 110px
    }
    .main-timeline .date {
        top: 30%
    }
    .main-timeline .year {
        font-size: 24px
    }
    .main-timeline .timeline-content,
    .main-timeline .timeline:nth-child(2n) .timeline-content {
        width: 95%;
        text-align: center;
        padding: 10px 0
    }
    .main-timeline .title {
        margin-bottom: 10px
    }
}
@media (max-width: 576px) {
}