body {
    padding:0;
    margin:0;
    /* margin-bottom: 100px; */
    -webkit-appearance: none;
    -webkit-text-size-adjust: 100%;
}

hr {
  grid-column: span 2;
  width: 100%;
}

.title-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.common-top-content-pc {
    padding-top: 110vh;
    height: 100vh;
}

.common-top-content-pc:before{
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-1;
  width:100%;
  height:100vh;
  background:url(/img/pc_top.jpg) center no-repeat;
  background-size:cover;
}

.common-top-content-sp {
    background: white;
    padding-top: 100vh;
    /* padding-bottom: 100px; */
    height: 100vh;
}

.common-top-content-sp:before{
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  /* z-index:-1; */
  width:100%;
  height:100vh;
  background:url(/img/sp_top.jpg) center no-repeat;
  background-size:cover;
}

/* .fixed-background {
  min-height: 100vh;
  background-attachment: fixed;
  background-size: cover;
  background-position: center;

  background-position-x: 50%;
  background-position-y: 0%;

  background-position: center top;

} */

.category-header {
    border-left: 8px solid #04958d;
    padding: 2px 10px;
}

.pankuzu {
    position: absolute;
	left: 12px;
	top: 75px;
}

.grecaptcha-badge { visibility: hidden; }


.card {
    padding-left: 0;
    padding-right: 0;
    /* box-shadow: 0 0 5px gainsboro; */
}

.card-shadow {
    box-shadow: 0 0 5px gainsboro;
}

.footer-text {
    font-size: 0.7em;
}

.footer-menu a:hover, a:active {
    text-decoration: none;
    color: white;

    /* position: relative; */
    z-index: 500;
}

a:hover .fa-line {
    color: #00B900;
    text-decoration: none;
    background-color: transparent;
}

a:hover .fa-twitter {
    color: #1DA1F2;
    text-decoration: none;
    background-color: transparent;
}

a:hover .fa-facebook {
    color: #1877f2;
    text-decoration: none;
    background-color: transparent;
}

/* 正方形 */
.blog-tile-4 {
    position: relative;
}
.blog-tile-4:before {
    content: '';
    display: block;
    width: 100%;
    padding-top: 100%;
}
/* 正方形 */

.fa-clipboard:hover {
    color: #777;
    text-decoration: none;
    background-color: transparent;
}

.secret {
    font-size: 0.7em;
}

.secret svg {
    width: 12px;
    padding-top: 2px;
}

.blog-title {
    font-weight: bold;
}

.blog-date {
    font-size: 0.55em;
}

.page-item.active .page-link {
    z-index: 3;
    color: white;
    background-color: black;
    border-color: black;
}

.pagination > li > a,
.pagination > li > button
{
    background-color: white;
    color: black;
}

.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover,
.pagination > li > button:focus,
.pagination > li > button:hover
{
    color: white;
    background-color: black;
    border-color: black;
}

.btn-info {
  background:#04958d;
  border-color: transparent;
}

.btn-info:hover, .btn-info:focus,
.btn-info:active, .btn-info:active:focus, .btn-info:active:hover, .btn-info:active.focus,
.btn-info.active, .btn-info.active:focus, .btn-info.active:hover, .btn-info.active.focus,
.open > .dropdown-toggle.btn-info,
.open > .dropdown-toggle.btn-info:hover,
.open > .dropdown-toggle.btn-info:focus,
.open > .dropdown-toggle.btn-info.focus,
.btn-info.disabled:hover, .btn-info[disabled]:hover, fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus, .btn-info[disabled]:focus, fieldset[disabled] .btn-info:focus,
.btn-info.disabled.focus, .btn-info[disabled].focus, fieldset[disabled] .btn-info.focus {
    background: #03b4aa;
    border-color: transparent;
}

.btn-info.outline {
    border: 3px solid #03b4aa;
    color: #03b4aa;
}

.btn-danger {
  background:#cd9803;
  border-color: transparent;
}

.btn-danger:hover, .btn-danger:focus,
.btn-danger:active, .btn-danger:active:focus, .btn-danger:active:hover, .btn-danger:active.focus,
.btn-danger.active, .btn-danger.active:focus, .btn-danger.active:hover, .btn-danger.active.focus,
.open > .dropdown-toggle.btn-danger,
.open > .dropdown-toggle.btn-danger:hover,
.open > .dropdown-toggle.btn-danger:focus,
.open > .dropdown-toggle.btn-danger.focus,
.btn-danger.disabled:hover, .btn-danger[disabled]:hover, fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus, .btn-danger[disabled]:focus, fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled.focus, .btn-danger[disabled].focus, fieldset[disabled] .btn-danger.focus {
    background: #dfa400;
    border-color: transparent !important;
}

.btn-danger.outline {
    border: 3px solid #dfa400 !important;
    color: #dfa400 !important;
}

.btn-danger:focus {
  background-color: #dfa400 !important;
  border: 0px solid #dfa400 !important;
  border-color: transparent !important;
}

.btn:focus-visible {
  outline: 4px dashed darkorange;
}

.btn-danger:active {
  background-color: #dfa400 !important;
  border: 0px solid #dfa400 !important;
  border-color: transparent !important;
}

.btn-danger:not(:disabled):not(.disabled).active:focus, .btn-danger:not(:disabled):not(.disabled):active:focus, .show>.btn-danger.dropdown-toggle:focus, .btn-danger:focus {
    box-shadow: 0 0 0 0.2rem rgb(223 164 0 / 50%);
}

.sns-icons img {
    width: 5px;
}

.fullscreen .modal-dialog {
  margin: 0 0 0 0;
  max-width: 100%;
  width: 100%;
  height: 100%;
  min-height: 100%;
  padding: 0;;
}

.fullscreen .modal-content {
  height: 100%;
  min-height: 100%;
  border-radius: 0;
  background: rgba(36, 36, 36, 0.90);
  overflow:auto;
}

.fullscreen .modal-content .modal-header{
  border: 0px;
}

.fullscreen .modal-content button{
  opacity: 1;
}

.fullscreen .modal-content button span{
  color: #fff;
  font-weight: 1;
  font-size: 26px;
  text-shadow: none;
}

.fullscreen .modal-body .modal-logo img {
  width: 158px;
  padding-bottom: 84px;
}

.fullscreen .modal-body ul {
  padding: 0 0 0 0;
}

.fullscreen .modal-body li {
  padding-bottom: 0px;
}

.fullscreen .modal-body a {
  color: #fff;
  font-size: 16px;
}

.fullscreen .modal-body .social img {
  width: 56px;
  margin: 8px;
}
.modal-title{
  color: #fff;
}

.blog-body {
    word-wrap: break-word;
    overflow-wrap: break-word;
}


/* .card-img-overlay{
    padding: 1% 0;
    top: calc(42% - 0.5rem);
    text-align: center;
    font-weight: bold;
} */

/* クラシファイド　カテゴリドロップダウン */

.dropdown-submenu {
  position: relative;
}

.dropdown-submenu a::after {
  transform: rotate(-90deg);
  position: absolute;
  right: 6px;
  top: .8em;
}

.dropdown-submenu .dropdown-menu, .dropdown-menu:focus {
  top: 0;
  left: 100%;
  margin-left: .1rem;
  margin-right: .1rem;
  outline: none;
  border-color: transparent;
}

.dropdown-item:active, .dropdown-item:focus {
    color: #fff;
    background: #17958D;
    border-color: transparent;
    outline: none;
}

/* クラシファイド商品画像 ー 文言を下寄せ */
.classified-list .card-img-overlay{
    padding: 1% 0;
    top: 78%;
    text-align: center;
    font-weight: bold;
}

/* 共通ヘッダ画像 ー 文言を縦中央寄せ */
.common-header-img .card-img-overlay{
    padding: 1% 0;
    /* top: calc(42% - 0.5rem); */
    text-align: center;
    font-weight: bold;
}

/* 共通トップ画面　各コンテンツ名をクリッカブル（PCのみ） */
.top-header-clickable {
  width: 100%;
  cursor: pointer;
  transition-duration: 0.3s;
}
.top-header-clickable:hover {
  opacity: 0.6;
  transition-duration: 0.3s;
}

/* ブログヘッダ ー 文言を縦中央寄せ */
.blog-header-img .card-img-overlay{
    padding: 1% 0;
    top: calc(42% - 0.5rem);
    text-align: center;
    font-weight: bold;
}

.blog-top{
  padding: 1% 0;
  bottom: 10;
  text-align: center;
  font-weight: bold;
}

.card-title{
  background-color:rgba(0,0,0,0.5);
}

.bg-rgba {
 background-color:rgba(0,0,0,0.5);
 width: 100%;
 /* margin: auto; */
 text-align: center;
}

.top-header-img img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  object-position: 0 35%
}

.classified-header-img img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  object-position: 0 58%
}

.classified-top img {
  width: 100%;
  /* height: 220px; */
  object-fit: cover;
  object-position: 0 35%
}

.classified-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 0 35%
}

/* チャット吹き出し */
/*吹き出し*/
.balloon_l,
.balloon_r{
  margin: 5px 0;
  display:flex;
  justify-content: flex-start;
  align-items: flex-start; /*縦位置を上揃え*/
/*   align-items: center; */ /*縦位置を真ん中揃え*/
}
.balloon_r{
  justify-content:flex-end;
}
.faceicon img{
  width: 55px;
  height: auto;
}
.balloon_r .faceicon{
  margin-left:25px;
}
.balloon_l .faceicon{
  margin-right:25px;
}
.balloon_r .faceicon{
  order:2 !important;
}
.says {
  max-width:300px;
  display: flex;
  flex-wrap: wrap;
  position: relative;
  padding: 17px 13px 15px 18px;
  border-radius: 12px;
  background: #04958d;/*色は任意*/
  box-sizing:border-box;
  margin:0 !important;
  line-height:1.5;
  word-break:break-all;
/*   align-items: center; */
}
.says-you {
  max-width:300px; /*最大幅は任意*/
  display: flex;
  flex-wrap: wrap;
  position: relative;
  padding: 17px 13px 15px 18px;
  border-radius: 12px;
  background: gainsboro;/*色は任意*/
  box-sizing:border-box;
  margin:0 !important;
  line-height:1.5;
  word-break:break-all;
/*   align-items: center; */
}
.says p{
  margin:8px 0 0 !important;
}
.says p:first-child{
  margin-top:0 !important;
}
.says:after {
  content: "";
  position: absolute;
  border: 10px solid transparent;
}

.says-you p{
  margin:8px 0 0 !important;
}
.says-you p:first-child{
  margin-top:0 !important;
}
.says-you:after {
  content: "";
  position: absolute;
  border: 10px solid transparent;
}

.balloon_l .says-you:after {
  left: -26px;
  border-right: 22px solid gainsboro;
}
.balloon_r .says:after {
  right: -26px;
  border-left: 22px solid #04958d;
}

div.scrollpr {
  overflow-x: auto;
}

div.citem-scrollpr {
  overflow-y: hidden;
}

/* フォーラム */
.forum-header-img img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  object-position: 0 80%;
}

.forum-category .btn {
    padding: 10px;
}

.forum-category .btn-outline-info, .btn-outline-info:hover {
    background: #fff;
    color: #17958D;
    border-color: #17958D;
}

.btn-outline-info:active {
    background: #04958d;
    color: #fff;
    border-color: #17958D;
}

/* PCサイズ */
@media only screen and (min-width:1024px) {
    .background-1 {
      background-image: url(/img/pc_top.jpg);
    }

    .background-1-webp {
      background-image: url(/img/pc_top.jpg.webp);
    }

    .blog-tile-img {
        height: 300px;
    }

    .top-blog-tile-img {
        width: 167px;
        height: 170px;
    }

    .cf-dropdown-header {
        padding: 0.25rem 1.5rem;
        color: #17958D;
        font-weight: bold;
    }

    /* 共通トップ：クラシファイド商品画像 ー 文言を下寄せ */
    .top-classified-tile .card-img-overlay{
        padding: 1% 0;
        top: 85%;
        text-align: center;
        font-weight: bold;
    }

    .classified-list .card-img{
        height: 120px;
    }

    .top-classified-tile .card-img {
        height: 170px;
    }

    .blog-header-img img {
      width: 100%;
      height: 400px;
      object-fit: cover;
      object-position: 0 0
    }

    .by-writer {
        position: absolute;
    	top: 455px;
    }
}

/*　スマホサイズ */
@media only screen and (max-width:1023px) {
    .background-1 {
      background-image: url(/img/sp_top.jpg);
    }

    .background-1-webp {
      background-image: url(/img/sp_top.jpg.webp);
    }

    .blog-tile-img {
        height: 140px;
    }

    .top-blog-tile-img {
        /* width: 120px; */
        width: 100%;
        height: 120px;
    }

    .top-classified-tile img {
        height: 120px;
    }

    .classified-list .card-img{
        height: 110px;
    }

    .blog-header-img img {
      width: 100%;
      height: 200px;
      object-fit: cover;
      object-position: 0 0
    }

    .by-writer {
        position: absolute;
    	left: 1%;
    	top: 250px;
    }
}