@charset "utf-8";

/* 全般ーーーーーーーーーーーーーーーーーー*/
* {
  font-size: 12px !important;
}
.pc-show {
  display: none;
}

.sp-show {
  display: block;
}

/* 共通 */

.table-scroll {
  overflow: scroll;
  display: block;
}

.sp-w-100 {
  width: 100% !important;
}

.sp-50-box-container .og-box-style {
  width: 48% !important;
  padding: 10px 10px !important;
  height: 90px;
  font-size: 15px !important;
}

/* margin */

.sp-mt-10 {
  margin-top: 0.25rem !important;
}

.sp-mt-20 {
  margin-top: 0.5rem !important;
}

.sp-mt-30 {
  margin-top: 1rem !important;
}

.sp-mt-40 {
  margin-top: 1.5rem !important;
}

.sp-mt-50 {
  margin-top: 3rem !important;
}

.sp-100-box-container .col-4,
.sp-100-box-container .col-7,
.sp-100-box-container .col-1,
.sp-100-box-container .col-6,
.sp-100-box-container .col-5,
.sp-100-box-container .col-3,
.sp-100-box-container .col-8 {
  width: 100%;
}

.sp-50-box-container .col-4,
.sp-50-box-container .col-7,
.sp-50-box-container .col-1,
.sp-50-box-container .col-6,
.sp-50-box-container .col-3,
.sp-50-box-container .col-5 {
  width: 50%;
}

.sp-p-0 {
  padding: 0px !important;
}
.sp-p-right-0 {
  padding-right: 0px !important;
}

/* ヘッダーーーーーーーーーーーーーーーーー */

#header-area {
  min-height: 40px;
  padding-right: 5px;
}

#header-area .contents {
  padding: 5px;
}

/* ヘッダーのprofileアイコン */

#header-area .profile-icon {
  width: 25px;
  height: 25px;
}

#hamburger-menu img {
  width: 25px;
}

/* パンくずエリア */

#pankuzu_container {
  margin-left: 0px;
}

#pankuzu_container .pankuzu_box .item {
  font-size: 11px;
  line-height: 1.4;
  padding: 5px 0;
  width: 100px;
}

#pankuzu_container .pankuzu_box .item.active {
  width: 150px;
}

#pankuzu_container.pankuzu_box .item:not(:last-child)::before,
#pankuzu_container .pankuzu_box .item:not(:last-child)::after {
  border: 15px solid transparent;
  border-left: 10px solid #fbfafd;
  border-width: 13px;
  border-left-width: 11px;
}

/* ログインーーーーーーーーーーーーーーーー */

#login .page-size {
  padding: 100px 0;
  max-width: 350px;
}

/* サイドバーーーーーーーーーーーーーーーーー */

#side-area {
  display: none;
  width: 300px;
  top: 40px;
  padding-top: 20px;
}

#side-area .scroll-area {
  padding-top: 10px;
}

#side-togle {
  display: none;
}

#side-area .sp-side-logo {
  width: 130px;
  display: block;
  margin: 0 auto;
}

/* 右サイドバーー－－－－－－－－－－－－－－ */

/* 初期状態は非表示 */

#side-right-area {
  display: none;
  width: 300px;
  position: fixed;
  top: 0;
  right: 0;
  overflow-y: scroll;
  overflow-x: auto;
  height: 100%;
  z-index: 800;
  padding: 60px 8px 100px 8px !important;
}

#side-right-area .scroll-area {
  padding: 0px !important;
}
#side-right-area.side-open {
  display: block;
}
#side-right-area .row {
  width: 100%;
  margin: 0;
}
/* コンテンツーーーーーーーーーーーーーーーー */

#contents-area {
  margin-left: 0px;
  padding: 10px 10px;
  margin-top: 45px;
}

/* TOP */

#front .sp-100-box-container {
  padding: 1em;
}

#front
/* profile */

.bg-profile-img {
  height: 120px;
}

.profile-img-box {
  bottom: -30px;
  left: 20px;
}

.profile-img-box .profile-img {
  width: 80px;
  height: 80px;
}

.profile-img-box .profile-camera {
  width: 25px;
  bottom: -6px;
  left: 72px;
}

#front .info-container {
  margin-top: 40px;
}

/* テーブル***************** */

.sp-table-block td {
  width: 100%;
  display: block;
}

/* 検索***************** */

.search-area .col-3,
.col-9 {
  width: 100% !important;
  padding: 0px !important;
}

.search-area .search-box {
  padding: 5px;
}
.search-area .search-box .container {
  padding: 15px !important;
}
/* 地図***************** */

#map .map-input-area,
#map #contents-area,
#calendar_main #contents-area {
  margin-left: 0px !important;
  padding: 0px;
}
.side-right-close-style #contents-area {
  margin-right: 0px;
}
.side-right-close-style #side-right-area {
  display: none !important;
}
/* 取引先情報の大枠のエリア */

#map .map-input-area {
  width: 100%;
  bottom: 0px;
  transition-duration: 0.3s;
}
/* 取引先情報が開いている場合のスタイル */
#map .mapInfoShow {
  bottom: 0;
}
/* 取引先情報のコンテンツエリア */
#map .map-input-area #multiCollapseExample1 {
  width: 100%;
  max-width: 100%;
  padding: 0px;
}
#map .map-input-area .card-body {
  height: 470px;
  overflow-y: scroll;
  overflow-x: auto;
  padding-bottom: 100px !important;
  max-width: 100%;
}
#map .map-show-container iframe {
  width: 100%;
  height: 500px;
}
/* せりだすエリアのコンテンツ */

#map .sp-map-show-area {
  position: relative;
}
#map #map-move {
  left: 10px !important;
  top: 36px !important;
  width: 94%;
}
#map #map-move #tmp_search_map_area {
  background: var(--sub_blue_50);
  border: 1px solid #eee;
  padding: 7px !important;
}
/* #map .gmnoprint{
    left: 0;
    top: 0px !important;
    margin-top: 0.5rem!important;
} */
#map .gmnoprint .gm-style-mtc button {
  padding: 5px 10px !important;
  height: auto !important;
}
#map #map-area-search {
  top: 4px !important;
  right: 100px !important;
}
#map #move-to-current-location {
  top: 75px !important;
  right: 5px !important;
}
#map #map-search {
  right: 14px !important;
  top: 4px !important;
}
#map .map-show-container #map-show {
  width: 100%;
  height: 50vh;
  /* height: 600px; */
}
#map .map-show-container #mapInput {
  width: 100%;
  height: 20vh;
}
#map #contents-wrap {
  /*margin-top: 50px;*/
  margin-bottom: 40px;
}
#calendar_main #contents-wrap {
  margin-bottom: 80px;
}

#side-right-togle {
  display: none;
}
#map .gm-bundled-control-on-bottom {
  bottom: 0 !important;
  right: 0 !important;
}
#map .gm-bundled-control-on-bottom .gm-svpc {
  bottom: 30px !important;
  right: 0 !important;
  top: auto !important;
  left: auto !important;
}
/* カレンダー----------------------------- */

#calendar_main #contents-area {
  margin-top: 50px;
}

#calendar_main .calendar-scroll {
  overflow-y: scroll;
  overflow-x: auto;
  height: 700px;
}

#calendar_main #sp-side-right-area-btn {
  position: fixed;
  top: 100px;
  right: 0;
  z-index: 700;
}

/* calendar　ヘッダー */

#calendar_main .calendar-table th {
  padding: 5px 0;
}

#calendar_main .day_chip,
#calendar_main .day_chip_txt {
  font-size: 20px;
  padding: 8px 10px;
}

#calendar_main .schedule-contents {
  gap: 10px;
}

/* full　calendar */

#calendar_main .fc .fc-toolbar-title {
  font-size: 1em;
}

/* calendarの幅 */

#calendar_main .calendar_width_50 {
  width: 50px;
}

#calendar_main .calendar_width_300 {
  width: 100px;
}

/* calendar内のuser */

#calendar_main .user_box {
  display: flex;
  align-items: center;
  padding: 0.25rem;
  gap: 3px;
}

#calendar_main .user_box div {
  writing-mode: vertical-lr;
  min-height: 80px;
  font-size: 10px;
}

/* フッターーーーーーーーーーーーーーーーーー */

#footer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  background: var(--white_color);
  /*border-top-left-radius: 20px;*/
  /*border-top-right-radius: 20px;*/
  box-shadow: 2px 2px 7px;
}

#footer .sp-footer-menu {
  display: flex;
  align-items: center;
  margin: 0;
}

#footer .sp-footer-menu li {
  width: 33.33%;
  text-align: center;
  padding: 4px 0;
  /*line-height: 25px;*/
  font-size: 13px;
}

#footer .sp-footer-menu li.active {
  background-color: var(--base_02_color);
}

#footer .sp-footer-menu li:first-child {
  border-top-left-radius: 20px;
}

#footer .sp-footer-menu li:last-child {
  border-top-right-radius: 20px;
}

#footer .sp-footer-menu li img {
  width: 15px;
}

#login #footer {
  margin-left: 0px;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  box-shadow: 0px 0px 0px;
}
#login #footer .copyright {
  margin-left: 0px;
}

/* bootstrapのstyle変更 */
.input-group-text,
.form-select,
.form-control {
  padding: 3px 5px !important;
  font-size: 12px !important;
}

#login .form-control {
  padding: 2.3rem 0.75rem !important;
  font-size: 16px !important;
}