@charset "UTF-8";
/*
 Theme Name: SANGO Child
 Theme URI: https://saruwakakun.design
 Author: SARUWAKA
 Author URI: https://saruwakakun.com
 Template: sango-theme
 Version: 3.0
*/
/*こちらはSANGOの子テーマ用CSSです。以下にCSSを記入していきましょう。*/
/* リストの囲い線 */
.sng-box .wp-block-list,
.sng-box-msg__contents > .wp-block-list
{
	border: none!important;
}
/* h2タグ */
.entry-content h2{
	margin: 20px 0;
    padding-top: 10px;
    padding-right: 20px;
    padding-bottom: 10px;
    padding-left: 20px;
    background-color: #f4f4f4;
    border-left: solid 5px var(--wp--preset--color--sango-main);
    border-bottom: solid 3px #d7d7d7;
    font-size: 24px;
}
/*-----------------------
 * ポチップ
 * ---------------------*/
.pochipp-box .pochipp-box__logo{
	display: none!important;
}
.pochipp-box__btns a{
	font-weight: bold;
}
/* 楽天インラインボタンの色変更 */
.pochipp-inline__btnwrap.-rakuten > .pochipp-inline__btn {
	background-color: #ff7c74;
}
/*Amazonを先頭に*/
.pochipp-box__btnwrap.-amazon{
	order: -2;
}
@media screen and (max-width: 599px) {
	.pochipp-box {
		width: 95%!important;
	}
	.pochipp-box .pochipp-box__btn {
		padding:15px 10px !important;
	}
}
/*--------------------------------------
関連記事タイトルデザイン
--------------------------------------*/
/*#main .h-undeline {
    color: #595959;
    border-bottom: dotted 4px #e6e6e6;
    letter-spacing: 0.2em;
    margin: 0 0 .5em 0;
    background-color: #fff;
    font-size: 1.7em;
    padding: .2em 0;
	padding-right: 30px;
}
#main .h-undeline:before {
	content: '';
    background-image: url(https://maipyon.jp/wp-content/uploads/2024/06/keyboard.png);
  display: inline-block;
  width: 70px;
  height: 53px;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: -6px;
  vertical-align: bottom;
}
#main .related_title_small {
	border-left: none;
}
@media screen and (max-width: 425px) {
#main .related_title_small {
	border-left: none;
    color: #595959;
    border-bottom: dotted 4px #e6e6e6;
    letter-spacing: 0.2em;
    margin: 0 0 .5em 0;
    background-color: #fff;
    font-size: 1.2em;
    padding: .2em 0;
}
#main .related_title_small:before {
	content: '';
    background-image: url(https://maipyon.jp/wp-content/uploads/2024/06/keyboard.png);
  display: inline-block;
  width: 50px;
  height: 38px;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 6px;
  vertical-align: bottom;
}
}*/
/* --------------------------------------
 * 記事一覧のタイトルを小さく 2025/04/09
 * -------------------------------------*/
 @media screen and (max-width: 767px) {
	 .c_linkto_text h2 {
		 font-size: 15px;
	 }
	 .c_linkto .c_linkto_text {
		 padding: 11px 9px;
	 }
}
/* --------------------------------
 * スマホでの吹き出し 2024/06/09
 * ------------------------------*/
@media screen and (max-width: 425px) {
	.sgb-block-say-avatar{
		width: 55px;
	}
	.sgb-block-say-text{
		padding-left: 70px;
	}
}
/* ------------------------------------------------
 * ページネーション ぴょんガジェのサイト色では必要
 * ------------------------------------------------*/
.pagination a:hover{
	color: #fff;
}
/*--------------------------------------
  ヘッダーお知らせ欄
--------------------------------------*/
.header-info a {
    padding: 5px;
    font-size: 15px;
}

/*---------------------------------
  ヘッダーお知らせ欄
 ----------------------------------*/
.header-info a:after {
    content: "クリックして見に行く";
    font-weight: 500;
    border: 1px solid #fff;
    border-radius: 5px;
    padding: 2px 10px;
    margin-left: 5px;
}
@media screen and (max-width: 500px){
.header-info a:after {
    display: block;
    width: 50%;
    content: "タップして見に行く";
    margin: 0 auto;
    font-size: .8em;
}
}
/*-------------------------
  ブログカード　2024/05/23
-------------------------*/
.blog-card {
	position: relative;
	border: 2px solid #e5e5e5;
	word-wrap:break-word;
	box-sizing: border-box;
	max-width:100%;
	margin: 0 0 1.8rem;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}

.blog-card:hover {
	cursor: pointer;
    box-shadow: 0 10px 20px -5px rgba(0,0,0,.2);
    -moz-transform: translateY(-2px);
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}

.blog-card a {
	text-decoration: none;
	display: block;
    -webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.blog-card a:hover{
	color: #333;
    background: rgba(235, 235, 235, 0.8);
	text-decoration: none;
}

.blog-card-thumbnail {
	width: 200px;
	display: table-cell;
    vertical-align: middle;
}

.blog-card-thumbnail img {
	padding: 0;
	max-width: 100%;
}

.blog-card-content{
	display: table-cell;
	vertical-align: middle;
	padding: 0.4em;
    border-left: #e5e5e5 solid 2px;
}

.blog-card-title {
	font-size: 1em;
	font-weight: bold;
	line-height: 1.4;
	color: #4f96f6;
	display: -webkit-box;
    -webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}

.blog-card-excerpt {
	margin-top: .5em;
    font-size: .8em;
    line-height: 1.4;
    opacity: .8;
	color: #333;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
    text-overflow: ellipsis;
}

.blog-card-label{
    display: inline-block;
    position: absolute;
    background-color: #ffb36b;
    top: 0px;
    left: 0px;
    width: 70px;
    height: 25px;
    color: #fff;
    font-size: .8rem;
    font-weight: 700;
    text-align: center;
    line-height: 25px;
    transform-origin: 50% 50%;
    animation: animScale 3.5s ease-out;
}

.blog-card .clear {
	clear: both;
}

@media screen and (max-width: 959px){
	.blog-card-excerpt {
		display: none;
	}
}

@media screen and (max-width: 500px){
	.blog-card-title{
		font-size: .85em;
	}
	
	.blog-card-thumbnail{
		width: 160px;
	}
}
@media screen and (max-width: 375px){
	.blog-card-thumbnail{
		width: 120px;
	}
}

.blog-card-long {
	margin: 0 0 1.8rem;
}
.card-link {
  display: block;
  overflow: hidden;
  max-width: 400px;
  width: 100%;
  padding: 0;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
  color: #555;
  font-weight: bold;
  text-decoration: none !important;
  position: relative;
}

.longcard-img,
.card-link.longcard-link .blogcard-content {
  display: table-cell;
  vertical-align: middle;
}
.card-link:hover {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.25);
  color: #888;
  text-decoration: none;
  transform: translateY(-2px);
}
.blog-card-label-long{
	z-index: 1;
	display: inline-block;
    position: absolute;
	background-color: #f99f48;
    top: 5px;
	left: 5px;
	max-width: 120px;
	height: 25px;
	padding: 0 0.5rem;
    color: #fff;
    font-size: .8rem;
    font-weight: 700;
    text-align: center;
    line-height: 25px;
    transform-origin: 50% 50%;
    animation: animScale 3.5s ease-out;
}

.card-link .blogcard-text {
  display: block;
  padding: 10px 13px;
  line-height: 1.6;
}
.longcard-link {
  max-width: 100%;
  display: table;
  margin-bottom: 1.5em;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.25);
  padding: 5px 5px 36px 5px;
}
.longcard-img img {
  padding: 0px;
}
.longcard-img{
	position: relative;
	width: 40%;
}
.blogcard-title {
	font-size: 1em;
	font-weight: bold;
	line-height: 1.4;
	display: -webkit-box;
    -webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}
.blog-card-excerpt-long {
	padding-top: .8em;
    font-size: .8em;
    line-height: 1.4;
	font-weight: normal;
    opacity: .8;
	color: #333;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
    text-overflow: ellipsis;
}
@media only screen and (max-width: 481px) {
   .blog-card-label-long{
	  display: none;
	}
	.blogcard-title {
		font-size: 0.8rem;
	}
}
@media screen and (max-width: 959px){
	.blog-card-excerpt-long {
		display: none;
	}
}

.longcard-link .blogcard-title:after {
    position: absolute;
    content: "つづきを読む";
    bottom: 5px;
    right: 0px;
    display: inline-block;
    width: 100%;
    height: 27px;
    text-align: center;
    vertical-align: middle;
    background: #EBEDF0;
    font-size: 14px;
    line-height: 28px;
    color: #599EFF;
    letter-spacing: 3px;
}
/* お問い合わせ */
span.hissu{
	display: inline-block;
    background: #e46c65;
    padding: 0px 10px;
    font-size: 14px;
    color: white;
    letter-spacing: 3px;
    border-radius: 3px;
    margin-left: 15px;
    vertical-align: text-bottom;
}
.wpcf7 input[type=submit]{
	background-color: #90d581;
	letter-spacing: 6px;
	width: 100%;
	padding: 0.8rem;
	margin: 2rem 0 0 0;
	color: #fff;
    font-weight: bold;
    border: none;
    border-radius: 5px;
}
/* 景品表示法に基づく表記*/
p.keihyo {
    margin-top: 0;
	margin-bottom: 1rem;
    padding: 1px 10px 1px 10px;
    font-size: 14px;
    color: #555;
    background: #fafafa;
}
/* footerのCATEGORYは非表示 */
.footer-meta {
    display: none;
}
/* キャプションは中央寄せ */
.entry-content .wp-element-caption{
	text-align: center;
}
/* 追従サイドバーは少し下に */
#fixed_sidebar{
	top: 32px!important;
}

/*--------------------------------------
  目次　変更 (SANGO用)
--------------------------------------*/
#toc_container {
    margin: 0 0 2em 0;
    padding: 0!important;
    border-color: var(--sgb-main-color)!important;
    border: solid 2px;
    border-top: none!important;
    border-radius: 3px;
    background: #4242420d;
    box-shadow: none;
}
/*#toc_container .toc_list:after {
    content: "\f4d8";
    position: absolute;
    font-family: "Font Awesome 5 Free";
	font-weight: 900;
    bottom: -20px;
    right: 5%;
    font-size: 7em;
    opacity: 0.1;
}*/
.toc_title {
    display: block;
    margin: 0;
    padding: 4px 0px!important;
    font-size: 18px!important;
    font-weight: bold;
    background: var(--sgb-main-color);
    text-align: center;
    color: white!important;
	width: 100%;
	border-radius: 5px 5px 0px 0px;
}
.toc_title:before {
    display: none!important;
}
#toc_container .toc_list {
    margin: 0;
    color: #424242de;
    padding: 1em 1em 1em 2em;
    position: relative;
}
#toc_container .toc_list li a {
    color: #424242b3;
    display: block;
}
#toc_container .toc_list li a:hover {
    text-decoration: none;
    opacity: .5;
}
#toc_container ul {
    color: #424242b3!important;
}
#toc_container .menu_level_1 li{
	position:relative;
	list-style: none;
}
#toc_container .menu_level_1 li::before{
	display: block;
	background: none;
    border-bottom: 2px solid;
    border-left: 2px solid;
    border-radius: 0;
    box-shadow: none;
    color: inherit;
    content: ""!important;
    height: calc(1em - 2px);
    left: -0.75em;
    opacity: .75;
    position: absolute;
    top: 0;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: scale(.75);
    transform: scale(.75);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    width: 6px;
}
@media only screen and (min-width: 481px){
#toc_container {
    padding: 0;
}}

/*--------------------------------------
  パンくずリスト
--------------------------------------*/
#breadcrumb {
    font-size:15px;
    letter-spacing: .2em;
}
#breadcrumb li a, #breadcrumb li:after {
    color: #797979;
}
#breadcrumb li:first-child a:before {
    font-size: 1.4em;
	color: #969696;
    vertical-align: -4%;
    opacity:0.54;
}
#breadcrumb li:after {
    opacity:.54;
}
#breadcrumb li:last-child:after {
    display: none;
}
@media only screen and (max-width: 768px){
#breadcrumb {
    text-align: center;
	padding: 9px 15px;
}}
/*パンくずリストここまで*/