body{
  background-color:rgba(0,41,86,1);
}
.main-box{
  max-width:1553px;
}
.column-title-box{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  background-image:url( https://tkww-static.tkww.hk/special/Ai/column-bg.png );
  background-size:100% auto;
  background-position: center center;
  margin-top:55px;
  background-repeat:no-repeat;
}
.column-title-img{
  flex:none;
  width:71px;
}
.column-title-text{
  font-size: 35px;
  margin-left:9px;
  flex:none;
  font-weight:bold;
  color:#ffffff;
}
.column-title-box1{
  background-image:none;
}
.column-title-box1 .column-title-text{
  font-weight:normal;
}
.column-story-list,.great-box-inner{
  display:flex;
  align-items:flex-start;
  margin-top:30px;
  justify-content:space-between;
}
.story-unit{
  width:32%;
  padding-top:19px;
  padding-bottom:14px;
  position:relative;
  background-color: #0c4c93;
  border-radius: 50px;
  border: solid 2px #e4d0f9;
  box-sizing:border-box;
}
.story-unit-level{
  width:54px;
  position:absolute;
  left:-7px;
  top:-20px;
  z-index:99;
}
.story-unit-img{
  width:80%;
  margin-left:auto;
  margin-right:auto;
  height:calc( 1533px * 0.8 * 0.32 * 9 / 16 );
}
.imgBox-img,.imgBox-filter{
  transition:0.5s;
}
.story-unit-img:hover .imgBox-img, .story-unit-img:hover .imgBox-filter{
  transform: scale(1.05);
}
.story-unit-bottom{
  width:97%;
  margin-left:2%;
  margin-top:10px;
}
.story-unit-title{
  width:100%;
  display:flex;
  align-items:flex-start;
  font-size:19px;
  line-height:45px;
  color: #ffffff;
  padding-left:16px;
  padding-right:33px;
}
.story-unit-title-left{
  width:89px;
  text-align-last:justify;
  flex:none;
  text-align:justify;
  height:45px;
}
.story-unit-title-left::after {
    display: inline-block;
    content: '';
    width: 100%;
    height: 0;
    visibility: hidden;
}
.story-unit-title-center{
  flex:none;
}
.story-unit-title-right{
  flex:1;
}
.story-unit-blue-bg{
  background-color: #065ab6;
}
.story-unit-title:nth-child(4){
  height:unset;
  line-height:25px;
  margin-top:10px;
}
.story-unit-title:nth-child(4) .story-unit-title-right{
  color:#ffffff;
  font-weight: normal;
  transition:0.5s;
  line-height:25px;
  height:calc( 25px * 3 );
  font-size:19px;
}
.story-unit-title:nth-child(4) .story-unit-title-right:hover{
  color: #6ffbfd;
}
.great-box{
  background-color: #0b407b;
}
.great-box .story-unit{
  background-color: #0b407b;
  border:0;
  transition:0.5s;
  padding-top:33px;
  padding-bottom:24px;
  overflow:hidden;
  width:25%;
}
.great-box .story-unit-img{
  height:calc( 1533px * 9 / 16 * 0.25 * 0.8 );
}
.great-box .story-unit:hover{
  background-color: #195699;
}
.great-box .story-unit-bottom{
  margin-top:25px;
  width:86%;
  margin-left:auto;
  margin-right:auto;
}
.great-box-inner-line{
  position:absolute;
  right:0;
  top:0;
  transform:translateX(50%);
  width: 2px;
  height:100%;
  background-color: #408ce0;
  transition:0.5s;
}
.great-box .story-unit:last-child .great-box-inner-line,.great-box .story-unit:hover .great-box-inner-line{
  background-color:rgba(0,0,0,0);
}
.great-box .story-unit-title{
  padding-left:0;
  height:unset;
  line-height:36px;
  padding-right:0;
}
body .footer{
  background-color: #0b407b;
}
@media (max-width:1660px){
  .main-box{
    padding-left:4.5vw;
    padding-right:4.5vw;
  }
  .story-unit-img{
    height: calc(91vw * 0.8 * 0.32 * 9 / 16);
  }
  .great-box .story-unit-img{
    height: calc( 91vw * 9 / 16 * 0.25 * 0.8);
  }
}
@media (max-width:1099px){
  .column-title-box{
    background-image:none;
  }
}
@media (max-width:1099px) and (min-width:767px){
  .story-unit-title{
    flex-wrap:wrap;
    justify-content: center;
    line-height:25px;
    padding-top:5px;
    padding-bottom:5px;
  }
  .story-unit-title-right{
    flex:none;
    width:100%;
    text-align:center;
  }
  .story-unit-title-left{
    height:25px;
  }
  .story-unit-title:nth-child(4){
    padding-top:0px;
    padding-bottom:0px;
  }
  .story-unit-title:nth-child(4) .story-unit-title-right{
    margin-top: 5px;
    text-align:left;
  }
}
@media (max-width:767px){
  .main-box{
    padding-left:1.87vw;
    padding-right:1.87vw;
  }
  .column-title-box{
    margin-top:11vw;
  }
  .column-title-img{
    width:12vw;
  }
  .column-title-text{
    font-size: 7vw;
  }
  .column-story-list, .great-box-inner{
    display:block;
    margin-top:7vw;
  }
  .story-unit,.great-box .story-unit{
    width:100%;
    margin-top:7vw;
  }
  .great-box .story-unit{
      background-color: #195699;
  }
  .story-unit-img,.great-box .story-unit-img{
    height: calc((100vw - 1.87vw - 1.87vw) * 9 / 16 * 0.8);
  }
  .story-unit:first-of-type,.great-box .story-unit:first-of-type{
    margin-top:0;
  }
  .story-unit-level{
    width:11vw;
  }
  .great-box-inner-line{
    background-color:rgba(0,0,0,0);
  }
  .great-box{
    background-color:rgba(0,0,0,0);
  }
}