/*------------------------------------
            $PlayButton
------------------------------------*/
/*----- play video icon ------*/
.rl-play-wrapper2.sketchfab{
    top: 45%;
    left: 70%;
}

.exportbanner{
  background-image:url('../../image/export/Export_main.jpg');
  background-repeat:no-repeat;
  background-position:center;
  background-size: cover;
  height: calc(26.04vw);
}

.exportbanner .banner-text{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
}

.banner-block { padding-bottom:26.04%!important }
.banner-block .notetext {
    bottom: 1vw;
    position: absolute;
    color: white;
    padding-left: 20px;
    font-size: calc(8px + 0.6vw);
    font-weight: 300;
}

.exportbanner .banner-desc{
  font-size: 1.5vw !important;
}

.exportbanner .img-wrapper{
    margin-top: 25px;
}

.fbxblock .textarea {
    padding-left: 50px !important;
}

.fbxblock .videoarea {
    padding-right: 50px !important;
}

.sketchfabbtn {
    position:absolute;
    bottom:7%;
    right:0;
    height:6%;
    width:21%;
    pointer-events: all;
}

.img-wrapper-about img {
    margin-right: 1.2vw;
    margin-bottom: 45px;
    width: 6.3vw;
}

.flex-align {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.align-self-center{
    -webkit-align-self: center; /* Safari 7.0+ */
    align-self: center;
}

    /*----- 80px -----*/
    .rl-row-80{
        padding-top: calc( 32px + 2.5vw ); 
        padding-bottom: calc( 32px + 2.5vw );         
    }

    .rl-row-top-80{ 
        padding-top: calc( 32px + 2.5vw ); 
        padding-bottom: 0; 
    }

    .rl-row-bottom-80{
        padding-top: 0; 
        padding-bottom: calc( 32px + 2.5vw );         
    }

    /*----- 60px -----*/
    .rl-row-60{
        padding-top: calc( 24px + 1.875vw ); 
        padding-bottom: calc( 24px + 1.875vw );         
    }
    .rl-row-top-60{ 
        padding-top: calc( 24px + 1.875vw ); 
        padding-bottom: 0; 
    }
    .rl-row-bottom-60{
        padding-top: 0; 
        padding-bottom: calc( 24px + 1.875vw );         
    }

.color-lightgrey{
    color: #c8c8c8
}


.contentBanner-divide1{
    background-image: url('../../image/export/CG_main.jpg');
    background-repeat: no-repeat;
    background-position: right;
    background-size: cover;
}

.contentBanner-divide2{
    background-image: url('../../image/export/game_main.jpg');
    background-repeat: no-repeat;
    background-position: right;
    background-size: cover;
}
.contentBanner-divide3{
    background-image: url('../../image/export/sketchfab_main.jpg');
    background-repeat: no-repeat;
    background-position: right;
    background-size: cover;
}


.contentBanner-container .contentBanner-title{
    color: #fff;
    font-family: Oswald, sans-serif;
    font-size: 5.05vw;
    margin: 0;
}

    .contentBanner-line{
        border-left: 22px solid #84c10e;
        padding-left: calc(2.1875vw + 8px);
    }

    .contentBanner-space-120{
        padding-top: calc(3.125vw + 60px);
        padding-bottom: calc(3.125vw + 60px);
    }

    .contentBanner-bottom-120{
        padding-bottom: calc(3.125vw + 60px);
    }

.rl-style .export-banner-desc {
    color: #fff;
    font-size: 2vw;
    font-weight: 400;
    font-family: Open Sans, sans-serif;
    line-height: 1.3;
    margin-bottom: 0;
    white-space: pre;
}

.export-icon{
    margin-bottom:15px;  float:left; width: calc( (100% - 13px ) / 2 ); max-width: 270px
}

.cg-area3{
    text-align: right;
    margin-top: 15px
}
    .cg-area3-img{
        max-height: 38px;float: right;width: 180px; margin-right: 20px;
    }

    .cg-area3-img-mobile{
        display: none;
    }

@media screen and (max-width: 1199px) {
    .sketchfabbtn {
        bottom:16%;
        right:1%;
        height:6%;
        width:21%;
    }
}

@media screen and (max-width: 991px) {
    .img-wrapper-about img {
        width: 13vw;
        margin-right: 3vw;
    }
    .cg-area3{
        text-align: center;
    }
    .cg-area3-img-mobile{
        float: none;
        display: inline-block !important;
        margin-bottom: 10px;
    }
    .cg-area3-button{
        margin-bottom: 10px !important;
        display: inline-block;
        float: none !important;
    }
    .testimonial-img{
        margin: 0 auto;
    }
}

@media screen and (max-width: 768px) {
    .banner-block { padding-bottom:31.6% }
}
@media screen and (max-width: 767px) {
    .exportbanner{ background-image: url(../../image/export/Export_main1.jpg?170324); height: 89.7vw }
    .exportbanner .img-wrapper img{ width: 70%; }
    .exportbanner .banner-text{
      padding-top: 40% !important;
      top: 0;
    }

    .exportbanner .banner-title{ font-size: 9vw !important;}
    .exportbanner .banner-desc {
        font-size: 4vw !important;
    }
    .banner-block .notetext {
        bottom:calc(-8vw);
        font-size: calc(10px + 0.6vw);
        font-weight: 300;
    }
    .fbxblock .textarea {
        padding:15px!important;
        padding-top:25px !important;
    }

    .fbxblock .videoarea {
        padding:15px!important;
        padding-top:0px !important;
    }

    .contentBanner-divide1{
        background-image: url('../../image/export/CG_main_767.jpg');
        height: 80vw;
    }
    .contentBanner-divide2{
        background-image: url('../../image/export/game_main767.jpg');
        height: 80vw;
    }
    .contentBanner-divide3{
        background-image: url('../../image/export/sketchfab_main767.jpg');
        height: 80vw;
    }
        .contentBanner-divide1 .contentBanner-title{
            width: 65vw;
        }
        .contentBanner-divide3 .contentBanner-title{
            text-align: center
        }
    .contentBanner-line{
        border-left: none;
        padding-left: 0;
    }
    .contentBanner-container .contentBanner-title{
        font-size: 8.473vw;
    }
    .contentBanner-container .contentBanner-space-120{
        padding-top: 40px;
    }
    .contentBanner-divide3 .contentBanner-space-120{
        padding-top: 20vw;
    }

      .rl-style .export-banner-desc { font-size: 4vw; }
}

@media screen and (max-width: 620px) {
    .img-wrapper-about img {
        width: 22vw;
        margin-right: 5vw;
    }

    .export-icon{
        width: 100%;
        float: none;
        margin-left: auto;
        margin-right: auto;
        margin-right: auto !important;
    }
}