.top { vertical-align: top; }
.left { text-align: left; }
.right { text-align: right; }
.bottom { vertical-align: bottom; }

.left-box, 
.left-box-b, 
.left-box-less, 
.left-box-more, 
.left-box-fixed, 
.left-box-more-hp,
.left-box-less-hp {
    float: left;
    width: 49%;
    transition: 0.2s;
}

.right-box, 
.right-box-less, 
.right-box-more, 
.right-box-less-hp, 
.right-box-fixed,
.right-box-more-hp{
    float: right;
    width: 49%;
    transition: 0.2s;
}

.left-box-less, 
.right-box-less, 
.right-box-less-hp, 
.left-box-less-hp { 
    width: 35%; 
}

.left-box-more, 
.right-box-more, 
.left-box-more-hp, 
.right-box-more-hp { 
    width: 63%; 
}

.left-box-fixed { width: 63%; }
.right-box-fixed { width: 35%; }

.quarter-box { 
    width: 25%;
    float: left;
    padding: 2%;
    transition: 0.2s;
}
.quarter3-box {
    float: right;
    width: 75%;
    transition: 0.2s;
}
.left-box img {
    width: 100%;
    height: auto;
}
.space-y {
    padding-top: 10px;
    padding-bottom: 10px;
}
.space-y2 {
    padding-top: 4%;
    padding-bottom: 4%;
}
.space-x {
    padding-left: 2%;
    padding-right: 2%;
}
.space-x2 {
    padding-left: 4%;
    padding-right: 4%;
}
.space-xy { padding: 2%; }
.space-xy2 { padding: 4%; }
.tempoff { display: none; }
.mv0 { 
    padding-top: 0 !important; 
    padding-bottom: 0 !important; 
}
.mv1 { margin: 2% 0; }
.mh1 { margin: 0 2%; }
.m1 { margin: 2%; }
.mv2 { margin: 4% 0; }
.mh2 { margin: 0 4% !important; }
.mt0 { margin-top: 0 !important; }
.mb0 { margin-bottom: 0 !important; }
.mb5f { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb20, .mb20f { margin-bottom: 20px !important; }
.mb30 { margin-bottom: 30px !important; }
.m2 { margin: 4%; }

.mt0, .mtop0 { margin-top: 0 !important; }
.mt2 { margin-top: 2% !important; }
.mt3 { margin-top: 3% !important; }
.mt4 { margin-top: 4% !important; }
.mt5 { margin-top: 5% !important; }
.mt6 { margin-top: 6% !important; }
.mt7 { margin-top: 7% !important; }
.mt8 { margin-top: 8% !important; }
.mt9 { margin-top: 9% !important; }
.mt10 { margin-top: 10px !important; }
.mt20 { margin-top: 20px !important; }
.mt22 { margin-top: 22px !important; }
.mt30 { margin-top: 30px !important; }
.mt40 { margin-top: 40px !important; }
.mt50 { margin-top: 50px !important; }
.mt60 { margin-top: 60px !important; }
.mt70 { margin-top: 70px !important; }
.mt80 { margin-top: 80px !important; }

.ml0, .mleft0 { margin-left: 0 !important; }
.ml2 { margin-left: 2% !important; }
.ml3 { margin-left: 3% !important; }
.ml4 { margin-left: 4% !important; }
.ml5 { margin-left: 5% !important; }
.ml6 { margin-left: 6% !important; }
.ml7 { margin-left: 7% !important; }
.ml8 { margin-left: 8% !important; }
.ml9 { margin-left: 9% !important; }
.ml10 { margin-left: 10px !important; }
.ml20 { margin-left: 20px !important; }
.ml30 { margin-left: 30px !important; }
.ml40 { margin-left: 40px !important; }
.ml50 { margin-left: 50px !important; }
.ml60 { margin-left: 60px !important; }
.ml70 { margin-left: 70px !important; }
.ml80 { margin-left: 80px !important; }

.mr0, .mright0 { margin-right: 0 !important; }
.mr2 { margin-right: 2% !important; }
.mr3 { margin-right: 3% !important; }
.mr4 { margin-right: 4% !important; }
.mr5 { margin-right: 5% !important; }
.mr6 { margin-right: 6% !important; }
.mr7 { margin-right: 7% !important; }
.mr8 { margin-right: 8% !important; }
.mr9 { margin-right: 9% !important; }
.mr10 { margin-right: 10px !important; }
.mr20 { margin-right: 20px !important; }
.mr30 { margin-right: 30px !important; }
.mr40 { margin-right: 40px !important; }
.mr50 { margin-right: 50px !important; }
.mr60 { margin-right: 60px !important; }
.mr70 { margin-right: 70px !important; }
.mr80 { margin-right: 80px !important; }

.pt0, .top0 { padding-top: 0 !important; }
.pt2 { padding-top: 2% !important; }
.pt3 { padding-top: 3% !important; }
.pt4 { padding-top: 4% !important; }
.pt5 { padding-top: 5% !important; }
.pt6 { padding-top: 6% !important; }
.pt7 { padding-top: 7% !important; }
.pt8 { padding-top: 8% !important; }
.pt9 { padding-top: 9% !important; }
.pt10 { padding-top: 10px !important; }
.pt20 { padding-top: 20px !important; }
.pt30 { padding-top: 30px !important; }
.pt40 { padding-top: 40px !important; }
.pt50 { padding-top: 50px !important; }
.pt60 { padding-top: 60px !important; }
.pt70 { padding-top: 70px !important; }
.pt80 { padding-top: 80px !important; }

.pr0, .right0 { padding-right: 0 !important; }
.pr2 { padding-right: 2% !important; }
.pr3 { padding-right: 3% !important; }
.pr4 { padding-right: 4% !important; }
.pr5 { padding-right: 5% !important; }
.pr6 { padding-right: 6% !important; }
.pr7 { padding-right: 7% !important; }
.pr8 { padding-right: 8% !important; }
.pr9 { padding-right: 9% !important; }
.pr10 { padding-right: 10px !important; }
.pr20 { padding-right: 20px !important; }
.pr30 { padding-right: 30px !important; }
.pr40 { padding-right: 40px !important; }
.pr50 { padding-right: 50px !important; }
.pr60 { padding-right: 60px !important; }
.pr70 { padding-right: 70px !important; }
.pr80 { padding-right: 80px !important; }

.pb0, .pbottom0 { padding-bottom: 0 !important; }
.pb2 { padding-bottom: 2% !important; }
.pb3 { padding-bottom: 3% !important; }
.pb4 { padding-bottom: 4% !important; }
.pb5 { padding-bottom: 5% !important; }
.pb6 { padding-bottom: 6% !important; }
.pb7 { padding-bottom: 7% !important; }
.pb8 { padding-bottom: 8% !important; }
.pb9 { padding-bottom: 9% !important; }
.pb10 { padding-bottom: 10px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb40 { padding-bottom: 40px !important; }
.pb50 { padding-bottom: 50px !important; }
.pb60 { padding-bottom: 60px !important; }
.pb70 { padding-bottom: 70px !important; }
.pb80 { padding-bottom: 80px !important; }

.pl0, .pleft0 { padding-left: 0 !important; }
.pl2 { padding-left: 2% !important; }
.pl3 { padding-left: 3% !important; }
.pl4 { padding-left: 4% !important; }
.pl5 { padding-left: 5% !important; }
.pl6 { padding-left: 6% !important; }
.pl7 { padding-left: 7% !important; }
.pl8 { padding-left: 8% !important; }
.pl9 { padding-left: 9% !important; }
.pl10 { padding-left: 10px !important; }
.pl20 { padding-left: 20px !important; }
.pl30 { padding-left: 30px !important; }
.pl40 { padding-left: 40px !important; }
.pl50 { padding-left: 50px !important; }
.pl60 { padding-left: 60px !important; }
.pl70 { padding-left: 70px !important; }
.pl80 { padding-left: 80px !important; }

.bottom0 { padding-bottom: 0 !important; }
.nowrap { white-space: nowrap; }

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

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

@media only screen and (max-width: 870px) {
    .right-box-more, 
    .left-box-less { 
        float: none; width: 100%; 
    }
}

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

@media only screen and (max-width: 690px) {
    .left-box, .right-box {
        float: none; width: 100% !important;
    }
    /*.quarter-box,
    .quarter3-box { 
        float: none; width: 100%; 
    }*/
}

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

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

@media only screen and (max-width: 480px) {
    .quarter-box { width: 33%; }
    .quarter3-box { 
        width: 67%; 
    }
}

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

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