/**
 * @file
 * CSS for page components.
 */




/**
 * ===== PAGE =====
 */

/**/
div.page {
  background-color: var(--custom-color-0-4);
  margin: 0 auto;
  max-width: 1400px;
}


/**/
div.page-head {}
div.page-head-box-outer {
  padding: 3rem 0 0 0;
}
div.page-head-box-inner {
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 2%;
}

.page-head-navi {
  background: #FFFFFF;
  border-bottom: #EAEAEA solid 5px;
  display: flex;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100;
}

.toolbar-tray-open .page-head-navi {
  padding-top: 80px;
}

.toolbar-vertical .page-head-navi {
  left: 15rem;
  padding-top: 40px;
  width: calc(100% - 15rem);
}

.page-head-navi-box-outer {
  margin: 0 auto -5px auto;
  max-width: 1400px;
  width: 100%;
}


.page-head-navi-box-inner {
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  padding: 5px 2% 0 2%;
}
.page-head-navi-box-inner .region-navi-user {
  margin-left: auto;
}


/**/
div.page-body {}
div.page-body-box-outer {
  padding: 2rem 0;
}
div.page-body-box-inner {
  /*border: 2px dashed #CCCCCC;*/
  box-sizing: border-box;
  max-width: 1400px;
  margin: 0 auto;
  overflow: hidden;
  padding: 0 2%;
}


/**/
div.page-foot {}
div.page-foot-box-outer {
  background-color: #EAEAEA;
  padding: 2%;
}
div.page-foot-box-inner {
  box-sizing: border-box;
  max-width: 1024px;
  margin: 0 auto;
  overflow: hidden;
  padding: 2%;
}




/**
 * ===== MAIN ASIDE =====
 */

/**/
div.main-aside {}




/**
 * ===== REGION - PAGE =====
 */


/**
 * header
 */
header.region-header {}


/**
 * header
 */
footer.region-footer {}


/**
 * content
 */
main.region-content {}


/**
 * aside
 */
aside.region-aside {}




/**
 * ===== REGION - NAVI =====
 */


/**
 * navi-main
 */
.region-navi-main {

}


/**
 * navi-meta
 */
.region-navi-meta {}


/**
 * navi-mobl
 */
.region-navi-mobl {}


/**
 * navi-tree
 */
.region-navi-tree {}




/**
 * ===== REGION - AREA =====
 */


/**
 * area-action
 */
.region-area-action {}


/**
 * area-filter
 */
.region-area-filter {}


/**
 * area-master
 */
.region-area-master {}


/**
 * area-player
 */
.region-area-player {}


/**
 * area-reader
 */
.region-area-reader {}


/**
 * area-social
 */
.region-area-social {}


/**
 * area-widget
 */
.region-area-widget {}