@charset "utf-8";

html{
    height:100%;
    width: 100%;
}

body {
    height: 100%;
    width: 100%;
    font-family: "游ゴシック体",
        YuGothic,
        "游ゴシック",
        "Yu Gothic",
        "メイリオ",
        sans-serif;
    letter-spacing: 0.1em;
}

/*  サイトのテキストカラー*/
.sub-text-color {
    color: #4d4d4d;
}

a{
    color: #4d4d4d;
}

a:hover{
    color: #4d4d4d;
    text-decoration:underline;
    opacity: 0.5;
}

button:hover{
    opacity: 0.5;
}

/* サイトのテーマカラー */

.main-color {
    background-color: #f0f0f0;
}

.sub-color{
    background-color:#4d4d4d;
}

.accent-color {
    background-color: #4d4d4d;
}
/* サイドバーの書式 */
.sidebar{
    position: relative;
    height: 100%;
    padding: 0;
    width: 200px;
}

/*ナビバーの高さ*/
.nav-param{
    height: 50px;
}

/*ログインユーザーの表示*/
.navbar-text{
    width: 100%;
}

/*bootstrap4 ページネーションのCSS書き換え*/
.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #4d4d4d;
    border-color: #fff;
}

.page-link:focus.page-link:hover {
    color: #4d4d4d;
    text-decoration: none;
    background-color: #fff;
    border-color: #fff;
}

.page-link:active{
    border-color: #fff;
    text-decoration: none;
}

/* リンクの書式 */
.page-link{
    color: #4d4d4d;
    text-decoration: none;
}

/* ログイン・新規登録ページ */
.login {
    position:absolute;
    top:50%;
    left: 50%;
    width:400px;
    transform: translate(-50%, -50%);
}

.textbox{
    border-radius: 0;
}

/* bootstrap4 col-xlのブレークポイント */
@media screen and (max-width: 1280px) {

   .sidebar {
       position: relative;
       height: 100%;
       padding: 0;
       width: auto;
   }
}

/* bootstrap4 col-lgのブレークポイント */
@media screen and (max-width: 992px) {
    /*ログインユーザーの表示*/
    .navbar-text {
        width: auto;
    }
}