@charset "utf-8";
/*
	Theme Name: diver_child
	Template: diver
	Description:  Diverの子テーマです。
	Theme URI: http://tan-taka.com/diver/
	Author: Takato Takagi
 */

/* Webフォント：Noto Sans JP */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
 
body {
     font-family: 'Noto Sans JP', sans-serif;
     font-size: 100%;
     letter-spacing: 0.1em;
}

/* フォント変更 */
/*
*, *:before, *:after {
    font-family:  メイリオ, Meiryo,游ゴシック体, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic",FontAwesome, sans-serif;
}
*/

/*マーカーアニメーション*/
 
.marker-animation.active{
    background-position: -100% .5em;
}
.marker-animation2.active{
    background-position: -100% .5em;
}
 
.marker-animation99 {
    background-image: -webkit-linear-gradient(left, transparent 50%, rgb(255,250,153) 50%);
    background-image: -moz-linear-gradient(left, transparent 50%, rgb(255,250,153) 50%);
    background-image: -ms-linear-gradient(left, transparent 50%, rgb(255,250,153) 50%);
    background-image: -o-linear-gradient(left, transparent 50%, rgb(255,250,153) 50%);
    background-image: linear-gradient(left, transparent 50%, rgb(255,250,153) 50%);
    background-repeat: repeat-x;
    background-size: 200% .8em;
    background-position: 0 .5em;
    transition: all 2s ease;
    font-weight: bold;
}
.marker-animation88 {
    background-image: -webkit-linear-gradient(left, transparent 50%, #f9bfd0 50%);
    background-image: -moz-linear-gradient(left, transparent 50%, #f9bfd0 50%);
    background-image: -ms-linear-gradient(left, transparent 50%, #f9bfd0 50%);
    background-image: -o-linear-gradient(left, transparent 50%, #f9bfd0 50%);
    background-image: linear-gradient(left, transparent 50%, #f9bfd0 50%);
    background-repeat: repeat-x;
    background-size: 200% .8em;
    background-position: 0 .5em;
    transition: all 2s ease;
    font-weight: bold;
}

.green{
    background-image: -webkit-linear-gradient(left,transparent 50%,#64ed7b8a 50%);
    background-image: -moz-linear-gradient(left,transparent 50%,#64ed7b8a 50%);
    background-image: -ms-linear-gradient(left,transparent 50%,#64ed7b8a 50%);
    background-image: -o-linear-gradient(left,transparent 50%,#64ed7b8a 50%);
}
.purple{
    background-image: -webkit-linear-gradient(left,transparent 50%,#ea47ff73 50%);
    background-image: -moz-linear-gradient(left,transparent 50%,#ea47ff73 50%);
    background-image: -ms-linear-gradient(left,transparent 50%,#ea47ff73 50%);
    background-image: -o-linear-gradient(left,transparent 50%,#ea47ff73 50%);
}
.lightblue{
    background-image: -webkit-linear-gradient(left,transparent 50%,#47fff673 50%);
    background-image: -moz-linear-gradient(left,transparent 50%,#47fff673 50%);
    background-image: -ms-linear-gradient(left,transparent 50%,#47fff673 50%);
    background-image: -o-linear-gradient(left,transparent 50%,#47fff673 50%);
}
.orange{
    background-image: -webkit-linear-gradient(left,transparent 50%,#ffa44773 50%);
    background-image: -moz-linear-gradient(left,transparent 50%,#ffa44773 50%);
    background-image: -ms-linear-gradient(left,transparent 50%,#ffa44773 50%);
    background-image: -o-linear-gradient(left,transparent 50%,#ffa44773 50%);
}


/* ---------------------検索メニュー画面-------------------------------- */

/* .l-main {
  margin: 0 auto;
} */

/* .l-main.l-main-single {
  max-width: 100%;
  padding: 20px 30px 60px 30px;
  margin: 0 auto;
  background: #ffffff;
  border-left: #E5E5E5 1px solid;
  border-right: #E5E5E5 1px solid;
} */

.search_title {
  margin-bottom: 20px;
}

.text-secondary{
  display: inline-block;
  color: #6c757d!important;
  margin-bottom: 10px;
}

.l-main a {
  text-decoration: none;
}

.row{
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.row div {
  /* width: calc(50% - 1rem); */
  width: 50%;
}

/* .row:nth-child(odd){
  width: 40%;
} */

/* .row:nth-child(even){
  width: 300px;
} */


.row div .text-dark,.text-danger{
  width: 100%;
}

/* img {

} */

.l-main .col-sm-4 img {
  display: block;
  height: 170px;
  margin: 0 auto;
}




/* .d-block .m-auto {
  display: block;
  width: 50%;
  height: 170px;
}  */


.text-dark {
  color:#343a40!important;
}

.font-weight-bold {
  font-weight: 700!important;
}

.fs-medium{
  font-size: medium!important;
}

.text-danger {
  color: #dc3545!important;
  margin-top: 10px;
  margin-bottom: 10px;
}

.col-sm-4 {

}

.col-sm-4 p {
  margin-bottom: 1rem;
  text-align: center;

}

.btn-warning {
  display: block;
  color: #212529;
  background-color: #ffc107;
  border-color: #ffc107;
  text-align: center;
  padding: 1.5rem;
  width: 195%;
  margin: 0 auto;
}

.mb-2, .my-2 {
  margin-bottom: .5rem!important;
  margin-top: .5rem!important;
}

.btn-outline-secondary {
  color: #6c757d;
  border-color: #6c757d;
}

.mb-3, .my-3 {
  margin-bottom: 1rem!important;
}

.p-3 {
  padding: 1rem!important;
}

.pb-3, .py-3 {
  padding-bottom: 1rem!important;
}

.border-bottom {
  border-bottom: 1px solid #dee2e6!important;
}

.border-top {
  border-top: 1px solid #dee2e6!important;
}

.border-right{
  border-right: 1px solid #dee2e6!important;
}

.border-left {
  border-right: 1px solid #dee2e6!important;
}

.border-secondary {
  border-color: #6c757d!important;
}

.border-left {
  border-left: 1px solid #6c757d!important;
}


#search-ranking-post{
  width: 100%;
  height: auto;
  margin: 0 auto;
}

.checker{
  margin: 5px 0 0 40px;
}


.bg-info {
  background-color: #17a2b8!important;
  height: 30px;
  line-height: 30px;
  margin-top: 20px;
}

.text-light {
  color: #f8f9fa!important;
  padding-left: 10px;
}

.search-box dt {
  font-weight: 700;
  margin-top: 10px;
  margin-left: 10px;
}

.pretty {
  position: relative;
  display: inline-block;
  margin-right: 2em;
  white-space: nowrap;
  line-height: 1;
}

.pretty input {
  position: absolute;
  left: -18px;
  top: 0;
  min-width: 1em;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0;
  margin: 0;
  padding: 0;
  cursor: pointer;
}


.pretty .state label:before {
  border-color: #bdc3c7;
}

.pretty .state label:after, .pretty .state label:before {
  content: '';
  width: calc(1em + 2px);
  height: calc(1em + 2px);
  display: block;
  box-sizing: border-box;
  border-radius: 0;
  border: 1px solid #bdc3c7;
  z-index: 0;
  position: absolute;
  left: -18px;
  top: calc((0% - (100% - 1em)) - 8%);
  background-color: transparent;
}

.pretty.p-default .state label:after{
  -webkit-transform: scale(.6);
  -ms-transform: scale(.6);
  transform: scale(.6);
  border: none;
}

.pretty input:checked~.state.p-primary label:after, .pretty.p-toggle .state.p-primary label:after{
  background-color: #428bca!important;
}

.fs-medium{
  font-size: medium!important;
}

.btn-info {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
  height: 50px;
  margin-top: 27px;
}

.w-50 {
  width: 50%!important;
}

.text-center {
  text-align: center!important;
}

/*　画面サイズが480px以下の場合ここの記述が適用される　*/
@media screen and (max-width:480px) {

  .recommend-img img {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
  }

  .recommend-img{
    width: 100%;
  }

  .wp-block-image img {
   display: block;
  }

  .content .recommend {
    display: block;
    width: 100%;
  }

 .content .recommend-ul {
    width: 100%;
  }



  .product-btn {
    margin: 0;
  }

  

  .fa-chevron-right {
    margin-left: 10px;
    font-size: 12px;
  }


  .menuBtn {
    display: block;
  }


  .content .fixed_1 {
    display: block;
    max-width: 65px;
    min-width: 65px;
  }

  .product-table th:first-of-type {
    width: 100px;
  }

  .wp-block-buttons>.wp-block-button.wp-block-button__width-25 {
    width: auto;
  }

  .wp-block-buttons>.wp-block-button{
    display: block;
  }

  .wp-block-buttons {
    display: block;
  }

  .wp-block-button__link {
    display: block;
    width: auto;
  } 

    /* ボタンサイズ */
  .content .es-size100 {
    width: 100%;
  }

  /* 評価部分 */
  .content .rate-text {
    display: block;
    /*top:58px;*/
  }

  .content div .star-rating-box {
    margin-top: 0px;
  }


  .star-rating-box,.filled-star,.empty-star {
    font-size: 16px;
  }

  .star-rating-box {
  position: absolute;
  top: 18px;
  left: 129px;
  
  }

  .score {
    /*position: absolute;*/
    top: 8px;
    left: 220px;
  }

  .adWidget ins, .widget img, .widget.widget_media_image .wp-caption {
    width: 103%;
    max-width: 103%;
  }


  .content .official-btn {
    padding-right: 35px;
  }


  .content .content-btn{
    padding-left: 10px;
  }

  
  .content .official-btn::before,
  .content .content-btn::before {
  content: "";
  position: absolute;
  right: 36px;
  top: 65px;
  width: 19px;
  height: 21px;
  border-top: 4px solid #fff;
  border-right: 4px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);

}

.filled-star-octagon,
.filled-star-vol,
.filled-star-tes,
.filled-star-peni,
.filled-star-tagi,
.filled-star-spa,
.filled-star-ap,
.filled-star-mega,
.filled-star-sidoru,
.filled-star-gimu,
.filled-star-albo,
.filled-star-edi,
.filled-star-gaga,
.filled-star-zel {
  top:-23px;
}


/* bottom-btn */

.content .bottom-btn {
  display: block;

}

.content .bottom-btn-left {
  width: 100%;
  padding-left: 83px;

}

.content div .bottom-btn-right {
  padding-left: 72px;
  width: 100%;
  margin-top: 35px;
}

.content div .bottom-btn-right-re1  {
  padding-left: 115px;
  width: 100%;
  margin-top: 35px;
}



/* 検索画面 */

.row {
  display: block;
  width: 100%;
}

.row div {
  width: 100%;
  max-width: 100%;
  text-align: center
}

#search-ranking-post{
  /* max-width: auto; */
  height: auto;
  margin: 10px auto;
}

.l-main .col-sm-4 img {
  display: block;
  height: 170px;
  margin: 0 auto ;
}

.btn-warning {
  display: block;
  padding: 2.5rem;
  font-size: 18px;
  margin-top: 10px;
  width: 80%;
}

.text-dark{
  margin-top: 8px;
}


.pretty{
  /* display: block; */
  font-size: 18px;
  margin: 15px 25px;
}

.search-box dt {
  font-size: 18px;
}

.pretty .state label:after, .pretty .state label:before {
  left: -28px; 
}

}


/*リンク 追加　202155*/
.link-btn-wrap {
display: flex;
flex-direction: column;
}
p.site-link a {
background: #ff0000;
color: #fff;
font-weight: bold;
height: 120px;
text-decoration: none;
font-size: 26px;
display: block;
border-bottom: 3px solid #8b0001;
border-radius: 5px;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
}
p.info-link a {
background: #335ab2;
color: #fff;
font-weight: bold;
text-decoration: none;
font-size: 20px;
display: block;
padding: 5%;
border-radius: 5px;
text-align: center;
-moz-box-shadow: 0 1px 2px rgba(000,000,000,.5),inset 0 0 1px rgba(255,255,255,.5);
-webkit-box-shadow: 0 1px 2px rgba(000,000,000,.5), inset 0 0 1px rgba(255,255,255,.5);
box-shadow: 0 1px 2px rgba(000,000,000,.5), inset 0 0 1px rgba(255,255,255,.5);
}


/*検索*/

h2.search_title{
    color: #fff;
    font-weight: bold;
    text-align: center;
    background: #17a2b8;
    border: 1px solid #17a2b8;
    outline: 1px solid #17a2b8;
    outline-offset: 2px;
    padding: 15px;
    cursor: pointer;
}


.search_contents {
    display: none;
    opacity: 0;
    transition: opacity 0.3s;
}

.search_contents.active {
    display: block;
    opacity: 1;
}