/* --- RESPONSIVE CLICKCHANGE TABLET --- */

@media only screen and (min-width:1025px) and (max-width:1399px){

    .ceItem.clickChange.hasBgColor{padding:8% 5%!important}

}

@media only screen and (min-width:1025px) and (max-width:1250px){

    .clickChange.squareType .galWrap{width:50%!important}
    .clickChange.squareType .galWrap div.cccPic{width:150px}
    .clickChange.squareType .galWrap div.cccPic:nth-child(1){bottom:20%!important;left:-50px}
    .clickChange.squareType .galWrap div.cccPic:nth-child(2){bottom:20%!important;left:120px}
    .clickChange.squareType .galWrap div.cccPic:nth-child(3){bottom:20%!important;left:290px}

}


/* --- RESPONSIVE CCC --- */

@media only screen and (max-width:1024px){

    .cccSection:not(.isHero) .itemWrap > .textPic > .galWrap{display:none}
    .cccSection:not(.isHero) .cccWrap{position:relative}
    .cccSection:not(.isHero) .cccItem .cccImage{position:absolute;top:0}
    .cccSection:not(.isHero) .cccItem:nth-child(1) .cccImage{left:0}
    .cccSection:not(.isHero) .cccItem:nth-child(2) .cccImage{left:60px}
    .cccSection:not(.isHero) .cccItem:nth-child(3) .cccImage{left:120px}
    .cccSection:not(.isHero) .cccItem:nth-child(4) .cccImage{left:180px}
    .cccSection:not(.isHero) .cccItem:nth-child(5) .cccImage{left:240px}
    .cccSection:not(.isHero) .cccItem .cccImage picture{position:relative;top:unset!important;left:unset!important;width:50px!important;height:50px!important}
    .cccSection:not(.isHero) .cccItem .cccText{margin-top:70px;width:100%!important}
    .cccSection:not(.isHero) .cccItem .cccText .buttonWrap .btn{width:100%}
    .cccSection:not(.isHero) .cccItem .cccText .buttonWrap .btn *{text-align:center}

}


/* --- RESPONSIVE CLICKCHANGE --- */

@media only screen and (max-width:1024px){

    .extContent.clickChange .galWrap{display:flex!important;height:6rem!important;background-image:none!important}
    .extContent.clickChange .galWrap .cccPic.item-1{top:0!important;bottom:0!important;left:0!important;width:60px!important;height:60px!important}
    .extContent.clickChange .galWrap .cccPic.item-2{top:0!important;bottom:0!important;left:100px!important;width:60px!important;height:60px!important}
    .extContent.clickChange .galWrap .cccPic.item-3{top:0!important;bottom:0!important;left:200px!important;width:60px!important;height:60px!important}
    .extContent.clickChange .galWrap .cccPic.item-4{top:0!important;bottom:0!important;left:300px!important;width:60px!important;height:60px!important}
    .extContent.clickChange .galWrap .cccPic.item-5{top:0!important;bottom:0!important;left:400px!important;width:60px!important;height:60px!important}
    .extContent.clickChange .bodyWrap{display:flex}
    .extContent.clickChange .bodyWrap .galWrap{order:1;width:100%!important}
    .extContent.clickChange .bodyWrap .txtWrap{order:2;width:100%!important;height:auto}
    .extContent.clickChange.conRight .bodyWrap{display:flex}
    .extContent.clickChange.conRight .bodyWrap .galWrap{order:2;width:100%!important}
    .extContent.clickChange.conRight .bodyWrap .txtWrap{order:1;width:100%!important;height:auto}
    .extContent.clickChange.conRight .galWrap .cccPic.item-1{top:0!important;bottom:0!important;left:0!important;width:120px!important;height:120px!important}
    .extContent.clickChange.conRight .galWrap .cccPic.item-2{top:0!important;bottom:0!important;left:150px!important;width:120px!important;height:120px!important}
    .extContent.clickChange.conRight .galWrap .cccPic.item-3{top:0!important;bottom:0!important;left:300px!important;width:120px!important;height:120px!important}

}

@media only screen and (max-width:768px){

    .extContent.clickChange .galWrap{background-image:none!important;display:flex!important;height:6rem!important}
    .extContent.clickChange .galWrap .cccPic.item-1{width:40px!important;height:40px!important;left:0!important;bottom:0!important;top:0!important}
    .extContent.clickChange .galWrap .cccPic.item-2{width:40px!important;height:40px!important;left:60px!important;bottom:0!important;top:0!important}
    .extContent.clickChange .galWrap .cccPic.item-3{width:40px!important;height:40px!important;left:120px!important;bottom:0!important;top:0!important}
    .extContent.clickChange .galWrap .cccPic.item-4{width:40px!important;height:40px!important;left:180px!important;bottom:0!important;top:0!important}
    .extContent.clickChange .galWrap .cccPic.item-5{width:40px!important;height:40px!important;left:240px!important;bottom:0!important;top:0!important}

    .extContent.clickChange.conRight .galWrap .cccPic.item-1{width:80px!important;height:80px!important;left:0!important;bottom:0!important;top:0!important}
    .extContent.clickChange.conRight .galWrap .cccPic.item-2{width:80px!important;height:80px!important;left:100px!important;bottom:0!important;top:0!important}
    .extContent.clickChange.conRight .galWrap .cccPic.item-3{width:80px!important;height:80px!important;left:200px!important;bottom:0!important;top:0!important}

    .ceItem.clickChange .itemWrap .bodyWrap .txtWrap .buttonBox .btn.btnSmall{margin:20px 0 0 0!important}

}