/* =Grid >> Global
--------------------------------------------------------------------------------*/
.half-width,
.one-third,
.one-fourth,
.one-fifth,
.one-sixth,
.two-third,
.two-sixth,
.two-fifth,
.three-fourth,
.three-fifth,
.four-fifth,
.four-sixth,
.five-sixth,
.full-width
{
    display: inline;
    float: left;
    width : 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen {
    #main, #right, #left {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .ce_multicolumnStart .inside_ce {
        width: auto !important;
    }


    #footer-like .one-third,
    #footer-like .two-third,
    #footer-like .half-width {
        width: 100%;
    }

}


/* Media Query
--------------------------------------------------------------------------------*/

@media only screen and (min-width: 320px) {
    body {border-top : 10px solid grey; }
    body:after{
        /*657117653656608769*/
        content : 'w320px ';
        display : none;
    }

}



/* resize bigger */
/* display with min width 479 iphone portrait */
@media only screen and (max-width: 479px) {
    body {border-top : 10px solid yellow; }
    body:after{
        content : 'w479px ';
        display : none;
    }
}

/* display with min width 375 iphone 6/7/8 portrait */
@media only screen and (min-width: 375px) {

    body {border-top : 10px solid black; }

    body:after{
        content : 'w375px ';
        display : none;
    }
    .one-fourth {width: 50%;}
}



/* display with min width 480 iphone lansacape */
@media only screen and (min-width: 480px) {
    body {border-top : 10px solid green; }
    body:after{
        content : 'w480px';
        display : none;
    }

    .one-third, .one-sixth {width: 33.33333333333333%;} /* 184@736, 232@928, 292@1168*/

    .two-third{width: 66.66666666666666%;}
    .full-width {width: 100%;}

    .text-center{
        text-align: center;
    }

}




/* min-width:768px ipad portrait*/
@media only screen and (min-width: 768px) {
    body {border-top : 10px solid blue; }
    body:after{
        content : 'w760px';
        display : none;
    }

    .half-width {width: 50%;}
    .one-fourth {width: 25%;}
    .one-fifth {width: 20%;}
    .two-fifth {width: 40%;}
    .three-fifth {width: 60%;}
    .three-fourth {width: 75%;}
    .four-fifth {width: 80%;}
    .one-sixth {width: 16.66%;}
    .five-sixth {width: 83.333%;}

    #footer-like .ce_multicolumnStart .half-width,
    #footer-like .ce_multicolumnStart .one-third,
    #footer-like .ce_multicolumnStart .two-third,
    #footer-like .ce_multicolumnStart .half-width {width: 50%;}

    #js-scrolldown {
        display: block;
    }
}





@media only screen and (min-width: 990px) {
    body:after{
        content : 'w990px';
        display : none;
    }

    #header .customNavi  {
        padding-top: 8px;
        padding-bottom: 5px;
        max-width: 72%;
        overflow: hidden;
    }


    #footer-like .ce_multicolumnStart .one-third, .one-sixth {width: 33.33333333333333%;} /* 184@736, 232@928, 292@1168*/
    #footer-like .ce_multicolumnStart .two-third{width: 66.66666666666666%;}
    #footer-like .ce_multicolumnStart.half-width {width: 50%;}
}


/* min-width:1024 ipad landscape*/
@media only screen and (min-width: 1024px)   {
    body {border-top : 10px solid red; }
    body:after{
        content : 'w1024px';
        display : none;
    }
}


/* min-width:1025  */
@media only screen and (min-width:1025px)   {
    body {
        border-top : none;
    }
}

/* remove body border*/
body {border-top : none; position: relative}