@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/
/************************************
** コピーボタン
************************************/
.copy-box{
    padding: 0.5em 1em;
    margin: 1em 0;
    color: #727252;
    background: white;
    border-top: solid 5px #727252;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
    font-size:1.5em;
	text-align: center;
}
.copy-box p:first-child{
    margin-top:0;
}
.copy-box p:last-child{
    margin-bottom:0;
    padding-bottom:0;
}
.copy-box ul{
    border:none;
    margin:0;
    padding:0;
}
.copy-box ul li{
    margin-left:20px; /* 左に隙間があく場合は消してください */
}
.btn-copy {
    display: block;
    margin: 1em auto 2em;
    width: 150px;
    padding: 0.3em 1em;
    text-decoration: none;
    background: #727252; /* ボタン背景色 */
    color: #fff;
    cursor: pointer;
    text-align: center;
    box-shadow: 0 0px 5px rgba(0,0,0,0.2);
    border-radius: 30px;
    font-weight: 600;
    letter-spacing:1px;
    line-height: 1.8;
    overflow: hidden;
    position: relative;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
.btn-copy:hover {
    color:#fff;
}
.btn-copy:before {
    left: -100%;
    position: absolute;
    height: 100%;
    width: 100%;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    content: "Copied!";
}
.btn-copy .btn-copy-text {
    display: inline-block;
    -webkit-transition: all 0.3s;
    -webkit-backface-visibility: hidden;
    -moz-transition: all 0.3s;
}
.btn-copy-active{
    background:#bbb;/* ボタンクリック時 背景色 */
}
.btn-copy-active:before {
    left: 0;
}
.btn-copy-active .btn-copy-text {
    -webkit-transform: translateX(250%);
    -moz-transform: translateX(250%);
    -ms-transform: translateX(250%);
    transform: translateX(250%);
}

/* ↓レビューボックス */

div.review-box-good {
    padding: 20px 20px;
    margin-top: 50px !important;
    margin-bottom: 50px !important;
    background-color: #FFF;
    border: 3px solid #86dd7b57;
    box-shadow: rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;
    font-size: 0.95em;
}
p.review-product-good {
    font-weight: bold;
    color: #53ab48;
    font-size:13px;
    margin-bottom: 0 !important;
}
div.review-box-bad {
    padding: 20px 20px;
    margin-top: 50px !important;
    margin-bottom: 50px !important;
    background-color: #FFF;
    border: 3px solid #f3606059;
    box-shadow: rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;
    font-size: 0.95em;
}
p.review-product-bad {
    font-weight: bold;
    color: #f36060;
    font-size:13px;
    margin-bottom: 0 !important;
}
div.review-header {
    display: flex;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #eee;
}
p.review-footer {
    font-size: 0.7em;
    text-align: right;
    margin-top: 10px;
}
figure.review-header-left {
    margin: 0 10px 0 0 !important;
}
p.review-product-matome{
    font-size:16px;
}
p.review-text{
    font-size:14px;
}

/* ↓パンくずリストの記事名表示 */

.p-breadcrumb {
	overflow-x:auto
}

.p-breadcrumb__text{
	font-weight:bold;
}

.p-breadcrumb__list {
	width:150%;
}
.single .p-breadcrumb__item:last-child>span.p-breadcrumb__text {
    display: block!important; //記事名の表示
    opacity: 1; //記事名を半透明にしない
    white-space: pre-wrap;//記事名が長い場合は折り返す
}

/* ↓パンくずリストのアンカーリンクに色を */

.p-breadcrumb a{
	color:#0073aa;
}

/* ↓カテゴリーページのテーブル内アンカーリンク */

.category-read-box a{
	color:#0073aa;
	text-decoration:none; 
}
