/* This is a CSS file */

bodyview{
    /**
    display: flex; 
    flex-direction: column;
    */
    /**min-height: 100vh; height: 100vh;  */
}
header,footer {
  flex: 0;
}
.nktband {
  display: flex; flex: 1;
}
noteselect {
  order: -1;
}


timeline {
  flex: 1; display: flex;
  overflow-x: auto;
}
noteview{
  flex: 1; display: flex; flex-direction: column; 
}

.pagewrite{
}
.notelist{
  flex: 1;
  display: flex;
}
.note{
  width: 250px;
  flex: 1;
  overflow-y: auto;
}


noteselect{
  width: 40px;
}
pageview{ 
  border: 1px solid rgba(100,255,100,0.4);
  width: 100%;
}



/** scroll-bar */
.scroll_y::-webkit-scrollbar {
    width: 12px;
}
.scroll_x::-webkit-scrollbar {
    height: 12px;
}
.scrollstyle::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
}
 .scrollstyle::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
/** ********** */




.page__content{
    /**
    overflow: hidden;
    */
}






/** 全体 */
.body_all {
  display: flex;
  flex-direction:column;
  min-height: calc(100vh);
  border: 1px solid #ff0;
}

.body_item {
  width: 100%;
}

.body_item__top {
  height: 3em;
}

.body_item__main_border {
  border: 1px solid #0a0;
  height: 100%;
}

.body_item__bottom {
  height: 5em;
}


.body_item__main_flex{
    display: flex; max-height: 100%;
}

/** 左側メニューバー */
.body_item__main_menu{
    min-width: 30px; width: 30px;
}
.body_item__main_menu_flex{
    display:flex; flex-direction: column; height: calc(100% - 5em);
}

/** コンテンツ部分の外枠 */
.body_item__main_nkt{
    height:calc(100vh - 4em); flex: 1;
}

/** コンテンツ部分の内枠 */
.body_item__main_nkt_flex{
    display: flex; flex-direction: row; width: 100%;
}

.body_item__main_nkt_center{
     height:calc(100vh - 4em); overflow-y: hidden;
}

.body_item__main_nkt_center_flex{
    display:flex; flex-direction: column; height: 100%; overflow-x: hidden;
}

.body_item__main_nkt_center_write{
    flex: 0;
}

.body_item__main_nkt_center_notes{
    overflow-x:auto; overflow-y:hidden; flex: 1; align-self:auto;  
}
.body_item__main_nkt_center_note_flex{
    display: flex; flex-direction: row; height: 100%;
}
/** ノートラインの幅 */
.body_item__main_nkt_center_note{
    width: 250px; min-width: 250px; overflow-y:auto;
}

/** ページ詳細表示部分 */
.body_item__main_nkt_right{
    flex: 1;
}


@media screen and (max-width: 568px) {
.body_item__main_nkt_right{
     visibility: hidden;
     display: none;
}
.body_item__main_nkt_center{
    width: 100%;
}
.body_item__main_nkt_center_note{
    width: 100%; overflow-y:auto;
}
}
@media screen and (min-width: 569px) {
.body_item__main_nkt_right{
    flex: 1;
}
.body_item__main_nkt_center_note{
    width: 250px; min-width: 250px; overflow-y:auto;
}
}

a.linkbox{
    margin-left: 5px; text-decoration: none;
}
label.linkbox,

span.linkbox{
    padding: 5px 3px 1px 4px;
    /* box-shadow */
    box-shadow:4px 4px 3px -3px rgba(255,160,160,0.8);
    -moz-box-shadow:4px 4px 3px -3px rgba(255,160,160,0.8);
    -webkit-box-shadow:4px 4px 3px -3px rgba(255,160,160,0.8);    
    /* border-radius */
    border-radius:3px;
    -moz-border-radius: 3px ;
    -webkit-border-radius: 3px ;
    
    /* border */
    border:1px solid rgba(255,160,160,0.8);
    border-width: 1px 2px 2px 1px;
    
    color:#000;
    line-height:25px;
}

span.linkbox:active{
    border:1px solid rgba(160,160,255,0.8);
    color: rgba(160,160,255,0.8);
}

span.linkboxTagSelect{
    padding-top: 2px;
    border-left-style: double;
    border-left-width: 5px;
    
    border-radius: 0px 3px 3px 0px;
    -moz-border-radius: 0px 3px 3px 0px;
    -webkit-border-radius: 0px 3px 3px 0px;
}

label.btnIcon{}
label.btnIcon:active{
    border:1px solid rgba(160,160,255,0.8);
    color: rgba(160,160,255,0.8);
}


span.reloadbox{
    padding-top: 0px;
}
.imagebox{
    text-decoration: none;
    margin: 0px;
    padding: 0px;
    vertical-align:bottom;;
}

a.image_chain_button{
    text-decoration: none;
    padding: 3px;
}
span.image_chain_button_on{
    color:#FFF;
    font-size:1.5em; vertical-align: middle; margin:3px;
    font-weight: bold;
}
span.image_chain_button_off{
    color:#000;
    font-size:1.5em; vertical-align: middle; margin:3px;
}
a.modalimage_view{
    text-decoration: none;
    margin: 0px;
    padding: 0px;
    vertical-align:bottom;
}
img.modalimage_view{
    max-width: 100%;
    /* border-radius */
    border-radius:3px;
    -moz-border-radius: 3px ;
    -webkit-border-radius: 3px ;
    border: 1px solid rgba(255,160,160,0.8);
    overflow: hidden;
}

.defaultShadow{
    /* box-shadow */
    box-shadow:4px 4px 3px -3px rgba(255,160,160,0.8);
    -moz-box-shadow:4px 4px 3px -3px rgba(255,160,160,0.8);
    -webkit-box-shadow:4px 4px 3px -3px rgba(255,160,160,0.8);    
}

.okselect{
    -moz-user-select: initial;
    -ms-user-select: initial;
    -khtml-user-select: initial;
    -webkit-user-select: initial;
    -webkit-touch-callout: initial;
}

.tagSummaryLink{
    color: rgba(158, 9, 77, 0.95);
    margin-left: 5px;
}


.nkt_textarea{
    width: 90%; max-width: 900px; heigth: 10%; min-height: 60px; border-size: 2px 1p 1p 2px; border-color: rgba(255,160,160,0.8);
}

.config_div{
    margin-bottom: 10px;
}