/* REM Unit Font Size init */
html{font-size: 62.5%; /* 1rem == 10px */}

:root {

    /* Container */
    --container-width: 1147px;
  
    /* Gutter */
    --lg:10rem;
    --md:7rem;
    --gutter: 3rem;
    --gutter-half: calc(var(--gutter) / 2);
  
    /* Transition */
    --transition: 100ms linear;

}

/* Container */
.container{width: 100%; max-width: calc(var(--container-width) + (var(--gutter) * 2)); margin-inline: auto; padding: 0 var(--gutter);}

/* Grid */
.grid{display: grid;}
@media(width > 992px){
    .grid-col-lg-2{grid-template-columns: repeat(2, 1fr);}
}

/* Flex */
.flex{display: flex;}
.flex-wrap{flex-wrap: wrap;}
.align-items-center{align-items: center;}
.justify-content-center{justify-content: center;}
.flex-1{flex: 1 0 0%;}

/* Margin */
.mt-gutter{margin-top: var(--gutter);}
.mt-gutter-half{margin-top: var(--gutter-half);}
.mt-5{margin-top: .5rem;}

/* Gap */
.gap-gutter{gap: var(--gutter);}
.gap-gutter-half{gap: var(--gutter-half);}
.gap-x-gutter-half{gap: 0 var(--gutter-half);}
.gap-10{gap: 1rem;}
.gap-5{gap: .5rem;}

/* Line Clamp */
.line-clamp{overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;}
.line-clamp-1{ -webkit-line-clamp: 1;}
.line-clamp-2{ -webkit-line-clamp: 2;}
.line-clamp-3{ -webkit-line-clamp: 3;}
.line-clamp-4{ -webkit-line-clamp: 4;}
.line-clamp-5{ -webkit-line-clamp: 5;}
.line-clamp-6{ -webkit-line-clamp: 6;}

/* Width */
.w-full{width: 100%;}

/* Text Align */
.text-center{text-align: center;}

/* Block */
.block{display: block !important;}

/* Hide and Show */
.show{display: block;}
.hide{display: none;}

/* Position */
.relative{position: relative;}
.absolute{position: absolute;}

/* Isolation */
.isolate{isolation: isolate;}

/* Z Index */
.z-index-1{z-index: 1;}