@charset "utf-8";

/**
 * filename: mps.responsive.contents
 * @overview マイポータル レスポンシブ対応　コンテンツ定義CSS
 * @version 2.0.9 2020-03-27
 */
 
/* Text block */
.text-block {
  margin-top: 20px
}
.text-block > *:not(ul) {
  margin: 10px 0 0 0;
}
.text-block > *:first-child {
  margin-top: 0;
}
.text-block ul {
  margin: 0;
}
.text-block ul li {
  margin-top: 10px;
  margin-left: 0;
  margin-bottom: 0;
}
.text-block ul .myportal-link-outer:not(:first-child) {
  margin-top: 6px;
}
.text-block ul .myportal-link-outer-noLineBreak {
  margin-right: 10px;
}

/* Toggle */

.toggle-button {
  box-sizing: border-box;
  position: relative;
  display: block;
  width: 100%;
  padding: 10px 15px 10px 36px;
  background-color: #fff5cb;
  border: none;
  font-weight: bold;
  text-align: left;
}
.toggle-button.hide-pc {
  display: none;
}
.toggle-button .icon {
  position: absolute;
  top: 50%;
  left: 10px;
  display: block;
  width: 16px;
  height: 16px;
  background-color: #e17117;
  border-radius: 50%;
  transform: translateY(-50%);
}
.toggle-button .icon::before,
.toggle-button .icon::after {
  content: '';
  position: absolute;
  background-color: #fff5cb;
}
.toggle-button .icon::before {
  display: none;
  top: 4px;
  left: 7px;
  width: 2px;
  height: 8px;
}
.toggle-button .icon::after {
  display: block;
  top: 7px;
  left: 4px;
  width: 8px;
  height: 2px;
}
.toggle-button.is-visible .icon::before {
  display: block;
}

@media screen and (max-width: 767px) {
  .toggle-button.hide-pc {
      display: block;
  }
  #search-terms {
      display: none;
  }
}

/* Date selection */

.date-select {
  display: flex;
  align-items: center;
  margin: 0;
}
.date-select li {
  margin: 0 0 0 15px;
  white-space: nowrap;
}
.date-select li:first-child {
  margin-left: 0;
}
.date-select label {
  display: flex !important;
  align-items: center;
  margin-bottom: 0;
  padding-left: 0 !important;
}
.date-select label input[type=radio] {
  margin: 0 !important;
}
.date-select label .label-text {
  display: inline-block;
  margin-left: 6px;
}
.date-select label .embed-datepicker {
  margin-left: 6px;
}

@media screen and (max-width: 767px) {
  .date-select {
      display: block;
  }
  .date-select li {
      margin-top: 10px;
      margin-left: 0;
  }
  .date-select li:first-child {
      margin-top: 0;
  }
  .date-select label {
      display: inline-flex !important;
      width: auto !important;
      vertical-align: top;
  }
  .date-select label.sp-full-width {
      width: 100% !important;
  }
  .date-select label .embed-datepicker {
      flex-grow: 1;
      flex-basis: auto;
      display: flex;
      align-items: center;
  }
  .date-select label .embed-datepicker .picker-style {
      flex-grow: 1;
      flex-basis: auto;
      width: auto !important;
  }
}

/* Headline button */

@media screen and (max-width: 767px) {
  .responsive-layout .btn-refresh {
      width: auto;
  }
}

/* Table */

.table tr.disabled,
.table-striped tr.disabled:nth-of-type(2n+1),
.table-hover tr.disabled:hover {
  background-color: #ccc;
  color: #444;
}
.table-responsive2a .button-detail .btn {
  margin: 0;
}
.table-responsive2a tbody tr td.myportal-label {
  background-color: #fff;
}
.table-responsive2a tbody tr td.myportal-label .myportal-label-button {
  display: none;
}

@media screen and (max-width: 767px) {
  .responsive-layout .table-block .acd-table tr th,
  .responsive-layout .table-block .acd-table tr td {
      display: table-cell;
  }
  .responsive-layout .table-block .acd-table.is-open th:nth-child(2),
  .responsive-layout .table-block .acd-table.is-open th:nth-child(3),
  .responsive-layout .table-block .acd-table.is-open td:nth-child(2),
  .responsive-layout .table-block .acd-table.is-open td:nth-child(3) {
      white-space: nowrap;
  }
  .responsive-layout .table-block .table td .mobile-btn.sp-disabled {
      background-color: #e0e0e0;
      background-image: none;
      border-color: #ccc;
      pointer-events: none;
      cursor: not-allowed;
      filter: alpha(opacity=65);
      -webkit-box-shadow: none;
      box-shadow: none;
      opacity: .65;
  }
  .table-responsive2a {
      margin-top: 0;
      border: 0;
  }
  .table-responsive2a tbody tr.thead {
      display: none;
  }
  .table-responsive2a tbody {
      border: 1px solid #c5c0af;
  }
  .table-responsive2a tbody tr {
      position: relative;
      display: block;
      flex-wrap: wrap;
      padding: 8px 60px 8px 8px;
      background: transparent;
      border-top: 1px solid #c5c0af;
  }
  .table-responsive2a tbody tr:first-child,
  .table-responsive2a tbody tr.thead + tr {
      border-top: none;
  }
  .table-responsive2a tbody tr td {
      display: block;
      width: 100%;
      margin-top: 8px;
      padding: 0;
      border: none;
  }
  .table-responsive2a tbody tr td:first-child {
      margin-top: 0;
  }
  .table-responsive2a tbody tr td[data-sp-headline]::before {
      content: '【' attr(data-sp-headline) '】';
      display: block;
      font-weight: bold;
  }
  .table-responsive2a tbody tr td.status {
      box-sizing: border-box;
      width: 85px;
      min-width: 85px;
      margin-top: 0;
      padding: 3px 5px;
      background-color: #fff;
      border: 1px solid #c5c0af;
      border-radius: 5px;
      font-size: 12px;
      text-align: center;
  }
  .table-responsive2a tbody tr td.confirmation_date {
      width: auto;
      margin-top: 0;
      margin-left: 8px;
      padding-top: 3px;
  }
  .table-responsive2a tbody tr td.myportal-label {
      display: flex;
      align-items: center;
      position: absolute;
      top: 0;
      right: 0;
      width: 51px;
      height: 100%;
      margin-top: 0;
      border-left: 1px solid #c5c0af;
  }
  .table-responsive2a tbody tr td.myportal-label label {
      display: none;
  }
  .table-responsive2a tbody tr td.myportal-label .myportal-label-button {
      display: block;
      width: 100%;
      color: #069;
      background: none;
      border: none;
      text-decoration: underline;
  }
  .table-responsive2a tbody tr:not(.is-open) td.toggle-ellipsis {
    width: 0;
    min-width: 100%;
}
  .table-responsive2a tbody tr:not(.is-open) div.toggle-ellipsis {
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
  }
  .table-responsive2a tbody tr:not(.is-open) td.toggle-hidden {
      display: none;
  }
  .table-responsive2a + .myportal-action {
      display: none;
  }
  .acd-table .acd-btn-slide {
      font-weight: normal;
  }
}



/* I-08 alert-infoのマージン調整 */
.responsive-layout .alert.alert-info {
  margin: 15px 0px;
}

.responsive-layout .alert.alert-danger {
  margin: 15px 0px;
}

.responsive-layout .alert.alert-warning {
  margin: 15px 0px;
}
.responsive-layout .alert.alert-confirmation {
  margin: 15px 0px;
}


/*acd-btn、全ページで文字色を黒(#000)に統一*/
.responsive-layout .acd-btn,
.responsive-layout .acd-btn2 {
  color: #000!important;
}

/***************************** 新規定義パラメータ *****************************/

/* C-07,D-01,I-02,I-03,I-08,J-04 アコーディオン開閉アイコン改行時の画像はみ出し防止 */
.responsive-layout .table.table-responsive .myportal-display-switch .myportal-switch-icon.sn-icon-maxh,
.responsive-layout .table.table-responsive .myportal-display-switch-custom .myportal-switch-icon.sn-icon-maxh {
  max-height: 32px;
}

/*------------------------------------------- PC画面のみ ------------------------------------------- */

@media screen and (min-width: 768px) {
  /**************** 定義済パラメータ（既存CSSに定義済み、再定義）*****************/

  /* myportal.main.css */
  /* F-01 状態表示欄の記法変更およびそれに伴うレイアウト修整 */
  .responsive-layout #notificationListTable .myportal-table-icon-otoiawase {
      width: 100px;
      text-align: left;
      padding-left: 10px;
  }

  /***************************** 新規定義パラメータ *****************************/
  /* F-02.htmlのページ下部PC画面ボタン位置調整 */
  .responsive-layout .sn-ml-0 {
      margin-left: 0px;
  }

  /* I-08 margin-rightを0にしたい時用 */
  .responsive-layout .sn-pc-mr-0 {
      margin-right: 0px;
  }

  /* F-02.htmlのページ下部PC画面ボタン区切り線調整 */
  .responsive-layout .pull-right .sn-delete {
      border-right: 2px solid #d9d2bd;
      padding-right: 10px;
      padding-bottom: 0px;
  }

  /* F-01 表内チェックボックス中央寄せ */
  .responsive-layout .table td.sn-td-center {
      text-align: center;
  }
  .responsive-layout .table td.sn-td-center input.myportal-checkbox-item {
      margin: 0;
  }
  /* 英数字を横幅に合わせて改行するよう設定 */
  .responsive-layout .sn-pc-numberwrap {
      word-break: break-all;
  }
  /*ボタンを横幅に合わせて伸縮するよう設定*/
  .responsive-layout .sn-pc-btnwrap {
      white-space: normal;
  }
  /*G-01 PC時のみ右寄せ設定*/
  .responsive-layout .sn-number {
      text-align: right;
  }  
  /*G-01 テーブル下のmargin削除*/
  .responsive-layout .sn-table-nobtmargin{
      margin-bottom: 0px;
  }
	.myportal-command-area #usestartbtn,
	.myportal-command-area #extsystemBackBtn{
		width: 250px;
		white-space: normal;
	}
}

/*------------------------------------------- SP画面のみ ------------------------------------------- */

@media screen and (max-width: 767px) {
  /*J-01,アコーディオン格納設定*/
  .responsive-layout tr td.sn-service,
  .responsive-layout tr td.sn-date,
  .responsive-layout tr .sn-info-edit {
      display: none;
  }
  .responsive-layout tr.is-open td.sn-service,
  .responsive-layout tr.is-open td.sn-date,
  .responsive-layout tr.is-open .sn-info-edit {
      display: block;
  }
  /* J-01レスポンシブ時項目リスト */
  .responsive-layout .table.table-striped.table-hover.table-responsive2 tr td.sn-subject-name:before {
      content: "【件名】";
  }
  .responsive-layout .table.table-striped.table-hover.table-responsive2 tr td.sn-subject-from:before {
      content: "【差出人】";
  }
  .responsive-layout .sn-dairi-number:before {
      content: "【代理関係番号】";
  }
  .responsive-layout .sn-name:before {
      content: "【代理関係名】";
  }
  .responsive-layout .sn-service:before {
      content: "【委任するサービス】";
  }
  .responsive-layout .sn-date:before {
      content: "【代理権限の有効期間】";
  }
  /*画面番号G-03のレスポンシブ時の項目リスト*/
  .responsive-layout .table-responsive2 tr td.sn-number:before {
      content: "【項番】";
  }
  .responsive-layout .table-responsive2 tr td.sn-consent:before {
      content: "【あなたが同意した日時】";
  }
  .responsive-layout .table-responsive2 tr td.sn-date001:before {
      content: "【提供日時】";
  }
  .responsive-layout .table-responsive2 tr td.sn-destination:before {
      content: "【提供先】";
  }
  .responsive-layout .table-responsive2 tr td.sn-purpose:before {
      content: "【提供内容】";
  }
  .responsive-layout .table-responsive2 tr td.sn-provider:before {
      content: "【提供元】";
  }
  .responsive-layout .table-responsive2 tr td.sn-information:before {
      content: "【提供情報】";
  }
  .responsive-layout .table-responsive2 tr td.sn-result:before {
      content: "【提供結果】";
  }

  /*G-01レスポンシブ時の項目リスト*/

  .responsive-layout .sn-usedate:before {
      content: "【利用日時】";
  }
  .responsive-layout .sn-service-name:before {
      content: "【サービス名】";
  }
  .responsive-layout .sn-service-content:before {
      content: "【利用内容】";
  }
  .responsive-layout .sn-user:before {
      content: "【利用者】";
  }

  /* F-02.htmlページ下部のボタンのレスポンシブの位置調整 */
  .responsive-layout .pull-right .sn-delete {
      border-right: none;
      padding-right: 0px;
  }

  /* I-08 myportal-command-area配下ボタン群のレイアウト調整 */
  .responsive-layout .sn-sp-margin-hensyuu {
      margin: 16px 0px 12px 0px;
  }

  /*F-01 文字数が多い時の省略表現*/
  .responsive-layout .table.table-striped.table-hover.table-responsive2 tr td.sn-subject-name {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
  }

  /*F-01 PC上で極小のボタン(再読込)がSP時に見出しを上書きする問題への対応*/
  .responsive-layout h2.myportal-refresh.sn-btn-xs-pos {
      margin-top: 100px;
  }
  .responsive-layout h2.myportal-refresh.sn-btn-xs-pos .btn {
      top: -89px;
  }

  /* F-01 SP画面で受診日横並べ、レイアウト調整 */
  .responsive-layout .table.table-striped.table-hover.table-responsive2 tr td.sn-myportal-table-send-otoiawase {
      display: inline-block;
      width: auto !important;
      padding-top: 18px;
      height: 57px;
  }

  /* I-02等 (主にフッターの上の)myportal-command-area高さ調整 */
  .responsive-layout .myportal-command-area .pull-right.sn-h-auto,
  .responsive-layout .myportal-command-area .pull-left.sn-h-auto {
      height: auto;
  }
  /* I-02 特定個人情報の左寄せ */
  .responsive-layout .table.table-responsive .sn-link-outer-l .myportal-link-outer {
      float: none;
  }
  /* G-01 カレンダー、SP表示設定*/
  .responsive-layout .table-responsive2 tr td .sn-sp-calendar {
      border: 1px solid #ccc;
      padding: 1px 5px;
      width: calc(100% - 50px) !important;
      font-size: 106.6%;
  }

  /*J-01 テーブル下のマージンをSP時のみ削除*/
  .responsive-layout .sn-sp-table-nobtmargin {
      margin-bottom: 0px !important; 
  }

  /*G-03　レスポンシブ画面文字先頭の文字を1文字左にずらして調整する用のタグ*/
  .responsive-layout .sn-sp-ml-1em {
      margin-left: 1em;
  }

  /**************** 定義済パラメータ（既存CSSに定義済み、再定義）*****************/
  /* パラメータが定義されているファイル名（myportal.main.css等） */

  /*add_main.css*/
  /* F-01,I-02... ラジオボタンSP画面での配置修正 */
  .responsive-layout .table-responsive tr td input[type="radio"] {
      margin-bottom: 0px;
  }

  /*add_main.css*/
  /*F-01 表上追加キャプション*/
  .responsive-layout .table-caption {
      display: block;
  }

  /* myportal.main.css */
  /* F-01 SP画面でアイコン形状を変更・受診日と横並べ */
  .responsive-layout .table.table-striped.table-hover.table-responsive2 tr td.myportal-table-icon-otoiawase {
      display: inline-block;
      width: 100px !important;
      border: 1px solid #ddd;
      border-radius: 5px;
      padding: 1px;
      margin: 15px 8px;
      background-color: white;
  }

  /* myportal.main.css */
  /* I-08 alert-info (青ｉマーク)配置変更 */
  .responsive-layout .alert.alert-info {
      background-position: center 13px;
      background-size: 50px;
      padding: 80px 6px 0 6px;
  }

  .responsive-layout .alert.alert-danger {
      background-position: center 13px;
      background-size: 50px;
      padding: 80px 6px 0 6px;
  }

  .responsive-layout .alert.alert-warning {
      background-position: center 13px;
      background-size: 50px;
      padding: 80px 6px 0 6px;
  }

  .responsive-layout .alert.alert-confirmation {
      background-position: center 13px;
      background-size: 50px;
      padding: 80px 6px 0 6px;
  }

  /* myportal.main.css */
  /* I-08 アラートボックス内の文言位置修正 */
  .responsive-layout .alert p {
      margin: 0px 10px 10px 10px;
  }
  /***************************** 新規定義パラメータ *****************************/
  /*G-01 SP時のみ左寄せ設定*/
  .responsive-layout .sn-number {
      text-align: left;
  }

  /*G-01 SP時ボタンの位置微調整*/
  .responsive-layout .sn-sp-rmargin10{
      margin-right: 10px;
  }
	.myportal-command-area #usestartbtn,
	.myportal-command-area #extsystemBackBtn{
		white-space: normal;
		height: auto;
	}
}


/* Command area */

@media screen and (max-width: 767px) {
  .responsive-layout .myportal-command-area.d04 {
      margin-top: 0;
      padding: 20px 0;
      border-top: 1px solid #d9d2bd;
  }
  .responsive-layout .myportal-command-area.d04 ul {
      height: auto;
      margin-top: 20px;
      padding: 0;
      border: none;
  }
  .responsive-layout .myportal-command-area.d04 ul:first-child {
      margin-top: 0;
  }
  .responsive-layout .myportal-command-area.d04 ul li {
      margin: 0;
  }
}

 /* 基本要素 */
.container {
	padding: 0;
}

a.myportal-link-area:link,
a.myportal-link-area:visited,
a.myportal-link-area:hover,
a.myportal-link-area:active,
a.myportal-link-area:focus {
	color: #333333;
	text-decoration: none;
	box-sizing: border-box;
}

 /* クリアフィックス */
 .clearfix {
	*zoom: 1;
}

.clearfix:after {
	content: "";
	clear: both;
	display: block;
}

.myportal-contents {
	padding: 0;
	margin: 0;
	width: 100%;
	min-width: 280px;
}

 /* コンテンツ */
.myportal-main-container,
.myportal-breadcrumb-container{
	width : -webkit-calc(100% - 245px) ;
	width : calc(100% - 245px) ;
	padding-left: 0px;
	padding-right: 0px;
}

.responsive .alert{
	margin-left: 0;
	margin-right: 0;
}
.responsive-layout tr.t-contents .btn{
  margin-left:0px;
}

.responsive-layout .table-responsive4 tr td{
  word-break: break-all;
}

@media screen and (max-width: 767px) {
/* 表示領域が767px以下の場合に適用するスタイル */
    .alert {
        padding: 10px 6px 0px 45px;
    }

    .alert.alert-info {
        background-position: 10px 9px;
        background-size: 25px;
    }

    .alert.alert-confirmation {
        background-position: 10px 9px;
        background-size: 25px;
    }

    .alert.alert-warning {
        background-position: 10px 10px;
        background-size: 25px;
    }

    .alert.alert-danger {
        background-position: 10px 9px;
        background-size: 25px;
    }

}


.responsive-layout .table-block {
    position: relative;
  }
  
  .responsive-layout .table-block .emphasis.newStyle {
    background: #ffd4ad;
    border-bottom: none;
    height: 39px;
    line-height: 39px;
    font-size: 142%;
    padding: 0 10px;
    margin-bottom: 30px;
  }
  
  .responsive-layout .table-block .btn-refresh2 {
    position: absolute;
    top: 7px;
    right: 10px;
  }
  
  .responsive-layout .cp_actab,
  .responsive-layout .cp_actab2 {
    width: 100%;
    display: none;
  }
  
  .responsive-layout .cp_actab h3 {
    margin: 0;
  }
  
  .responsive-layout .cp_actab .table {
    margin-bottom: 0;
  }
  
  .responsive-layout .acd-btn,
  .responsive-layout .acd-btn2 {
    text-decoration: underline;
    /* display: inline; */
    margin-top: 20px;
    margin-left: auto;
    /* width: 150px; */
    text-align: right;
    cursor: pointer;
    color: #006699;
  }
  
  .responsive-layout .acd-btn2:before {
    content: '';
    display: inline-block;
    width: 15px;
    height: 15px;
    background: url(../images/contents-link-icon-inner.png) no-repeat center/15px;
    vertical-align: -2px;
    margin-right: 3px;
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
  }
  
  .responsive-layout .acd-btn.is-open:before,
  .responsive-layout .acd-btn2.is-open:before {
    -webkit-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
            transform: rotate(270deg);
  }
  
  .responsive-layout .myportal-top-contents {
    min-width: auto;
    width: 100%;
    padding-left: 15px;
  }
  
  .responsive-layout .myportal-breadcrumb-container {
    width: 100%;
  }
  
  .responsive-layout .breadcrumb {
    padding-right: 15px;
    padding-left: 15px;
  }
  
  .responsive-layout .breadcrumb a {
    color: #006699;
  }
  
  .responsive-layout .textarea-0401 {
    max-width: 510px;
    width: 100%;
  }
  
  .responsive-layout .ui-dialog h1 {
    margin-bottom: 20px;
  }
  
  .responsive-layout .ui-dialog .nav-pills li {
    float: right;
  }
  
  .responsive-layout .table-responsive4 {
    table-layout: fixed;
  }
  
  .responsive-layout .table-responsive4 .styling td {
    width: 15px;
    border: none;
    height: 0;
    visibility: hidden;
    padding: 0;
  }
  
  .responsive-layout .table-responsive4 .styling td:nth-child(6) {
    width: 325px;
  }
  
  .responsive-layout .table-responsive4 .styling td:nth-child(7) {
    width: auto;
  }
  
  /* .responsive-layout .table-responsive4 tbody td {
    width: 15px;
  } */
  
  .responsive-layout .table-responsive4 td.t-styling-a {
    border:none;
    width:15px;
  }
  
  @media screen and (max-width: 767px) {
    .responsive-layout .height_100px {
      height: 100px!important;
    }
    .responsive-layout a {
      -webkit-tap-highlight-color: rgba(122, 122, 122, 0.4);
    }
    .responsive-layout a:hover {
      color: #006699;
    }
    .responsive-layout input[type=text],
    .responsive-layout input[type=date],
    .responsive-layout textarea,
    .responsive-layout select {
      -moz-appearance: none;
      -webkit-appearance: none;
      appearance: none;
      background-color: transparent;
      background-image: none;
      border-radius: 0;
      box-shadow: none;
    }
    .responsive-layout input[type=date] {
      line-height: 34px;
      height: 34px;
    }
    .responsive-layout input:disabled{
      background-color: rgba(239, 239, 239, 0.3);
      }    
    .responsive-layout .table-hover tbody > tr:nth-of-type(2n-1):hover {
      background-color: #FDF3DA;
    }
    .responsive-layout .table-hover tbody > tr:nth-of-type(2n):hover {
      background-color: #fff;
    }
    .responsive-layout .table-block {
      margin-bottom: 20px;
    }
    .responsive-layout .table-block .emphasis.newStyle {
      margin-left: -15px;
      margin-right: -15px;
      padding-left: 15px;
      font-size: 135%;
    }
    .responsive-layout .table-block .btn-refresh2 {
      position: static;
    }
    .responsive-layout .table-block .acd-table th:nth-child(2), .responsive-layout .table-block .acd-table th:nth-child(3), .responsive-layout .table-block .acd-table td:nth-child(2), .responsive-layout .table-block .acd-table td:nth-child(3) {
      width: 78px !important;
      display: none;
    }
    .responsive-layout .table-block .acd-table.is-open th:nth-child(2), .responsive-layout .table-block .acd-table.is-open th:nth-child(3), .responsive-layout .table-block .acd-table.is-open td:nth-child(2), .responsive-layout .table-block .acd-table.is-open td:nth-child(3) {
      display: table-cell;
    }
    .responsive-layout .table-block .acd-table.is-open .acd-btn-slide:after {
      display: none;
    }
    .responsive-layout .table-block .acd-table.is-open .acd-btn-slide:before {
      content: '';
      display: inline-block;
      width: 18px;
      height: 13px;
      background: url(../images/accodion-arrow.png) no-repeat 0/13.5px 13px;
      vertical-align: -1px;
    }
    .responsive-layout .table-block .acd-table .acd-btn-slide {
      display: inline-block;
      text-decoration: underline;
      color: #006699;
      cursor: pointer;
    }
    .responsive-layout .table-block .acd-table .acd-btn-slide:before {
      display: none;
    }
    .responsive-layout .table-block .acd-table .acd-btn-slide:after {
      content: '';
      display: inline-block;
      width: 18px;
      height: 13px;
      background: url(../images/accodion-arrow.png) no-repeat 0/13.5px 13px;
      vertical-align: -1px;
      -webkit-transform: scale(-1, 1);
          -ms-transform: scale(-1, 1);
              transform: scale(-1, 1);
    }
    .responsive-layout .table-block .table {
      margin-top: 20px;
      margin-bottom: 20px;
    }
    .responsive-layout .table-block .table tr th {
      font-weight: bold;
    }
    .responsive-layout .table-block .table td .btn-default {
      background: transparent;
      color: #006699;
      text-decoration: underline;
      border: none;
      box-shadow: none;
      font-size: 106.6%;
      height: auto;
      padding: 0;
    }
    .responsive-layout .table-block .table td .unsupport {
      background: #666;
      color: #fff;
      font-size: 110%;
      display: block;
      font-size: 100%;
      padding: 2px 0;
      text-align: center;
      box-sizing: border-box;
      border-radius: 4px;
      margin-bottom: 10px;
      width: 98px;
      height: 24px;
    }
    .responsive-layout .table-block .table td .mobile-btn {
      display: inline-block;
      padding: 6px 12px;
      background-color: #F4F2E8;
      background: -webkit-linear-gradient(#F9F9F4, #F4F2E8);
      background: linear-gradient(#F9F9F4, #F4F2E8);
      border: 1px solid #B8B39C;
      box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.4) inset, 1px 1px 2px #DDDDDD;
      border-radius: 6px;
      color: #333;
      text-decoration: none;
      -webkit-tap-highlight-color: rgba(122, 122, 122, 0);
      width: 100%;
      text-align: center;
      font-size: 120%;
      line-height: 32px;
      font-weight: normal;
    }
  }
  
  @media screen and (max-width: 767px) and (max-width: 374px) {
    .responsive-layout .table-block .table td .mobile-btn {
      font-size: 100%;
      letter-spacing: -0.3px;
    }
  }
  
  @media screen and (max-width: 767px) {
    .responsive-layout .table-block h3 {
      font-size: 135%;
      font-weight: bold;
      border-left: 6px solid #f5d654;
      height: 28px;
      line-height: 26px;
      background: none;
      padding-right: 8px;
    }
    .responsive-layout .btn {
      width: 100%;
      height: 46px;
      margin-left: 0;
      font-size: 120%;
    }
    .responsive-layout .nav-pills {
      width: 100%;
      margin-left: 0;
    }
    .responsive-layout .nav-pills li {
      width: 100%;
    }
    .responsive-layout .btn-refresh {
      width: 70px;
      height: 25px;
      background: transparent;
      border: none;
      cursor: pointer;
      outline: none;
      padding: 0;
      -webkit-appearance: none;
         -moz-appearance: none;
              appearance: none;
      box-shadow: none;
      font-size: 79%;
      color: #006699;
      text-decoration: underline;
      margin-top: 7px;
    }
    .responsive-layout .btn-refresh .glyphicon-refresh:before {
      width: 14px;
      height: 19px;
      background: transparent url(../images/icon-refresh.png) no-repeat 0 0/13.5px;
    }
    .responsive-layout .myportal-top-contents {
      margin: 0;
      padding-left: 0;
    }
    .responsive-layout .myportal-top-contents .breadcrumb {
      background: #e6e3dd;
      border-radius: 0;
      padding: 8px 15px;
      margin-top: 10px;
    }
    .responsive-layout .myportal-top-contents .breadcrumb li {
      padding-left: 0;
    }
    .responsive-layout .myportal-top-contents .breadcrumb li.myportal-icon-breadcrumbs-menu {
      background: none;
      padding-left: 0;
    }
    .responsive-layout .myportal-top-contents .breadcrumb li.myportal-icon-breadcrumbs-arrow {
      background: none;
    }
    .responsive-layout .myportal-top-contents .breadcrumb li.myportal-icon-breadcrumbs-arrow:before {
      content: '>';
      display: inline-block;
      color: #6e6d6d;
    }
    .responsive-layout .myportal-contents .myportal-section {
      margin-top: 10px;
    }
    .responsive-layout .page-title {
      margin-left: -15px;
      font-size: 135%;
      font-weight: bold;
      width: calc(100% + 30px);
    }
    .responsive-layout .lead-text {
      margin-left: 0;
    }
    .responsive-layout .lead-text li {
      margin-left: 0;
    }
    .responsive-layout h2 {
      font-size: 135%;
      font-weight: bold;
      /* padding-bottom: 10px;
      margin-bottom: 20px; */
    }
    .responsive-layout h2.myportal-refresh.emphasis.newStyle {
      margin-left: -15px;
      margin-right: -15px;
      padding: 0 15px;
      font-size: 135%;
    }
    .responsive-layout .table-responsive {
      border: 0;
      border-top: 1px solid #C5C0AF;
      margin-bottom: 20px;
    }
    .responsive-layout .table-responsive tr th {
      width: 100% !important;
      display: block;
      font-weight: bold;
      border-left: 1px solid #C5C0AF;
      border-right: 1px solid #C5C0AF;
      border-top: none;
      border-bottom: none;
    }
    .responsive-layout .table-responsive tr th label {
      font-weight: bold;
      margin-bottom: 0;
    }
    .responsive-layout .table-responsive tr td {
      width: 100%;
      display: block;
    }
    .responsive-layout .table-responsive tr td:after {
      content: '';
      display: block;
      clear: both;
    }
    .responsive-layout .table-responsive tr td label {
      width: 100%;
      display: block;
    }
    .responsive-layout .table-responsive tr td .form-control {
      width: 100% !important;
      border-radius: 0;
      margin-bottom: 10px;
      background: url(../images/icon-text-arrow.png) no-repeat 96% center/8.5px 7px #fff;
    }

    .responsive-layout .table-responsive tr td .myportal-datepicker {
      border: 1px solid #ccc;
      padding: 1px 5px;
      width: calc(100% - 50px);
      font-size: 106.6%;
    }
    .responsive-layout .table-responsive tr td .picker-style {
      padding: 6px 12px;
      border: 1px solid #ccc;
    }
    .responsive-layout .table-responsive tr td .picker-style[type=date] {
      width: calc(100% - 55px);
      vertical-align: 3px;
    }
    .responsive-layout .table-responsive tr td .picker-style[type=text] {
      width: calc(100% - 80px);
    }
    .responsive-layout .table-responsive tr td .myportal-link-outer {
      display: block;
      float: right;
    }
    .responsive-layout .table-responsive tr td .textarea-0401 {
      width: 100%;
      border: 1px solid #C5C0AF;
      height: 50px;
    }
    .responsive-layout .table-caption {
      background-color: #FCE78E;
      border: 1px solid #ccc;
      border-bottom: 0;
      padding: 8px;
      margin-top:15px;
      line-height: 1.42857143;
      font-weight: bold;
    }
    .responsive-layout .table-responsive2 {
      margin-top: 0;
      border: 0;
      border-top: 1px solid #C5C0AF;
    }
    .responsive-layout .table-responsive2 .thead {
      display: none;
    }
    .responsive-layout .table-responsive2 tbody {
      border: 1px solid #C5C0AF;
    }
    .responsive-layout .table-responsive2 tr {
      background: transparent;
      border-bottom: 1px solid #c5c0af;
    }
    .responsive-layout .table-responsive2 tr.t-contents{
      padding-right: 50px;
      display: block;
      position: relative;
    }
    .responsive-layout .table-responsive2 tr th {
      width: 100% !important;
      display: block;
      font-weight: bold;
      border-left: 1px solid #C5C0AF;
      border-right: 1px solid #C5C0AF;
      border-top: none;
      border-bottom: none;
    }
    .responsive-layout .table-responsive2 tr td {
      /* width: 100% !important; */
      display: block;
      border: none;
    }
    .responsive-layout .table-responsive2 tr td .btn-default {
      margin-bottom: 5px;
    }
    .responsive-layout .table-responsive2 tr td .btn-default.btn-result {
      margin-bottom: 0;
      font-size: 135%;
      line-height: 32px;
    }
    .responsive-layout .table-responsive2 tr td.cp_actab2 {
      display: none;
    }
    .responsive-layout .table-responsive2 tr td:before {
      display: block;
      width: 100%;
      font-weight: bold;
    }
    .responsive-layout .table-responsive2 tr td.myportal-nowrap:before {
      content: '代理関係者番号';
    }
    .responsive-layout .table-responsive2 tr td.myportal-break:before {
      content: '代理関係者名';
    }

    /* .responsive-layout .table-responsive2 tr td.confirmation_date:before {
      content: '確認日';
    } */
    .responsive-layout .table-responsive2 tr td.status a {
      text-decoration: underline;
    }
    .responsive-layout .table-responsive2 tr td.status {
      border: 1px solid #cccccc;
      background: #fff;
      margin: 5px 7px 5px 7px;
      padding: 3px 10px 3px 10px;
      border-radius: 5px;
      display: inline-block;
      font-size: 0.8rem;
    }
    .responsive-layout .table-responsive2 tr td.confirmation_date,
    .responsive-layout .table-responsive2 tr td.reqDtime{
      display: inline-block;
    }
    /* .responsive-layout .table-responsive2 tr td.status:before {
      content: '状況';
    } */
    .responsive-layout .table-responsive2a tr td.condition:before {
      content: '【指定検索条件】';
      display: block;
      font-weight: bold;
    }
    
    .responsive-layout .table-responsive2a tr td.confirmer:before {
      content: '【確認者】';
      display: block;
      font-weight: bold;
    }
    .responsive-layout .table-responsive2 tr td.period:before {
      content: '対象期間';
    }
    .responsive-layout .table-responsive2 tr td.claimantName:before {
      content: '要求者';
    }

    .responsive-layout .table-responsive2 tr td.myportal-label {
      align-items: center;
      border-left: 1px solid #C5C0AF;
      border-bottom: none;
      bottom: 0;
      display: flex;
      justify-content: center;
      right: 0;
      padding: 0;
      position: absolute;
      text-align: center;
      top: 0;
      width: 50px;
    }
    .responsive-layout .table-responsive2 tr td.myportal-label label {
      text-align: left;
    }
    /* .responsive-layout .table-responsive2 tr td.myportal-label label:after {
      content: '削除';
    } */
    .responsive-layout .table-responsive2a tr td.particular:before {
      content: '【特定個人情報等】';
      display: block;
      font-weight: bold;
    }
    .responsive-layout .table-responsive2a tr td.administrative_area:before {
      content: '【行政機関等】';
      display: block;
      font-weight: bold;
    }
    .responsive-layout .table-responsive2a tr td.target_date:before {
      content: '【確認対象日】';
      display: block;
      font-weight: bold;
    }
    .responsive-layout .table-responsive2 tr td .acd-btn2 {
      margin-top: 0;
    }
    .responsive-layout .table-responsive2.d03 tr.is-open .target_date,
    .responsive-layout .table-responsive2.d03 tr.is-open .confirmer{
      display: block;
    }
    .responsive-layout .table-responsive2 + .myportal-action {
      margin-top: -20px;
      margin-bottom: 20px;
    }
    .responsive-layout .table-responsive3 {
      margin-top: 0;
      border: 0;
      border-top: 1px solid #C5C0AF;
    }
    .responsive-layout .table-responsive3 .thead {
      display: none !important;
    }
    .responsive-layout .table-responsive3 tbody {
      border: 1px solid #C5C0AF;
    }
    .responsive-layout .table-responsive3 tr {
      background: transparent;
      border-bottom: 1px solid #c5c0af;
    }
    .responsive-layout .table-responsive3 tr td {
      width: 100% !important;
      display: block;
      border: none;
      padding-bottom: 15px;
    }
    .responsive-layout .table-responsive3 tr td:first-child {
      background: #fce78e;
      border-bottom: 1px solid #C5C0AF;
      font-weight: bold;
      font-size: 106.6%;
      padding-bottom: 8px;
    }
    .responsive-layout .table-responsive3 tr td .mobile-btn {
      min-height: 46px !important;
      font-size: 120% !important;
    }
    .responsive-layout .table-responsive3 tr td.button-middle {
      padding-top: 0;
      text-align: center !important;
    }
    .responsive-layout .table-responsive4 td.t-styling-a {
      width: 0px;
      padding: 0;
    }
    .responsive-layout .table-responsive4 td.t-styling-b {
      width: auto!important;
      padding: 0;
    }
    .responsive-layout .table-responsive4 .table-style td:nth-last-child(1) {
      width: 98px;
      padding: 0;
    }
    .responsive-layout .table-responsive4 tr th {
      font-weight: bold;
      padding: 8px;
    }
    .responsive-layout .table-responsive4 tr td {
      padding: 8px 10px;
      word-break: break-all;
    }
    /* .responsive-layout .table-responsive4 tr td[colspan="6"], .responsive-layout .table-responsive4 tr td[colspan="5"] {
      font-weight: bold;
    } */
    .responsive-layout .table-responsive4 tr.row-lv1 {
      background: #ffd330;
    }
    .responsive-layout .table-responsive4 tr.row-lv1 td {
      font-weight: bold;
    }
    .responsive-layout .table-responsive4 tr.row-lv1 td:before {
      content: '';
      display: inline-block;
      width: 4px;
      height: 18px;
      background: #ff6400;
      vertical-align: -3px;
      margin-right: 5px;
    }
    .responsive-layout .table-responsive4 tr.row-lv2 {
      background: #fcf0c7;
    }
    .responsive-layout .table-responsive4 tr.row-lv2 td[colspan="3"],
    .responsive-layout .table-responsive4 tr.row-lv2 td[colspan="4"],
    .responsive-layout .table-responsive4 tr.row-lv2 td[colspan="6"]{
      font-weight: bold;
    }
    .responsive-layout .table-responsive4 tr.row-lv3 td[colspan="4"]{
      font-weight: bold;
    }
    .responsive-layout .table-responsive4 tr.row-lv4 td[colspan="2"]{
      padding-left: 27px;
    }
    .responsive-layout .table-responsive4 tr.row-lv3 td[colspan="6"] {
      padding-left: 10px;
    }
    .responsive-layout .table-responsive4 tr.row-lv4 td[colspan="4"] {
      padding-left: 27px;
    }
    .responsive-layout .table-responsive4 tr.row-lv5 td[colspan="5"] {
      padding-left: 27px;
    }
    .responsive-layout .table-responsive4 tr.row-lv6 td[colspan="3"] {
      padding-left: 43px;
    }
    .responsive-layout .table-responsive4 tr.row-lv7 td[colspan="4"] {
      padding-left: 43px;
      font-weight: bold;
    }
    .responsive-layout .table-responsive4 tr.row-lv8 td[colspan="2"] {
      padding-left: 59px;
    }


    .responsive-layout .table-responsive4 tr.row-lv4 .responsive_indent,
    .responsive-layout .table-responsive4 tr.row-lv5 .responsive_indent{
      padding-left: 27px;
    }
    .responsive-layout .table-responsive4 tr.row-lv6 .responsive_indent,
    .responsive-layout .table-responsive4 tr.row-lv7 .responsive_indent{
      padding-left: 43px;
    }
    .responsive-layout .table-responsive4 tr.row-lv8 .responsive_indent,
    .responsive-layout .table-responsive4 tr.row-lv9 .responsive_indent{
      padding-left: 59px;
    }
    .responsive-layout .table-responsive4 tr.row-lv10 .responsive_indent,
    .responsive-layout .table-responsive4 tr.row-lv11 .responsive_indent{
      padding-left: 75px;
    }
    .responsive-layout .table-responsive4 tr.row-lv12 .responsive_indent,
    .responsive-layout .table-responsive4 tr.row-lv13 .responsive_indent{
      padding-left: 91px;
    }    
    .responsive-layout .table-responsive4 tr.row-lv1 .responsive_indent,
    .responsive-layout .table-responsive4 tr.row-lv2 .responsive_indent,
    .responsive-layout .table-responsive4 tr.row-lv3 .responsive_indent,        
    .responsive-layout .table-responsive4 tr.row-lv5 .responsive_indent,
    .responsive-layout .table-responsive4 tr.row-lv7 .responsive_indent,
    .responsive-layout .table-responsive4 tr.row-lv9 .responsive_indent,
    .responsive-layout .table-responsive4 tr.row-lv11 .responsive_indent{
      font-weight: bold;
    }

    .responsive-layout .myportal-command-area {
      height: auto;
      margin-bottom: 0;
    }
    .responsive-layout .myportal-command-area.d01 {
      padding-top: 20px;
    }
    .responsive-layout .myportal-command-area.d03 {
      border-top: none;
    }
    .responsive-layout .myportal-command-area.k01 {
      padding-top: 20px;
    }
    .responsive-layout .myportal-command-area .pull-right {
      margin-top: 0;
      margin-right: 0;
      float: none !important;
      height: 66px;
    }
    .responsive-layout .myportal-command-area .pull-left {
      float: none !important;
      margin-right: 0;
    }
    .responsive-layout .myportal-command-area ul li {
      float: none;
      margin-right: 0;
      margin-left: 0;
      margin-bottom: auto;
      height: 46px;
    }
    .responsive-layout .myportal-command-area .btn-download {
      background-color: #E0E783;
      background: -webkit-linear-gradient(#E5EB99, #D6DF5B);
      background: linear-gradient(#E5EB99, #D6DF5B);
      border-color: #E0E783;
      color: #333;
      text-shadow: 1px 1px 2px #FFF, 0px 0px 2px #FFF, -1px -1px 2px #FFF;
      font-size: 120%;
    }
    .responsive-layout .ui-widget-overlay {
      background: #000;
    }
    .responsive-layout .ui-dialog {
      width: calc(100% - 30px) !important;
      left: 15px !important;
      border-radius: 0;
      border: none;
      padding: 0;
      margin-bottom: 20px;
    }
    .responsive-layout .ui-dialog .alert.alert-confirmation {
      background-position: 50% 10px;
      background-size: 40px;
      padding: 65px 10px 0;
    }
    .responsive-layout .ui-dialog .ui-corner-all {
      border-radius: 0;
    }
    .responsive-layout .ui-dialog .alert-confirmation {
      margin: 0;
    }
    .responsive-layout .ui-dialog h1 + .alert-confirmation {
      margin-top: 20px;
    }
    .responsive-layout .ui-dialog .myportal-command-area {
      border-top: none;
    }
    .responsive-layout .ui-dialog .myportal-command-area .pull-right:after {
      border-bottom: none;
    }
    .responsive-layout .ui-dialog .nav-pills {
      margin-top: 0;
      margin-right: 0;
    }
    .responsive-layout .ui-dialog .nav-pills li {
      margin-left: 0;
      margin-bottom: 15px;
    }
    .responsive-layout .ui-datepicker {
      width: calc(100% - 30px);
      left: 15px !important;
      box-shadow: 0px 4px 1px #999;
    }
    .responsive-layout .ui-datepicker select.ui-datepicker-month,
    .responsive-layout .ui-datepicker select.ui-datepicker-year {
      background: url(../images/icon-text-arrow.png) no-repeat 90% center/8.5px 7px #fff;
      padding: 0 5px;
      border: 1px solid #ccc;
      height: 25px;
      font-weight: normal;
      line-height: 1;
    }
    .responsive-layout .ui-datepicker select.ui-datepicker-month {
      margin-left: 5px;
    }
    .responsive-layout .ui-datepicker select.ui-datepicker-year {
      margin-right: 5px;
    }
    .responsive-layout .ui-datepicker th {
      font-size: 126%;
    }
    .responsive-layout .ui-datepicker .ui-datepicker-prev {
      top: 6px;
      left: 5px;
    }
    .responsive-layout .ui-datepicker .ui-datepicker-next {
      top: 6px;
      right: 5px;
    }
    .responsive-layout .ui-datepicker .ui-datepicker-prev span,
    .responsive-layout .ui-datepicker .ui-datepicker-next span {
      width: 18px;
      height: 18px;
      background: url(../images/datepicker-arrow.png) no-repeat 0 0/18px;
    }
    .responsive-layout .ui-datepicker .ui-datepicker-prev span {
      -webkit-transform: rotate(180deg);
          -ms-transform: rotate(180deg);
              transform: rotate(180deg);
    }
    .responsive-layout .ui-datepicker .ui-datepicker td {
      padding: 2px;
    }
    .responsive-layout .ui-state-default,
    .responsive-layout .ui-widget-content .ui-state-default {
      background: #fff;
      padding: 8px 6px;
      font-size: 126%;
      font-weight: normal;
    }
    .responsive-layout .ui-state-highlight,
    .responsive-layout .ui-widget-content .ui-state-highlight {
      background: #fdf5ce;
    }
    .responsive-layout .ui-widget-content .ui-widget-header {
      height: 40px;
      padding: 6px 0;
      box-sizing: border-box;
      background: #f6db5e;
    }
    .responsive-layout ul.button-margin {
      height: auto!important;
      margin-right: auto;
    }
    .responsive-layout .nav .button-margin {
      height: auto!important;
      padding-bottom: 20px;
      margin-bottom: auto;
    }
    .myportal-command-area{
      padding: 20px 0;
    }
  }