<style type="text/css">
.dmy{ color:#ffffff;background-color:#ffffff;}

/*--------------------------- SIDE MENU ---------------------------*/

/*--- 左のサイドメニューの三角部分 ---*/
ul.menu_list li .list_triangle{
  position:absolute;
  left:130px;
  width: 0;
  height: 0;
  border-top: 50px solid transparent;
  border-bottom: 50px solid transparent;
  border-left: 20px solid;
  border-left-color: #FFFFFF;
  transition: border-left-color 0.2s linear;
  
  /*transition: all 0.3s linear;
  opacity:0;
  left:110px;*/
}

ul.menu_list li.selected .list_triangle{
  border-left-color: #3279b5;
}
ul.menu_list li:hover .list_triangle{
  border-left-color:#B0CFE8;
    
  /*opacity:1;
  left:130px;*/
}

/*--- 左のサイドメニュー iPhone向け ---*/
ul.menu_list{
  list-style-type:none;
  padding-left:0;
}

ul.menu_list li{
  cursor:pointer;
  float:left;
  font-size:16px;
  font-weight:bold;
  color:#FFF;
  width:20%;
  height:40px;
  line-height:40px;
  text-align:center;
  margin:0;
  transition: background-color 0.1s linear 0;
  border-bottom: none;
  box-shadow: none;
}

ul.menu_list li.selected{
  background-color: #FFF;
  color:#333;
  transition: background-color 0.1s linear 0;
}
ul.menu_list li:hover{
  background-color:#666;
  color:#FFFFFF;
  transition: background-color 0.1s linear 0;
}

/*--- 左のサイドメニュー PC向け ---*/
@media (min-width: 768px){
  ul.menu_list li{
    width:100%;
    height:100px;
    padding:0px;
    border-bottom: 1px solid #666666;
    box-shadow: 0px 1px 0px #CCC;
  }

  ul.menu_list li.selected{
    background-color: #3279b5;
    color:#FFFFFF;
  }
  ul.menu_list li:hover{
    background-color:#B0CFE8;
    color:#FFFFFF;
  }
}

/* select data detail */
li.menu_list_detail{ list-style-type:none; }
li.menu_list_detail ul{
  color:#000000;
  font-size:20px;
  font-weight:bold;
  width:220px;
  margin:5px 0;
  line-height:24px;
}

li.menu_list_detail ul.selected{ background-color:#c0c0c0; }
li.menu_list_detail ul:hover{ background-color:#4D94BA; cursor: pointer; }


img.side_icons{
  max-width:100px;
  height:auto;
  margin:0 auto;
  padding:20px 0 0 0;
  display:block;
}
/*--------------------------- 一覧テーブル ---------------------------*/
table.t_list caption{
  text-align:left;
  font-size:18px;
  font-weight:bold;
}
table.t_list{
  width:100%;
  border:none;
  margin:20px 0;
  padding-left: 15px;
}
table.t_list th, table.t_list td{
  border:none;
  padding:4px 0 4px 15px;
  font-weight:bold;
  font-size:14px;
}
table.t_list th{
  text-align:left;
  color:#FFF;
  border:none;
  border-color:#222222;
  background-color:#222222;
}
table.t_list td{
  border-bottom:dashed 1px #E6F2F0;
}

table.t_list .col_check{ width: 35px; }
table.t_list .col_id{ width: 45px; }
table.t_list .col_tdate{ width: 200px; }
table.t_list .col_status{ width: 70px; }
table.t_list .col_uname{ width: 143px; }
table.t_list .col_date{ width: 100px; }

table.t_list .col_title a{/*-- iPhone --*/
  width:140px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (min-width: 768px){/*-- iPad --*/
  table.t_list .col_title a{
    width:200px;
  }
}
@media (min-width: 992px){/*-- PC --*/
  table.t_list .col_title a{
    width:400px;
  }
}
table.t_list td.col_title>a{ display:block;cursor:pointer; }

table.t_list .col_hide{
  display:none;
  visibility:hidden;
}
@media (min-width: 768px){
  table.t_list .col_hide{
    display:table-cell;
    visibility:visible;
  }
}

/*iPad縦向きは非表示、横向きは表示*/
table.t_list .col_hide_portrait{
  display:none;
  visibility:hidden;
}
@media (min-width: 1024px){
  table.t_list .col_hide_portrait{
    display:table-cell;
    visibility:visible;
  }
}

table.t_list_data{
  width:100%;
  border:none;
  margin:10px 0;
}


/*---------------------------  ---------------------------*/
table.t_form{
  width:95%;
  border:none;
  margin:20px 30px;
  border-collapse: collapse;
}
table.t_form caption{
  text-align:left;
  font-size:20px;
  font-weight:bold;
  margin:5px;
  border-bottom:solid 1px #CCC;
}
table.t_form tr td{ border:none; }

/* */
table.t_confirm{
  width:95% ;
  border:none;
  margin:20px 30px;
  border-collapse: collapse;
}
table.t_confirm_bgcolor{
  width:95%;
  border:none;
  margin:20px 30px;
  border-collapse: collapse;
}
table.t_confirm caption{
  text-align:left;
  font-size:20px;
  font-weight:bold;
  margin:5px;
}
table.t_confirm tr td{
  padding:7px 5px;
  border:solid 1px #CCC;
  background-color:#FDFDFD;
  word-break: break-all; /* 枠内で折り返す 2026.04 Add */
  overflow-wrap: break-word; /* 枠からはみ出さないようにする 2026.04 Add */
}
table.t_confirm_bgcolor tr td{
  padding:7px 5px;
  border:solid 1px #CCC;
  /* background-color:#FDFDFD; */
  word-break: break-all; /* 枠内で折り返す 2026.04 Add */
  overflow-wrap: break-word; /* 枠からはみ出さないようにする 2026.04 Add */
}

table.t_author
{
  border:none; margin:20px 30px; border-collapse: collapse; width:/*300px*/auto; 
}
table.t_author caption{
  text-align:left; font-size:20px; font-weight:bold; margin:5px; 
}
table.t_author tr td{
  padding:7px 5px; border:solid 1px #CCC; 
  word-break: break-all; /* 枠内で折り返す 2026.04 Add */
  overflow-wrap: break-word; /* 枠からはみ出さないようにする 2026.04 Add */
}
table.t_author tr th{
  padding:7px 5px; border:solid 1px #CCC; text-align:left; background-color:#FDFDFD;
  word-break: break-all; /* 枠内で折り返す 2026.04 Add */
  overflow-wrap: break-word; /* 枠からはみ出さないようにする 2026.04 Add */ 
}

div.buttons_center{
  width:95%; text-align:center; padding-top:10px; border:none;
}
div.buttons_left{
  width:95%; text-align:left; padding-top:10px; border:none;
}
/* 申請状態確認  */
table.t_rcvconfirm{
  border:none; margin:20px 30px; border-collapse: collapse; width:auto;
  font-weight:normal; 
  table-layout: fixed;
}
table.t_author caption{
  text-align:left; font-size:20px;font-weight:bold; margin:5px; 
}
table.t_rcvconfirm tr th{
  padding:7px 5px; border:solid 1px #CCC; text-align:left; background-color:#FDFDFD; 
  font-weight:normal; /* white-space:nowrap; */
  word-break: break-all; /* 枠内で折り返す 2026.04 Add */
  overflow-wrap: break-word; /* 枠からはみ出さないようにする 2026.04 Add */ 
}
table.t_rcvconfirm caption{
  text-align:left;
  font-size:20px;
  font-weight:bold;
  margin:5px;
}
.t_rcvconfirmcolArrow{	width:20px; }
.t_rcvconfirmcol0{	width:100px; }
.t_rcvconfirmcol1{	width:100px; }
.t_rcvconfirmcol2{	width:150px; }
.t_rcvconfirmcol3{	width:80px; }
.t_rcvconfirmcol4{	width:250px; }
.t_rcvconfirmcol5{	width:155px; }

table.t_Untreatedform{
  border:none; margin:20px 30px; border-collapse: collapse; width:auto; 
  font-weight:normal; 
}

table.t_remandform{
  border:none; margin:20px 30px; border-collapse: collapse; width:auto; 
  font-weight:normal; 
}

/* */
*select {
  font-family: 'Segoe UI', Arial, Meiryo, 'MS PGothic', sans-serif;
}
/* */
table.t_preview_daishi{
  width:95%;
  border:none;
  margin:0px 0px;
  border-collapse: collapse;
}

/* 有休申請一覧       */
div.calendar-container {
    width: 35%;
    height: calc(100% - 70px);
    font-family:"Roboto",sans-serif;
    float: left;
}

@media (max-width: 768px){
  div.calendar-container {
    width: 100%;
    height: calc(100% - 70px);
    font-family:"Roboto",sans-serif;
  }
}

div.calendar-title-container {
    background-color: #c3c3c3;
    height: 50px;
    margin-top: 30px;
    margin-bottom: 5px;
}

div.calendar-title {
    text-align: center;
    font-size: 23px;
    font-weight: bold;
    padding-top: 10px;
}

div.calendar-arrow-left {
    text-align: left;
    float: left;
    font-size: 23px;
    padding-top: 12px;
    padding-left: 10px;
    color: #666666;
    cursor: pointer;
    cursor: hand;
}

div.calendar-arrow-left:FOCUS {
    outline: 0;
}

div.calendar-arrow-right {
    text-align: right;
    float: right;
    font-size: 23px;
    padding-top: 12px;
    padding-right: 10px;
    color: #666666;
    cursor: pointer;
    cursor: hand;
}

div.calendar-arrow-right:FOCUS {
    outline: 0;
}

table.calendar-frame {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.calendar-frame > thead {
    background-color: #FFFFFF;
}

th.calendar-cell {
    border: 1px solid #BBBBBB;
    color: #555555;
    text-align: center;
    height: 30px;
}

tr.calendar-record {
    height: 8vh;
    min-height: 8vh;
}

td.calendar-cell {
    vertical-align: top;
    padding: 2px 2px 5px 2px;
    border: 1px solid #BBBBBB;
    color: #555555;
    cursor: pointer;
    cursor: hand;
}

td.calendar-cell:hover {
  background-color: #c0c0c0 !important;
}

hr.calendar-cell-bar {
    margin-top: 5px;
    margin-bottom: 5px;
    border: 0;
    border-top: 1px dotted #DDDDDD;
}

div.calendar-day {
    margin-right: 5px;
    font-size: 16px;
    position: relative;
}

div.calendar-day:FOCUS {
    outline: none;
}

div.calendar-day-value {
    padding: 5px 5px 3px 5px;
}

div.paidHolidayApp-container {
  width: 60%;
  float: right;
}

@media (max-width: 768px){
  div.paidHolidayApp-container {
  width: 100%;
  }
}

</style>
