/**************
基本機能
**************/
/*Font*/
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@400;500;700;800;900&family=Noto+Sans+JP:wght@100..900&display=swap');
html,body,h1,h2,h3,h4,h5,div,span,a,li{
font-family:"Font Awesome 5 Free","Noto Sans JP",sans-serif !important;
font-optical-sizing: auto;
font-style: normal;
}
/*reset*/
body{font-size: 12px;}
.elevation-4{box-shadow: none !important;}

/*ロゴ*/
.brand-link .brand-image-xs {max-height: 20px !important;}
.logo-xl.brand-image-xs, .logo-xs.brand-image-xs{left: 18px !important;top: 20px !important;}
.brand-image.img-circle.elevation-3.logo-xs{box-shadow:inherit !important;}
.brand-link .brand-image {margin-left: .4rem !important;}

/*カラー*/
.navbar-white,.login-box button,
.page-item.active .page-link,
.wrapper{
background: rgb(0,0,0);
background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(64,64,64,1) 100%);
}
/*サイドメニューカラー*/
[class*=sidebar-dark-] .nav-sidebar>.nav-item.menu-open>.nav-link,
[class*=sidebar-dark-] .nav-sidebar>.nav-item:hover>.nav-link,
[class*=sidebar-dark-] .nav-sidebar>.nav-item>.nav-link:focus,
[class*=sidebar-dark-] .nav-sidebar>.nav-item>.nav-link.active
{
background: rgb(0,0,0);
background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(64,64,64,1) 100%);
}

/*ボタンデフォルトカラー*/
.btn-primary, .btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle
{
background-color: #000000;
border-color: #000000;
}

/*ボタンアクセントカラー*/
.btn-info,.btn-info:hover,.btn-info:active,.btn-info:visited,.btn-info:focus,
.btn-success, .btn-success:hover,.btn-success:active,.btn-success:visited,.btn-success:focus

{
  background-color: #F10066;
  border-color: #F10066;
}
/*リンク背景アクセントカラー*/
.dropdown-item.active, .dropdown-item:active{
background-color: #F10066;
}

/*Datepickerアクセントカラー*/
.daterangepicker .ranges li.active,.daterangepicker td.active, .daterangepicker td.active:hover{
  background-color: #F10066;
}





/*プログレス バー Pace.jsをadminlte.phpで設定*/
div.pace .pace-activity{
  height: 2px !important;
}

/*.preloader*/
.preloader{background-color: rgba(0, 0, 0, 0.9) !important;}


/*スクロールバー*/
.table-bordered{border: inherit !important;}
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background-color: #fbfbfb;
  border-radius: 100px;
}
::-webkit-scrollbar-thumb {
  border-radius: 100px;
  border: 3px solid transparent;
  background-clip: content-box;
  background-color: rgba(0,0,0,0.1);
}
/*/スクロールバー*/

/*ページネーション*/
.page-link {
    margin: 5px;
    border: none;
    border-radius: 10px;
    background-color: rgba(0,0,0,0.1);
    color:#666666;
}
/*/ページネーション*/

/************************
ROUND デザイン
************************/
.main-header {
  border-bottom:0 !important;
}
a.brand-link {
background-color: #000000;
border-bottom:0 !important;
}

aside[class*=sidebar-dark-]{
  box-shadow: none;
  border-left: 5px solid #000000;
  background-color: #000000;
}

div.sidebar{
  border-radius: 10px 0 0 0;
  background-color:#333333;
  height:100%;
}

[class*=sidebar-dark-] .sidebar a{
  font-size: 15px;
  font-weight: 500;
}

body:not(.layout-fixed) .main-sidebar{
  height:100vh;
}

.content-wrapper{
width: calc(100% - 255px);
border-radius:0px 10px 0px 0px;
background-color: #ffffff;
}
body.sidebar-collapse .content-wrapper{
width: calc(100% - 5px - 4.6rem );
}
@media (max-width: 991.98px){
body.sidebar-collapse .content-wrapper{width:100%;margin:0 auto;background-color: #ffffff;}
body.sidebar-open .content-wrapper{width:100%;margin:0 auto;background-color: #ffffff;}
div.sidebar{background-color: inherit;}
}

/*ドロップダウンメニューラウンド用　＋　リセット*/
.dropdown-menu,.dropdown-menu li,.dropdown-menu li a{border-radius: 10px !important;border:none;font-size: 15px;}
.dropdown-menu li a{margin: 10px;}
.dropdown-item,.dropdown-menu .btn-block{width: inherit;}
.navbar-nav>.user-menu>.dropdown-menu>.user-footer{background-color: inherit;border-radius: 10px !important;}

/***************************
カードデザインリセット
***************************/
.row{margin-left: 0;margin-right: 0;}
.col-12{padding: 0;}
.content-wrapper>.content,.card-body{padding: 0;}
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl{padding-left:0;padding-right:0;}
.card{
  margin-top: 0;
  margin-bottom:0;
  box-shadow: none;
  border-radius: 0;
  background-color: inherit;
}
.card-header:after{display: none !important;}

/***********************
ログインページ
*********************/
.login-box{
display: flex;
width: 100%;
height: 100vh;
overflow-y: hidden;
background-color: #ffffff;
}

.login-logo{
width: 40%;
order:2;
background-image: url(https://lac.msys.cloud/images/bg_overlay.jpg);
background-size: cover;
height: 100vh;
}

.login-box .logo_image {
    width: 400px !important;
    /*margin-left: -120px;*/
    margin-top: 250px;
}

.login-logo + .card-primary{
width: 60%;
height:100vh;
order:1;
border-radius: inherit !important;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-top:0px;
}

.login-logo + .card-primary .login-card-body{
width:60%;
margin: 0 auto;
height:300px;
flex:inherit;
align-self: center;
/*box-shadow: 0 3px 3px rgba(0,0,0,0.3);*/
border-radius: 10px;
}
.login-logo + .card-primary .login-card-body:before{
content:"";
display: block;
margin:0 auto;
width:180px;
height:100px;
background-image: url(https://lac.msys.cloud/images/adspider_rogo_bk.png);
background-size: contain;
background-repeat: no-repeat;

}
.login-page .card-header h3{display:none;}
.login-logo + .card-primary .login-card-body label[for="remember"]{color:#000000;font-weight:400 !important;font-size:13px;}
.login-logo + .card-primary .login-card-body button[type="submit"]{border-radius: 5px;box-shadow: 0 3px 3px rgba(0,0,0,0.3)}

/*ログイン*/
.login-page .login-logo img[height="50"]{display:none;}

.login-page .card-primary.card-outline{border-top:none !important;}

.login-page .card-footer {display:none;}
body.login-page {
  background: linear-gradient(148deg, rgba(75,94,108,1) 0%, rgba(24,19,31,1) 100%);
}

/*
.login-box{
display:flex;
width:100%;
}
.login-logo{
width:50%;
}
.login-logo + .card-primary{
width:50%;
}
*/
.login-box button{border:inherit;border-radius:2px;}

.form-control:focus,.login-card-body .input-group .form-control:focus~.input-group-append .input-group-text, .register-card-body .input-group .form-control:focus~.input-group-append .input-group-text{
border-color: #7695ac!important;
}

.form-control:focus,.login-card-body .input-group .form-control:focus~.input-group-append .input-group-text, .register-card-body .input-group .form-control:focus~.input-group-append .input-group-text{
border-color: #7695ac!important;
}

@media (max-width: 576px){
.login-box, .register-box {
    margin-top:0 !important;
    width: 100% !important;
}

.login-logo{display: none;}
.login-logo + .card-primary{width:100%;}
.login-logo + .card-primary .login-card-body{width:100%;box-shadow: none;}
}

/************************
Sidebar
*************************/

.main-sidebar ul li a i{
  min-width: 25px;
  text-align: center;
}

.navbar-light .navbar-nav .nav-link{color: rgba(255,255,255,1);}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover{color: rgba(255,255,255,0.5);}

[class*=sidebar-dark-]{background-color:#333333;}

/*Separator*/
.menu_spacer{background-color: #444444 !important;}

/*CARD*/
.card{
  /*box-shadow: rgb(15 35 70 / 15%) 0px 3px 6px 0px !important;
  border-radius: 10px !important;*/
}
/*/CARD*/

/*CARDヘッダー*/
.card-header{
  border-bottom: inherit !important;
  color: rgb(11, 25, 49) !important;
  background-color: inherit !important;
  border-radius: 10px !important;
}
.card-header::after{
  content:"";
  height:1px;
  background-color: rgb(231, 232, 236);
  display: block;
  margin-top: 50px;
}

.card-title{font-size: 25px;font-weight: bold;}
.card-title:before{
  content: "\f022";
  font-family: "Font Awesome 5 Free";
  margin-right:5px
  }
/*/CARDヘッダー*/

/*CARD オーバーレイ*/
#detail_div{
  z-index: 9999 !important;
  width:100% !important;
  margin-top: -50px !important;
}
/*/CARD オーバーレイ*/



/*******************
フォームカスタム
*******************/
/*既存リセット*/
.input-group-text{border:none !important;}
.login-card-body .input-group .input-group-text, .register-card-body .input-group .input-group-text{
background-color: #e9ecef !important;
}
/*/既存リセット*/


.form-control,
.select2-container--default .select2-selection--single{
  border:3px solid rgb(231, 232, 236);
  font-size: 13px;
  font-weight: 700;
}
/*フォーカス時の色*/
.form-control:focus{
  border-color: rgb(198, 199, 206) !important;
}
.select2-container--default.select2-container--focus .select2-selection--multiple, .select2-container--default.select2-container--focus .select2-selection--single{
  border-color: rgb(198, 199, 206) !important;
}

/*カスタムセレクト*/
.select2-container--default .select2-selection--single .select2-selection__rendered{
line-height: inherit !important;
margin-top: inherit !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[aria-selected]:hover{
background-color:#343a40 !important;
}
.select2-results__options li{
  font-size: 12px !important;
}

/*日付*/
#month_base{position: relative;}
#month_base:before{
  font-family: "Font Awesome 5 Free";
  content:"\f073";
  position: absolute;
  top:7px;
  left:10px
}

/*Datepicker*/
.datepicker table th{background-color: inherit;}

/*サーチエリア*/
.dataTables_filter label{
  color:#ffffff;
  position: relative;
}
.dataTables_filter label:before{
  font-family: "Font Awesome 5 Free";
  content:"\f002";
  font-weight: bold;
  color:#333333;
  position: absolute;
  left:50px;
  top:3px
}
div.dataTables_wrapper div.dataTables_filter input{
  text-indent: 15px;
}

#month_base #month_picker{text-indent: 15px;}

/*********************
ボタン
**********************/

.btn:not(.bg-transparent):hover{
  transform: translateY(2px)scale(1) !important;
  transition:all 0.3s 0s ease-in-out;
}

#close_btn{
  line-height: 30px;
  border-radius: 100%;
  width:40px;
-webkit-animation: heartbeat 1.5s ease-in-out 3s infinite both;
animation: heartbeat 1.5s ease-in-out 3s infinite both;
}
#btn_detail_exp,#btn_export, #btn_cancel,#btn_import, #btn_save
{
  font-size: 11px;
  margin-top: 5px;
  background-color: #000000;
  border-color:#000000;
  color:#ffffff;
  /*box-shadow: 0px 3px 0px #999999;*/
}



#btn_apply, #btn_setup, #btn_exec, #btn_close
{
  margin-top: 5px;
  background-color: #000000;
  border-color:#000000;
  /*box-shadow: 0px 3px 0px #682028;*/
}

#btn_reload
{
  margin-top: 5px;
  background-color: #138496;
  border-color:#117a8b;
  box-shadow: 0px 3px 0px rgba(58, 176, 195, 0.5);
}


/*/フォームカスタム*/


/********************************
table調整
********************************/
/***********汎用*************/
/*reset*/
.table-bordered td, .table-bordered th{border: inherit !important;}
.table-bordered th:not(:last-child) {border-right: 1px solid #ffffff !important;}
.table-responsive{overflow-y: hidden !important;}

table.dataTable thead>tr>th.sorting_asc,
table.dataTable thead>tr>th.sorting_desc,
table.dataTable thead>tr>th.sorting,
table.dataTable thead>tr>th,
table.dataTable thead>tr>td.sorting_asc,
table.dataTable thead>tr>td.sorting_desc,
table.dataTable thead>tr>td.sorting
{  padding-right:inherit !important;}
table.dataTable tfoot>tr>th
{
  padding-left: 1px !important;
  padding-right: 3px !important;
}
/*Sortボタン*/
table.dataTable thead .sorting:before,
table.dataTable thead .sorting:after,table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:before,
table.dataTable thead .sorting_desc_disabled:after{
  bottom:0;
  font-size: 10px;
}
/*Checkbox*/
table.dataTable tr.selected td.select-checkbox:after, table.dataTable tr.selected th.select-checkbox:after{
  font-size: 10px  !important;
  margin-top: -4px !important;
  color:#0066cc !important;
  font-weight: bold !important;
}
th.calc,td.calc,
th.system,td.system{background-color: inherit !important;}

/*/********************汎用***********************/

/*table*/
table, th, td{font-size: 12px;}
/*/table全体*/

/*thead*/
.table thead tr{
  position:sticky;
  top:0;
  background-color: #e7e8ec;
}
.table thead tr th{font-size: 11px;border-bottom: inherit !important;vertical-align:middle !important;}

/*/thead*/

/*tbody*/
/*trの色*/
tbody tr:nth-child(even){background-color: #ffffff;}
tbody tr:nth-child(odd) {background-color: #fbfbfb;}
tbody tr:hover{
  background: linear-gradient(-45deg,#feedf4 25%, #FDE4EF 25%,#FDE4EF 50%, #feedf4 50%,#feedf4 75%, #FDE4EF 75%,#FDE4EF);
  background-size: 40px 40px;
  animation: anime_stripe_1 1s infinite linear;
}
@keyframes anime_stripe_1 {
  0% {  background-position-x: 0;}
  100% {  background-position-x: -40px;}
}
/*/trの色*/

tbody tr td {
  white-space: nowrap;vertical-align:middle !important;
}

th .btn,td .btn{
  font-size: 10px;
}

/*/*****table調整*******************/

/**********************************
モーダルカスタム（右からスライド）
**********************************/
.modal-side{background-color: rgba(0,0,0,0.1);}
.card-header{z-index: 10;}
.card-body{z-index:1037;}
.modal-side-btn{width: 100%;font-size: 14px;margin-bottom:10px;}
.modal-side .modal-dialog{
  margin:0;
  max-width: 900px;
  /*モーダル位置*/
  position: absolute;
  right: 0;
}
@media (max-width: 991px){
.modal-side .modal-dialog{
  max-width: 100vw;
}
.modal-backdrop{display:none;}
}


.modal-side .modal-content{
  border-radius: 0;/*reset*/
  border:none;/*reset*/
  min-height: 100vh;
  min-width:100%;
}
.modal-side .modal-header{
  position: sticky;
  top: 0;
  background-color: #ffffff;
  z-index: 9999;
}
.modal-side .modal-body{
  width: 100%;
  overflow-x: scroll;
}
.modal-side .modal-title,
.modal-side .modal-body ul li a{
/*テキストの省略*/
display: inline-block;
text-overflow: ellipsis;
white-space: nowrap;
width: 80%;
overflow: hidden;
}

/*右からスライド*/
.modal.modal-side.fade .modal-dialog {transform: translate(220%, 0px);}
.modal.modal-side.show .modal-dialog {transform: none;}

/*モーダル時の背景*/
.modal-backdrop.show{opacity: 0.1;}

/*モーダルサイドオリジナル*/
.modal-header h2{width:100%;}
.modal-header:has(.modal_h_info_label){
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  }
div:has(> .modal_h_info_label){
  width:calc(50% - 10px);
  margin:5px;
  font-weight:600
  display: inline-block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.modal_h_info_label,.modal_b_info_label{
  background-color: #e7e8ec;
  padding:4px;
  margin-right:5px;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 900;
  min-width: 60px;
  display: inline-block;
  text-align: center;
}
.kensyutu_memo_area{
  padding: 10px;
}
.kensyutu_memo_area textarea {
  width: 100%;
  background-color: #fbfbfb;
  border:2px solid #e7e8ec;
  border-radius:5px;
  min-height:50px;
  field-sizing: content;
}
.kensyutu_memo_area .btn-info{
  font-size: 12px;
  font-weight: 600;
  width: 50px;
  display: block;
  margin-left:auto;

}

ul:has(> .modal_b_info_label){
  list-style-type:none;
  padding: 10px;
}

ul:has(> .modal_b_info_label) li{
margin:10px 0;
display: flex;
align-items: center;
}
ul:has(> .modal_b_info_label) li i{margin-right:5px;}

.ad_sample{
  width:60%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  background-color: #ffffff;
  box-shadow: 2px 1px 5px 1px #dcdcdc;
  padding: 10px;
  border-radius: 10px;
  overflow:hidden;
  margin:10px
}
.ad_favicon{background-color:#E2EEFF;
padding:4px 7px;
color:#0060F0;
border-radius: 100px;
margin-right:5px ;
}
.ad_domain{display: flex;align-items: center;}
.ad_title{
  width: 100%;
  font-size: 18px;
  white-space:normal;
}
.ad_desc{
  width: 100%;
  font-size: 14px;
  white-space:normal;
}


/* ----------------------------------------------
 * Generated by Animista on 2022-1-6 15:11:51
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation heartbeat
 * ----------------------------------------
 */
@-webkit-keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
