/*
Theme Name: olp_ver2
Author: olp_ver2
Description: olp_ver2
Version: 2.0.0
Text Domain: olp_ver2
*/

/*************** ADD YOUR CUSTOM CSS HERE  ***************/

.bypostauthor {
    display: block;
}

/* ヘッダーパディング */
@media (max-width: 991px) {
    #header .header-main .header-left, #header .header-main .header-center, #header .header-main .header-right, .fixed-header #header .header-main .header-left, .fixed-header #header .header-main .header-right, .fixed-header #header .header-main .header-center, .header-builder-p .header-main:not(.e-con) {
        padding-top: 0px;
        padding-bottom: 0px;
    }
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc {
  display: block !important;
}

.sp {
  display: none !important;
}

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
  .pc {
    display: none !important;
  }

  .sp {
    display: block !important;
  }
}

/* 登録フォーム human非表示 */
p.um_request_name {
	display:none;
}

.um a.um-button, .um a.um-button.um-disabled:active, .um a.um-button.um-disabled:focus, .um a.um-button.um-disabled:hover, .um input[type=submit].um-button, .um input[type=submit].um-button:focus {
    background: #0e5fa6;
}

.um a.um-button:hover, 
.um input[type=submit].um-button:hover {
	background: #0e5fa6;
	color:#FFFFFF;
	opacity: 0.7;
}

/* 仮登録時のテキスト */
.um-postmessage {
	color:#333333;
}

/* フッター */
#footer .footer-bottom .widget_nav_menu ul li {
font-size:16px;
}

/* マイページ　ステップバー */
.progressbar {
  display: flex;
  flex-wrap: wrap;
}
.progressbar .item {
    position: relative;
    width: 25%;
    text-align: center;
    position: relative;
    align-items: center;
    justify-content: center;
    padding: 13px 0;
    line-height: 1.5;
    background: #F5F5F5;
    color: #999999;
}
.progressbar .item:not(:last-child)::before,
.progressbar .item:not(:last-child)::after {
    position: absolute;
    z-index: 2;
    top: 0;
    bottom: 0;
    left: 100%;
    content: '';
    border: 37px solid transparent;
    border-left: 20px solid #F5F5F5;
    margin: auto;
}
.progressbar .item:not(:last-child)::before {
    margin-left: 1px;
    border-left-color: #FFF;
}

@media screen and (max-width: 767px) {
.progressbar .item {
    font-size: 11px;
    line-height: 1.4;
    padding: 10px 0;
}
.progressbar .item:not(:last-child)::before,
.progressbar .item:not(:last-child)::after {
    border-width: 25px;
    border-left-width: 12px;
}
}

/* active */
.progressbar .item.active {
    z-index: 1;
    background: #a6540d;
    color: #FFF;
}
.progressbar .item.active:not(:last-child)::after {
    border-left-color: #a6540d;
}
.progressbar .item.active:not(:last-child)::before {
    border-left: none;
}

/* 見出し1 */
.heading-41 {
    display: flex;
    align-items: center;
    padding: .5em .7em;
    background-color: #ebf5ff;
    color: #333333;
}

.heading-41::before {
    display: inline-block;
    width: 5px;
    height: 1.5em;
    margin-right: .5em;
    background-color: #0e5fa6;
    content: '';
}

/* 見出し */
.heading-2 {
    padding:0 .4em .2em;
    border-bottom: 3px solid #0e5fa6;
    background-color: #ffffff;
    color: #333333;
}

/* ラジオボタン */


/* ボタン次へ */
.button-next {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 300px;
  margin: 0 auto;
  padding: .9em 2em;
  border: 1px solid #A6540D;
  border-radius: 5px;
  background-color: #fff;
  color: #A6540D;
  font-size: 1em;
  text-decoration: none;
}

.button-next:hover,
.button-next:focus,
.button-next:active {
  border: 1px solid #A6540D;
  background-color: #A6540D;
  color: #fff;  /* ホバー・フォーカス・クリック時は白 */
}

/* 矢印の色調整 */
.button-next::after {
  transform: rotate(45deg);
  width: 5px;
  height: 5px;
  margin-left: 10px;
  border-top: 2px solid #A6540D;
  border-right: 2px solid #A6540D;
  content: '';
}

.button-next:hover::after,
.button-next:focus::after,
.button-next:active::after {
  border-color: #fff;
}


a.button-next:focus {
  color: #fff;
}

/* ボタン前へ */
.btn-glay {
    color: rgb(255, 255, 255);
    background-color: #6c757d;
    border-color: #6c757d;
}
.btn-glay:hover {
	color:#FFFFFF;
    background-color: #777777;
}

/* ボタンPDFダウンロード */
.button-DL {
    width: 250px;
    margin: 0 auto;
    padding: .9em 2em;
    border: 1px solid #0e5fa6;
    border-radius: 5px;
    background-color: #fff;
    color: #008838;
    font-size: 1em;
}

.button-DL:hover {
    border: none;
    background-color: #0e5fa6;
    color: #fff;
    font-weight: 600;
}

/* ボタン変更承認申請 */
.button-henko {
    width: 300px;
    margin: 0 auto;
    padding: .6em 2em;
    border: 1px solid #f06060;
    border-radius: 5px;
    background-color: #fff;
    color: #f06060;
    font-size: 1em;
}

.button-henko:hover {
    border: none;
    background-color: #f06060;
    color: #fff;
    font-weight: 600;
}

.button-henko:active,
.button-henko:focus {
    color: #fff;
}

/* カレンダー選択後 */
.input-daterange input {
    text-align: left!important;
}

/* テーブル */
.tbl01 th {
    background-color: #FCFCFC; /* 背景色を青に設定 */
    color: #333333;
}
.tbl01 {
    color: #333333;
}
/* ファイルアップロードプレビュー */
.imagePreview {
    width: 100%;
    height: 180px;
    background-position: left center;
    background-size: contain; /* cover から contain に変更 */
    background-repeat: no-repeat; /* 繰り返しを防ぐ */
    background-color: #f0f0f0; /* 余白ができる場合に背景色を追加 */
    -webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, .3);
    display: inline-block;
}

/* 注意テキストボックス */
.box-001 {
    max-width: 100%;
    border: 2px solid #f06060;
    border-radius: 5px;
    color: #333333;
}

.box-001 div {
    display: inline-flex;
    align-items: center;
    column-gap: 4px;
    position: relative;
    top: -13px;
    left: 10px;
    margin: 0 7px;
    padding: 0 8px;
    background: #FFFFFF;
    color: #f06060;
    font-weight: 600;
    vertical-align: top;
}

.box-001 div::before {
    width: 22px;
    height: 22px;
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.8659 3.00017L22.3922 19.5002C22.6684 19.9785 22.5045 20.5901 22.0262 20.8662C21.8742 20.954 21.7017 21.0002 21.5262 21.0002H2.47363C1.92135 21.0002 1.47363 20.5525 1.47363 20.0002C1.47363 19.8246 1.51984 19.6522 1.60761 19.5002L11.1339 3.00017C11.41 2.52187 12.0216 2.358 12.4999 2.63414C12.6519 2.72191 12.7782 2.84815 12.8659 3.00017ZM10.9999 16.0002V18.0002H12.9999V16.0002H10.9999ZM10.9999 9.00017V14.0002H12.9999V9.00017H10.9999Z' fill='%23f06060'%3E%3C/path%3E%3C/svg%3E");
}

.box-001 p {
    margin: 0;
    padding: 0 1.5em 1em;
}

/* 通知書テキストボックス */
.box-002 {
    max-width: 100%;
    margin: 0 auto;
    border: 2px solid #0e5fa6;
    border-radius: 5px;
    color: #333333;
}

.box-002 div {
    display: inline-flex;
    align-items: center;
    column-gap: 4px;
    position: relative;
    top: -13px;
    left: 10px;
    margin: 0 7px;
    padding: 0 8px;
    background: #F5F8FB;
    color: #0e5fa6;
    font-weight: 600;
    vertical-align: top;
}

.box-002 div::before {
    width: 15px;
    height: 7.5px;
    border-bottom: 3px solid #0e5fa6;
    border-left: 3px solid #0e5fa6;
    transform: rotate(-45deg) translate(2px, -2px);
    content: '';
}

.box-002 p {
    margin: 0;
    padding: 0 1.5em 1em;
}


/* スマホ調整 */
.container-fluid .e-parent.e-con {
    --padding-inline-start: calc(var(--porto-fluid-spacing)* 0);
    --padding-inline-end: calc(var(--porto-fluid-spacing)* 0);
}

/* フォームのフォント16px */
/* フォーム全体のフォントサイズを統一 */
.form-control, input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea {
    font-size: 16px;
	color: #333333;
}

/* よくある質問 */
.qa-8 dt {
    margin-bottom: 1em;
    color: #333333;
    font-weight: 600;
}

.qa-8 dt::before,
.qa-8 dd::before {
    margin-right: .4em;
}

.qa-8 dt::before {
    content: "Q.";
}

.qa-8 dd {
    margin: 0 0 2.5em;
    padding: 1em 1.5em;
    background-color: #ebf5ff;
    color: #333333;
}

.qa-8 dd::before {
    content: "A.";
}

/* billed_amount　確定請求額 */
.billed_amount {
  position: relative;
  text-align: center;
  color: #0e5fa6;
  background: #EBF5FF;
}

/* billed_amount01　①合計 */
.billed_amount {
  position: relative;
  color: #0e5fa6;
}

/* Ajax */
#loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.loading-content {
  text-align: center;
  color: #fff;
}

.spinner {
  border: 8px solid #f3f3f3;
  border-top: 8px solid #3498db;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  margin: 0 auto 20px auto;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* 必須ラベル */
.badge-danger {
    color: #fff;
    background-color: #dc3545;
}

.badge {
    padding: .25em .4em;
}

/* 非表示 */
.nodisplay {
	display:none;
}

/* リセットボタン */
.btn-outline-secondary {
    color: #333333;
    border-color: #333333;
}
.btn-outline-secondary:hover {
    color: #fff;
    background-color: #333333;
    border-color: #333333;
}

/* chat 初期 */
.no-messages {
    text-align: center;
    color: #888;
    font-size: 1rem;
    padding: 2em 1em;
    font-style: italic;
    background-color: #f9f9f9;
    border-radius: 10px;
    margin: 1em auto;
    max-width: 80%;
}

/* 役員名簿ダウンロードボタン */
.download-btn {
	color:#016E38;
	border: 1px solid #016E38;
    border-radius: 5px;
}

.download-btn:hover {
    background-color: #016E38;
    color: #fff;
}

.download-btn:active,
.download-btn:focus {
    color: #fff;
}

/* チェックボックス */
.checkbox-3 {
    border: none;
}

.checkbox-3 label {
    display: flex;
    align-items: center;
    max-width: 500px;
    gap: 0 .5em;
    position: relative;
    margin-bottom: .4em;
    padding: .5em .7em;
    border: 1px solid #0e5fa6;
    border-radius: 3px;
    background-color: #0e5fa626;
    cursor: pointer;
}

.checkbox-3 label:has(:checked) {
    background-color: #0e5fa6;
    color: #fff;
}

.checkbox-3 label::before {
    width: 14px;
    height: 14px;
    border-radius: 1px;
    background-color: #fff;
    content: '';
}

.checkbox-3 label:has(:checked)::after {
    position: absolute;
    top: 14px;
    left: 15px;
    transform: rotate(45deg);
    width: 4px;
    height: 8px;
    border: solid #0e5fa6;
    border-width: 0 2px 2px 0;
    content: '';
}
.checkbox-3 input {
    display: none;
}

/* テーブル */
.tbl01 {
  border-collapse: collapse;
  /* width: 100%; */
  width: 1082px;
  margin: 1em auto;
}

.tbl01 th, .tbl01 td {
  padding: 0.5em 2%;
 border: 1px solid #ebebeb;
  vertical-align: top;
  text-align: left;
	font-weight:normal;
}

.tbl01 th {
 background: #efefef82;
}

.tbl01 td {
  background: #fff;
}
.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
}
/* 申請ページ　テーブル調整 */
/* 設備名列：セレクトボックスが切れないように十分な幅 */
.tbl01 td:nth-child(1),
.tbl01 th:nth-child(1) {
width: 350px;
/* 適宜調整可能 */
}

.tbl01 td:nth-child(2),
.tbl01 th:nth-child(2) {
width: 400px;
/* 適宜調整可能 */
}
.tbl01 td:nth-child(3),
.tbl01 th:nth-child(3) {
width: 200px;
/* 適宜調整可能 */
}

.tbl02 {
  border-collapse: collapse;
  width: 100%;
  margin: 1em auto;
}

.tbl02 th, .tbl02 td {
  padding: 0.5em 2%;
 border: 1px solid #ebebeb;
  vertical-align: top;
  text-align: left;
	font-weight:normal;
}

.tbl02 th {
 background: #efefef82;
  white-space: nowrap;
  width: auto;
  color:#333;
  font-weight:600;
}

.tbl02 td {
  background: #0e5fa6;
  color:#fff;
  font-weight:600;
  font-size:1.2rem;
}

@media only screen and (max-width:480px) {
  .tbl02 th, .tbl02 td {
    display: block;
    width: auto;
    border-bottom: none;
  }

  .tbl02 tr:last-child {
   border-bottom: 1px solid #ebebeb;
  }
}
/* アラート */
.box-004,
.box-008 {
  display: none;
  grid-gap: 0 .7em;
  margin: 1em auto;
  padding: 1em;
  border-radius: 5px;
  color: #333333;
}

.box-004 {
    display: flex;
    grid-gap: 0 .7em;
  margin: 1em auto;
    padding: 1em;
    border-radius: 5px;
    background-color: #ffebee;
    color: #333333;
}

.box-004::before {
    width: 24px;
    height: 24px;
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.8659 3.00017L22.3922 19.5002C22.6684 19.9785 22.5045 20.5901 22.0262 20.8662C21.8742 20.954 21.7017 21.0002 21.5262 21.0002H2.47363C1.92135 21.0002 1.47363 20.5525 1.47363 20.0002C1.47363 19.8246 1.51984 19.6522 1.60761 19.5002L11.1339 3.00017C11.41 2.52187 12.0216 2.358 12.4999 2.63414C12.6519 2.72191 12.7782 2.84815 12.8659 3.00017ZM10.9999 16.0002V18.0002H12.9999V16.0002H10.9999ZM10.9999 9.00017V14.0002H12.9999V9.00017H10.9999Z' fill='%23f06060'%3E%3C/path%3E%3C/svg%3E");
}

.box-004 p {
    margin: 0;
    padding: 0 0 0 .7em;
    border-left: 1px solid #f06060;
}

.box-008 {
    display: flex;
    align-items: center;
    grid-gap: 0 .7em;
  margin: 1em auto;
    padding: 1em;
    border-radius: 5px;
    background-color: #ecffe9;
    color: #333333;
}

.box-008::before {
    width: 16px;
    height: 8px;
    border-bottom: 3px solid #86d67c;
    border-left: 3px solid #86d67c;
    transform: rotate(-45deg) translate(2.5px, -2.5px);
    content: '';
}

.box-008 p {
    margin: 0;
    padding: 0 0 0 .7em;
    border-left: 1px solid #86d67c;
}

/* 申請額check欄 */
.box-017 {
    max-width: 100%;
    margin: 0 auto;
    padding: .5em 1.5em 1em;
    border: 1px solid #9e9e9e;
}

.box-017 > div {
    margin-bottom: .5em;
    color: #0e5fa6;
    font-weight: 600;
}

/* ボタン */
.border_btn01 {
  display: inline-block;
  width: 100%;
  max-width: 250px; /* ボタン幅 */
  color: #0e5fa6; /* 文字色 */
  border: 1px solid #0e5fa6; /* 線幅・種類・色 */
  background: #fff; /* 背景色 */
  padding: 1em 2em;
  text-decoration: none;
  text-align: center;
  transition: 0.3s;
}

/* マウスオーバーした際のデザイン */
.border_btn01:hover {
  color: #fff; /* 文字色 */
  background: #0e5fa6; /* 背景色 */
}

/* 同意チェックボックス */
.checkbox-33 {
    border: none;
}

.checkbox-33 label {
    display: flex;
    align-items: center;
    max-width: 300px!important;
    gap: 0 .5em;
    position: relative;
    margin-bottom: .4em;
    padding: .5em .7em;
    border: 1px solid #0e5fa6;
    border-radius: 3px;
    background-color: #0e5fa626;
    cursor: pointer;
}

.checkbox-33 label:has(:checked) {
    background-color: #0e5fa6;
    color: #fff;
}

.checkbox-33 label::before {
    width: 14px;
    height: 14px;
    border-radius: 1px;
    background-color: #fff;
    content: '';
}

.checkbox-33 label:has(:checked)::after {
    position: absolute;
    top: 14px;
    left: 15px;
    transform: rotate(45deg);
    width: 4px;
    height: 8px;
    border: solid #0e5fa6;
    border-width: 0 2px 2px 0;
    content: '';
}

.checkbox-33 input {
    display: none;
}

/* リンクアンダーライン */
.link_underline {
      text-decoration:underline;
}

/* リスト */
.list-3 {
    list-style-type: none;
}

.list-3 li {
    display: flex;
    align-items: center;
    gap: 0 5px;
    padding: .3em;
}

.list-3 li::before {
    display: inline-block;
    width: 10px;
    height: 5px;
    border-bottom: 2px solid #0e5fa6;
    border-left: 2px solid #0e5fa6;
    transform: rotate(-45deg) translateY(-1.5px);
    content: '';
}

/* チェックボックス 同意 */
.checkbox-333 {
    border: none;
}

.checkbox-333 label {
    display: flex;
    align-items: center;
    max-width: 200px;
    gap: 0 .5em;
    position: relative;
    margin-bottom: .4em;
    padding: .5em .7em;
    border: 1px solid #0e5fa6;
    border-radius: 3px;
    background-color: #0e5fa626;
    cursor: pointer;
}

.checkbox-333 label:has(:checked) {
    background-color: #0e5fa6;
    color: #fff;
}

.checkbox-333 label::before {
    width: 14px;
    height: 14px;
    border-radius: 1px;
    background-color: #fff;
    content: '';
}

.checkbox-333 label:has(:checked)::after {
    position: absolute;
    top: 14px;
    left: 15px;
    transform: rotate(45deg);
    width: 4px;
    height: 8px;
    border: solid #0e5fa6;
    border-width: 0 2px 2px 0;
    content: '';
}
.checkbox-333 input {
    display: none;
}

.footer-bottom > .container {
    padding: 0 2px;
    text-align: center;
}

.footer-right {
    float: none; /* もしfloatされていたら */
    display: inline-block;
}