@charset "UTF-8";

/*
Theme Name: 賢威8.0（子テーマ:ancie_blog） 
Theme URI: https://rider-store.jp/keni/
Author: 株式会社ウェブライダー		
Author URI: https://web-rider.jp/
Description: 賢威8.0 子テーマです。		
Version: 8.0.0.0
Template: keni80_wp_standard_all_202209130134
*/

/*=================================================================
記事装飾
=================================================================*/

/************************************
キャラクター吹き出し（左）
************************************/
.balloon {
	width: 100%;
	margin: 1.5em 0;
	overflow: hidden;
}

.balloon .faceicon {
	float: left;
	margin-right: -90px;
	width: 90px;
}

.balloon .faceicon img{
	width: 100%;
	height: auto;
}

.balloon .faceicon_border {
	float: left;
	margin-right: -90px;
	width: 80px;
}

.balloon .faceicon_border img{
	width: 100%;
	height: auto;
	border: solid 3px #4dc8cf;
	border-radius: 50%;
}

.balloon .chatting {
	width: 100%;
}

.says {
	display: inline-block;
	position: relative; 
	margin: 5px 0 0 105px;
	padding: 17px 13px;
	border-radius: 12px;
	background: #00b1bb;
	color: #fff;
}

.says:after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 18px; 
	left: -24px;
	border: 12px solid transparent;
	border-right: 12px solid #00b1bb;
}

.says p,.says_border p {
	font-size:14px;
	margin: 0!important;
	padding: 0!important;
}

.says_border {
	position: relative;
	display: inline-block;
	margin: 1.5em 0 1.5em 105px;
	padding: 7px 10px;
	min-width: 120px;
	max-width: 100%;
	color: #333;
	font-size: 16px;
	background: #FFF;
	border: solid 3px #c0c0c0;
	box-sizing: border-box;
}

.says_border:before {
	content: "";
	position: absolute;
	top: 22px;
	left: -24px;
	margin-top: -12px;
	border: 12px solid transparent;
	border-right: 12px solid #FFF;
	z-index: 2;
}

.says_border:after {
	content: "";
	position: absolute;
	top: 22px;
	left: -30px;
	margin-top: -14px;
	border: 14px solid transparent;
	border-right: 14px solid #c0c0c0;
	z-index: 1;
}


/************************************
キャラクター吹き出し（右）
************************************/
.balloon .faceicon_r {
	float: right;
	margin-left: -120px;
	width: 100px;
}

.balloon .faceicon_r img{
	width: 100%;
	height: auto;
}

.balloon .faceicon_border_r {
	float: right;
	margin-right: -90px;
	width: 80px;
}

.balloon .faceicon_border_r img{
	width: 100%;
	height: auto;
	border: solid 3px #00b1bb;
	border-radius: 50%;
}

.says_r {
	position: relative;
	display: inline-block;
	float:right;
	margin: 1.5em 105px 1.5em 0;
	padding: 7px 10px;
	min-width: 120px;
	max-width: 100%;
	font-size: 16px;
	padding: 17px 13px;
	border-radius: 12px;
	background: #00b1bb;
	color: #fff;
}

.says_r:after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 18px; 
	right: -24px;
	border: 12px solid transparent;
	border-left: 12px solid #00b1bb;
}

.says_r p,.says_border_r p {
	font-size:14px;
	margin: 0!important;
	padding: 0!important;
}

.says_border_r {
	position: relative;
	display: inline-block;
	float:right;
	margin: 1.5em 105px 1.5em 0;
	padding: 7px 10px;
	min-width: 120px;
	max-width: 100%;
	color: #333;
	font-size: 16px;
	background: #FFF;
	border: solid 3px #c0c0c0;
	box-sizing: border-box;
}

.says_border_r:before {
	content: "";
	position: absolute;
	top: 22px;
	right: -24px;
	margin-top: -12px;
	border: 12px solid transparent;
	border-left: 12px solid #FFF;
	z-index: 2;
}

.says_border_r:after {
	content: "";
	position: absolute;
	top: 22px;
	right: -30px;
	margin-top: -14px;
	border: 14px solid transparent;
	border-left: 14px solid #c0c0c0;
	z-index: 1;
}

/************************************
キャラクターアイコン付き強調ボックス
************************************/
.iconbox{
	margin: 0 auto 2em;
	background: #eafcfc;
	border-radius:4px;
	max-width:700px;
	padding: 0;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
}

.iconbox .box-title {
	font-size: 18px;
	background: #00b1bb;
	text-align: center;
	color: #fff;
	font-weight: bold;
	letter-spacing: 0.05em;
	border-radius:4px 4px 0 0;
	line-height:1.5;
	padding:1em 2em;
}
.iconbox p {
	margin: 0;
	padding: 0;
}
.iconbox .iconbox-wrap{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	padding:1.3em 2em;
}
.iconbox .iconbox-wrap .box-content{
	width: 97%;
	margin: 0 3% 0 0 !important;
	line-height:1.8;
	-ms-flex-item-align: center;
	align-self: center;
}
.iconbox .iconbox-wrap .box-content p{margin-bottom:1em;}

.iconballoon{
	-ms-flex-item-align: end;
	align-self: flex-end;
}

.iconballoon .iconbox_balloon {
	position: relative;
	display: inline-block;
	margin: 1.5em 0;
	padding: 7px 10px;
	min-width: 150px;
	max-width: 100%;
	color: #555;
	font-size: 14px;
	background: #FFF;
	border: solid 3px #555;
	box-sizing: border-box;
	text-align:center;
	border-radius: 10px;
}

.iconballoon .iconbox_balloon:before {
	content: "";
	position: absolute;
	bottom: -24px;
	left: 50%;
	margin-left: -15px;
	border: 12px solid transparent;
	border-top: 12px solid #FFF;
	z-index: 2;
}

.iconballoon .iconbox_balloon:after {
	content: "";
	position: absolute;
	bottom: -30px;
	left: 50%;
	margin-left: -17px;
	border: 14px solid transparent;
	border-top: 14px solid #555;
	z-index: 1;
}

.iconballoon .iconbox_balloon p {
	margin: 0;
	padding: 0;
}

.iconballoon .icon{text-align:center;}
.iconballoon .icon img{
	width: 120px;
	margin:0;
}

.iconbox-red{background: #fff8f9 !important;}
.iconbox-red .box-head-red{background: #d94b59 !important;}
.iconbox .list-number li:before {background: #00b1bb !important;}
.iconbox .list-number_kouji li:before {background: #f6ad49 !important;}
.iconbox .list-number_red li:before {background: #fff8f9 !important;}
.iconbox-kouji{background: #fdf5e6 !important;}
.iconbox-kouji .box-head-kouji{background: #f6ad49 !important;}

@media screen and (max-width: 480px){
	.iconbox .iconbox-wrap {padding: 1em 1em 1em 1.5em;}
	.iconbox .iconbox-wrap .box-content{font-size:14px;}
	.iconballoon .iconbox_balloon {
		margin: 1em 0;
		padding: 7px 5px;
		min-width: 120px;
		max-width: 100%;
		color: #555;
		font-size: 12px;
		line-height: 18px;
		background: #FFF;
		border: solid 2px #555;
		box-sizing: border-box;
		text-align:center;
		border-radius: 10px;
	}

	.iconballoon .iconbox_balloon:before {
		content: "";
		position: absolute;
		bottom: -24px;
		left: 50%;
		margin-left: -15px;
		border: 12px solid transparent;
		border-top: 12px solid #FFF;
		z-index: 2;
	}

	.iconballoon .iconbox_balloon:after {
		content: "";
		position: absolute;
		bottom: -30px;
		left: 50%;
		margin-left: -17px;
		border: 14px solid transparent;
		border-top: 14px solid #555;
		z-index: 1;
	}

	.iconballoon .iconbox_balloon p {
		margin: 0;
		padding: 0;
	}

	.iconballoon .icon{
		text-align:center;
	}
	.iconballoon .icon img{
		width: 120px;
		margin:0;
	}
}

.iconbox .list,.iconbox .list-kouji,.iconbox .list-red {
	list-style: none;
	padding: 0 !important;
	margin: 0 !important;
	border:none;
}
.iconbox .list li,.iconbox .list-kouji li,.iconbox .list-red li { 
	position: relative;
	margin: 0 0 0.5em 0 !important;
	padding: 0 0 0.5em 0.8em !important;
	line-height:1.8;
}
.iconbox .list li:before,.iconbox .list-kouji li:before,.iconbox .list-red li:before { 
	position: absolute;
	content: '';
	top:10px;
	left: 0;
	width: 7px;
	height: 7px;
	border-radius: 4px;
}

.iconbox .list li:before { background-color: #00b1bb; }
.iconbox .list-kouji li:before { background-color: #f6ad49; }
.iconbox .list-red li:before { background-color: #d94b59; }
.iconbox .list-number li:after,.iconbox .list-number-kouji li:after,.iconbox .list-number-red li:after {content:'';}

@media screen and (max-width: 480px){
	.iconbox .list li:before{top:8px;}
}

.iconbox .list-number,.iconbox .list-number-kouji,.iconbox .list-number-red{
	counter-reset:number;
	list-style: none !important;
	padding:0 !important;
	margin:0 !important;
	border:none !important;
}

.iconbox .list-number li,.iconbox .list-number-kouji li,.iconbox .list-number-red li{
	position: relative;
	margin:0.5em 0 !important;
	max-width:500px;
	padding: 0 0 0.5em 1.8em !important;
	line-height:1.8;
}

.iconbox .list-number li:before,.iconbox .list-number-kouji li:before,.iconbox .list-number-red li:before{
	counter-increment: number;
	content: counter(number);
	color: #fff;
	position: absolute;
	font-weight:bold;
	font-size: 14px;
	border-radius: 50%;
	left: 0;
	top:4px;
	width: 22px;
	height: 22px;
	line-height: 22px;
	text-align:center;
}
.iconbox .list-number li:before{background-color: #fdc44f;}
.iconbox .list-number-kouji li:before{background-color: #f6ad49;}
.iconbox .list-number-red li:before{background-color: #d94b59;}

@media screen and (max-width: 480px){
	.iconbox .list-number li,.iconbox .list-number-kouji li,.iconbox .list-number-red li{
		 padding: 0 0 0.5em 2em !important;
	}
	.iconbox .list-number li:before,.iconbox .list-number-kouji li:before,.iconbox .list-number-red li:before{
		font-size:10px;
		width: 18px;
		height: 18px;
		line-height: 18px;
		top:2px;
	}
}


/************************************
セパレートタイプの比較表
************************************/
.compare-box {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	max-width: 95%;
	margin: 0 auto 4rem;
	border-radius:4px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
}
.compare-box .compare-left-wrap, .compare-box .compare-right-wrap{
	width:50%;
	overflow:hidden;
}
.compare-box .compare-left-head, .compare-box .compare-right-head{
	text-align: center;
	color: #FFF;
	font-weight: bold;
	font-size:15px;
	line-height:1.5;
	height:65px;
	display:table-cell;
	vertical-align:middle;
	width:1000px;
}
.compare-box .compare-left-head{border-radius:4px 0 0 0;}
.compare-box .compare-right-head{border-radius:0 4px 0 0;}
.compare-box .compare-left, .compare-box .compare-right{
	padding:1.5em;
	font-size:15px;
	line-height:2;
	text-align: justify;
	text-justify: inter-ideograph;
}
.compare-box p {
	padding: 0;
	margin: 0 0 20px 0;
}

@media screen and (max-width: 480px){
	.compare-box .compare-left-head, .compare-box .compare-right-head{
		font-size:12px;
		height:50px;
	}
	.compare-box .compare-left, .compare-box .compare-right {
		padding: 1.2em;
		font-size: 12px;
	 }
}

.compare-box .list{
	 list-style: none !important;
	 padding:0 !important;
	 margin:0 !important;
	 border:none !important;
}

.compare-box .list li { 
	 border-bottom:1px dashed #cdcdcd;
	 position: relative;
	 margin:0.5em 0 !important;
	 max-width:500px;
	 padding: 0 0 0.7em 1.4em !important;
	 line-height:1.8;
}
.compare-box .list li:last-child{border:none;}
.compare-box .list li:before {
	 position: absolute;
	 content: '';
	 top: 10px;
	 left: 7px;
	 width: 7px;
	 height: 7px;
	 border-radius: 4px;
}

@media screen and (max-width: 480px){
	.compare-box .list li:before {
		top: 9px;
		left: 3px;
		width:5px;
		height:5px;
	}
}

.compare-box-separate .compare-left{
	background:#eafcfc !important;
	height:100%;
}
.compare-box-separate .compare-right{
	background:#fff8f9 !important;
	height:100%;
}
.compare-box-separate .compare-left-head{background:#00b1bb !important;}
.compare-box-separate .compare-right-head{background:#d94b59 !important;}
.compare-box-separate .compare-left .list li:before {background:#00b1bb !important;}
.compare-box-separate .compare-right .list li:before {background:#d94b59 !important;}

/************************************
みやすさ抜群の比較表
************************************/
.comparison-table-wrap{
	width:100%;
	margin: 0 auto 2em;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}
.comparison-table-title{
	background : #00b1bb;
	text-align: center;
	color: #fff;
	font-weight: bold;
	padding: 1em;
	letter-spacing: 1px;
	margin: 0;
	font-size:14px;
	box-shadow: 0 2px 5px rgba(100,100,100,0.1);
}
.comparison-table{
	background:#f8f9fb;
	margin:0;
	padding:0.3em 1em;
}
.comparison-table table{
	border-collapse: separate;
	border-spacing:5px 10px;
	border:none;
	margin-bottom: 0;
}
.comparison-table table th,.comparison-table table td {
	width:50%;
}
.comparison-table table thead th{
	background : #d1d1d1;
	border:none;
	color:#fff;
	box-shadow: 0 2px 5px rgba(100,100,100,0.1);
	padding: 0.8em 0.5em;
	line-height: 1.5;
	border-radius: 3px;
	font-size: 14px;
	text-align:center;
}
.comparison-table table tbody th{
	background : #00b1bb;
	text-align: center;
	color:#fff;
	border:none;
	border-radius:10px;
	box-shadow: 0 2px 5px rgba(0,0,0,0.2);
	padding: 0.4em 1em;
	font-size: 14px;
	line-height: 1.3;
}
.comparison-table table tbody td{
	background:#fff;
	box-shadow: 0 2px 5px rgba(100,100,100,0.1);
	border-radius:3px;
	border:none;
	padding:1.2em;
	color: #555;
	line-height: 1.8;
	text-align:center;
	vertical-align:top;
}
.comparison-table table tbody td p{
	margin:0;
	padding:0;
	margin-bottom:1em;
	font-size: 14px;
}
.comparison-table table tbody td .td-h{
	text-align:center;
	font-weight:bold;
	color:#f6ad49;
	font-size: 16px;
	margin-bottom:7px;
}
@media screen and (max-width: 768px){
	.comparison-table{
		padding:7px;
	}
	.comparison-table table{
		border-spacing:3px 10px;
	}
	.comparison-table table thead th{
		position: -webkit-sticky;
		position: sticky;
		top:0px;
		z-index:100;
	}
}

/************************************
キャラクター付き画像キャプション
************************************/
.figure-caption-icon-wrap{
	margin:0 auto 2em;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
.figure-caption-icon-wrap > figure{
	position:relative;
}
.figure-caption-icon-wrap > figure > img,.figure-caption-icon-wrap > figure >amp-img{
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
	display:block;
}
.figure-caption-icon-wrap > figure > amp-img{
	max-width:800px;
}
.figure-caption-icon-wrap figure figcaption{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	align-items: flex-start;
	position: absolute;
	font-size: 13px;
	line-height: 1.5;
	color:#777;
}
.figure-caption-icon-wrap .caption-icon-img{position: absolute;}
.figure-caption-icon-wrap .img-caption-text{position:relative;}

.figure-caption-icon-1{margin-top:5em;}
.figure-caption-icon-1 > figure figcaption{
	left: 0;
	bottom: calc(100% - 8px);
	min-height: 30px;
	padding: 0.5em 0 25px 4em;
}

.figure-caption-icon-1 > figure figcaption::before{
	position: absolute;
	content: "";
	bottom:0;
	left: 0;
	display: block;
	width: 50px;
	height: 60px;
	background-image: url(http://ancie.jp/blog/wp-content/uploads/2020/02/ch_winchan_cry_r.png);
	background-size: contain;
	background-repeat: no-repeat;
}

.figure-caption-icon-1 .img-caption-text::before, .figure-caption-icon-1 .img-caption-text::after {
	border-bottom: 1px solid #777;
	content: "";
	width: 1em;
	position: absolute;
	top: -8px;
	left: 0;
	transform: rotate(-45deg);
}
.figure-caption-icon-1 .img-caption-text::after {
	top: auto;
	bottom: -8px;
	transform: rotate(45deg);
}

.figure-caption-icon-2{margin-top:5em;}

.figure-caption-icon-2 > figure figcaption{
	left: 0;
	bottom: calc(100% - 8px);
	min-height: 30px;
	padding: 0.5em 0 25px 4em;
}

.figure-caption-icon-2 > figure figcaption::before{
	position: absolute;
	content: "";
	bottom:0;
	left: 0;
	display: block;
	width: 50px;
	height: 60px;
	background-image: url(http://ancie.jp/blog/wp-content/uploads/2020/02/ch_winchan_teach_r.png);
	background-size: contain;
	background-repeat: no-repeat;
}

.figure-caption-icon-2 .img-caption-text::before, .figure-caption-icon-2 .img-caption-text::after {
	border-bottom: 1px solid #777;
	content: "";
	width: 1em;
	position: absolute;
	top: -8px;
	left: 0;
	transform: rotate(-45deg);
}

.figure-caption-icon-2 .img-caption-text::after {
	top: auto;
	bottom: -8px;
	transform: rotate(45deg);
}

/************************************
記事文中に使えるタイトル
************************************/
.insentence-title01 {
	position: relative;
	background: #dfefff;
	box-shadow: 0px 0px 0px 5px #dfefff;
	border: dashed 2px white;
	padding: 0.2em 0.5em;
	color: #454545;
	font-weight:bold;
	margin-bottom:1em;
}

.insentence-title01:after {
	position: absolute;
	content: '';
	left: -7px;
	top: -7px;
	border-width: 0 0 15px 15px;
	border-style: solid;
	border-color: #fff #fff #a8d4ff;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
}

.insentence-title02 {
	position: relative;
	padding: 0.6em;
	background: #e0edff;
	font-weight:bold;
	margin-bottom:1em;
}

.insentence-title02:after {
	position: absolute;
	content: '';
	top: 100%;
	left: 30px;
	border: 15px solid transparent;
	border-top: 15px solid #e0edff;
	width: 0;
	height: 0;
}

.insentence-title03 {
	position: relative;
	padding-left: 1.2em;/*アイコン分のスペース*/
	line-height: 1.4;
	margin-bottom:1em;
}

.insentence-title03:before {
	font-family: "Font Awesome 5 Free";
	content: "\f00c";/*アイコンのユニコード*/
	position: absolute;/*絶対位置*/
	font-size: 1em;/*サイズ*/
	left: 0;/*アイコンの位置*/
	top: 0;/*アイコンの位置*/
	color: #5ab9ff; /*アイコン色*/
}

/************************************
標準リストの編集
************************************/
.list_style02 li::before{
	top: 2px!important;
	width: 26px!important;
	height: 26px!important;
	font-size: 16px!important;
	line-height: 26px!important;
	background:#00b1bb!important;
}

.check-list li::before{
	color: #00b1bb!important;
}

/************************************
下線ありのリスト
************************************/
.list_style03,
.list_style03 ol{
	counter-reset: num;
}

.list_style03{
	margin-left: 22px;
}

.list_style03 li{
	position: relative;
	list-style-type: none;
	margin-bottom: 15px;
	margin-left:-20px;
	padding: 0.1em 0 0.5em 2em;
	border-bottom: dashed 1px silver;
}

.list_style03 li::before{
	position: absolute;
	top: 2px;
	left: -7px;
	width: 26px;
	height: 26px;
	margin-right: 1em;
	margin-left: 0.5em;
	border-radius: 1em;
	background: #00b1bb;
	color: #fff;
	font-size: 16px;
	line-height: 26px;
	text-indent: 0;
	text-align: center;
	vertical-align: middle;
	counter-increment: num;
	content: counter(num);
}
.list_style03 li:last-of-type {
	border-bottom: none; /*最後のliの線だけ消す*/
}

/*下線ありのチェックリスト*/
.check-list02{
	margin-left: 5px;
}

.check-list02 li{
	list-style: none;
}

.check-list02 li{
	position: relative;
	margin-bottom: 1em;
}

.check-list02 li::before{
	position: absolute;
	top: -3px;
	left: -23px;
	display: inline-block;
	font-size: 15px;
	font-family: wp-svg-plugin-icon-set1!important;
	content: "\e0fe";
	color: #00b1bb;
}

/* ボーダー付きチェックリスト */
.check-list03{
	margin-left: 0;
}

.check-list03 li{
	position: relative;
	list-style-type: none;
	margin-bottom: 15px;
	margin-left:-14px;
	padding: 0.1em 0 0.5em 1.5em;
	border-bottom: dashed 1px silver;
}

.check-list03 li::before{
	position: absolute;
	top: -3px;
	left: 0;
	display: inline-block;
	font-size: 15px;
	font-family: wp-svg-plugin-icon-set1!important;
	content: "\e0fe";
	color: #00b1bb;
}
.check-list03 li:last-of-type {
	border-bottom: none; /*最後のliの線だけ消す*/
}

/************************************
ボタンデザイン
************************************/
a.btn_arrow_rc {
	display: flex;
	justify-content: center;
	align-items: center;
	margin:0 auto;
	width: 80%;
	height: 50px;
	position: relative;
	background: #00b1bb;
	border: 1px solid #00b1bb;
	border-radius: 30px;
	box-sizing: border-box;
	padding: 0 45px 0 25px;
	color: #fff;
	font-size: 16px;
	letter-spacing: 0.1em;
	line-height: 1.3;
	text-align: left;
	text-decoration: none;
	transition-duration: 0.3s;
}
a.btn_arrow_rc:before {
	content: '';
	width: 8px;
	height: 8px;
	border: 0;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: rotate(45deg);
	position: absolute;
	top: 50%;
	right: 25px;
	margin-top: -6px;
}
a.btn_arrow_rc:hover {
	background: #fff;
	color: #00b1bb;
}
a.btn_arrow_rc:hover:before {
	border-top: 2px solid #00b1bb;
	border-right: 2px solid #00b1bb;
}

@media screen and (max-width: 480px){
	a.btn_arrow_rc {
		margin:0 auto;
		width: 100%;
		padding: 0 25px 0 10px;
		font-size: 14px;
	}
	a.btn_arrow_rc,a.btn_animation { width:100%; }

}

.btn_animation{
	width: 80%;
	height: 50px;
	line-height: 50px;	
	background-color: #00b1bb;
	border-radius: 8px;
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	display: inline-block;
	position: relative;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: -webkit-transform;
	transition-property: transform;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-transform: translateY(-6px);
	-ms-transform: translateY(-6px);
	transform: translateY(-6px);
	-webkit-animation-name: hover;
	animation-name: hover;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	animation-direction: alternate;
	&:before{
		pointer-events: none;
			position: absolute;
			z-index: -1;
			content: '';
			top: 100%;
			left: 5%;
			height: 10px;
			width: 90%;
			opacity: 0;
			background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
			background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
			-webkit-transition-duration: 0.3s;
			transition-duration: 0.3s;
			-webkit-transition-property: -webkit-transform, opacity;
			transition-property: transform, opacity;
			opacity: .4;
			-webkit-transform: translateY(6px);
			-ms-transform: translateY(6px);
			transform: translateY(6px);
			-webkit-animation-name: hover-shadow;
			animation-name: hover-shadow;
			-webkit-animation-duration: 1.5s;
			animation-duration: 1.5s;
			-webkit-animation-delay: .3s;
			animation-delay: .3s;
			-webkit-animation-timing-function: linear;
			animation-timing-function: linear;
			-webkit-animation-iteration-count: infinite;
			animation-iteration-count: infinite;
			-webkit-animation-direction: alternate;
			animation-direction: alternate;
	}
	&:hover{
		background-color: #e16e50;
	}
}

@keyframes hover {
	50% {
		-webkit-transform: translateY(-3px);
		-ms-transform: translateY(-3px);
		transform: translateY(-3px);
	}

	100% {
		-webkit-transform: translateY(-6px);
		-ms-transform: translateY(-6px);
		transform: translateY(-6px);
	}
}

@-webkit-keyframes hover-shadow {
	0% {
		-webkit-transform: translateY(6px);
		transform: translateY(6px);
		opacity: .4;
	}

	50% {
		-webkit-transform: translateY(3px);
		transform: translateY(3px);
		opacity: 1;
	}

	100% {
		-webkit-transform: translateY(6px);
		transform: translateY(6px);
		opacity: .4;
	}
}

@keyframes hover-shadow {
	0% {
		-webkit-transform: translateY(6px);
		-ms-transform: translateY(6px);
		transform: translateY(6px);
		opacity: .4;
	}

	50% {
		-webkit-transform: translateY(3px);
		-ms-transform: translateY(3px);
		transform: translateY(3px);
		opacity: 1;
	}

	100% {
		-webkit-transform: translateY(6px);
		-ms-transform: translateY(6px);
		transform: translateY(6px);
		opacity: .4;
	}
}

@-webkit-keyframes hover {
	50% {
		-webkit-transform: translateY(-3px);
		transform: translateY(-3px);
	}

	100% {
		-webkit-transform: translateY(-6px);
		transform: translateY(-6px);
	}
}

@keyframes hover {
	50% {
		-webkit-transform: translateY(-3px);
		-ms-transform: translateY(-3px);
		transform: translateY(-3px);
	}

	100% {
		-webkit-transform: translateY(-6px);
		-ms-transform: translateY(-6px);
		transform: translateY(-6px);
	}
}

/* ボタンのデザイン */
.btn-check {
	position: relative;
	font-weight: bold;
	padding: 15px 0 15px 30px;
	margin: 30px auto;
	border-radius: 30px;
	font-size: 16px;
	width:100%;
	text-align:center;
	background-color: #FB869E;
	color: #fff;
	display: inline-block;
	text-shadow: 1px 1px 0px rgb(140, 140, 140, 0.3);
	box-shadow: 0 3px 0 rgb(140, 140, 140, 0.3);
}
.btn-check:before {
	content: '';
	width: 10px;
	height: 10px;
	border: 0;
	border-bottom: solid 2px #fff;
	border-right: solid 2px #fff;
	position: absolute;
	top: 50%;
	left: 20px;
	margin-top: -6px;
	transform: rotate(45deg);
}
a:hover .btn-check {
	opacity: 0.7;
	box-shadow: 0 0px 0 rgb(140, 140, 140, 0.3);
	animation-play-state: paused;
	top: 3px;
}
.anm01 {
	animation: anm01 2s infinite;
	box-shadow: 0 3px 0 rgb(140, 140, 140, 0.3);
}
@keyframes anm01 {
	0% {
		box-shadow: 0 3px 0 rgb(140, 140, 140, 0.3);
		top: 0px;
	}
	10% {
		box-shadow: 0 0 0 rgb(140, 140, 140, 0.3);
		top: 3px;
	}
	20% {
		box-shadow: 0 3px 0 rgb(140, 140, 140, 0.3);
		top: 0px;
	}
	30% {
		box-shadow: 0 0 0 rgb(140, 140, 140, 0.3);
		top: 3px;
	}
	40% {
		box-shadow: 0 3px 0 rgb(140, 140, 140, 0.3);
		top: 0px;
	}
}

.btn-check02 {
	position: relative;
	font-weight: bold;
	padding: 15px 0;
	margin: 30px auto;
	border-radius: 0;
	font-size: 16px;
	width:100%;
	text-align:center;
	background-color: #FB869E;
	color: #fff;
	display: inline-block;
	text-shadow: 1px 1px 0px rgb(140, 140, 140, 0.3);
	box-shadow: 0 3px 0 rgb(140, 140, 140, 0.3);
}
.btn-check02:before {
	content: '';
	width: 10px;
	height: 10px;
	border: 0;
	border-bottom: solid 2px #fff;
	border-right: solid 2px #fff;
	position: absolute;
	top: 50%;
	right: 30px;
	margin-top: -6px;
	transform: rotate(-45deg);
}
a:hover .btn-check02 {
	opacity: 0.7;
	box-shadow: 0 0px 0 rgb(140, 140, 140, 0.3);
	animation-play-state: paused;
	top: 3px;
}

/************************************
アコーディオンボックス
************************************/
.accordion_box *, .accordion_box *:before, .accordion_box *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.accordion_box {
	position: relative;
}
.accordion_box label {
	position: absolute;
	z-index: 1;
	bottom: 0;
	width: 100%;
	height: 140px; /* グラデーションの高さ */
	cursor: pointer;
	text-align: center;
	background: linear-gradient(to bottom, rgba(251, 252, 248, 0) 0%, rgba(251, 252, 248, 0.99) 75%);
}
.accordion_box input:checked + label {
	background: inherit;
}
.accordion_box label:after {
	line-height: 2.5rem;
	position: absolute;
	z-index: 2;
	padding:5px;
	bottom: 0px;
	left: 50%;
	width: 16rem;
	font-family: wp-svg-plugin-icon-set1!important;
	content: '\e102'' 続きをよむ';
	transform: translate(-50%, 0);
	letter-spacing: 0.05em;
	font-size:14px;
	color: #ffffff;
	border-radius: 20px;
	background-color: #807E7E;
}
.accordion_box input {
	display: none;
}
.accordion_box .accordion_container {
	overflow: hidden;
	height: 400px;
	transition: all 0.5s;
}
.accordion_box input:checked + label:after {
	font-family: wp-svg-plugin-icon-set1!important;
	content: '\e101'' 閉じる';
}
.accordion_box input:checked ~ .accordion_container {
	height: auto;
	padding-bottom: 80px;
	transition: all 0.5s;
}

/************************************
Q&Aボックス
************************************/
.boxQA {
	position: relative;
	margin: 2em 0;
	padding: 0.5em 0.5em;
	background: #EDF1F5;
	border-radius: 10px;
}

.boxQA .box-title {
	position: relative;
	background: #fff;
	padding: 12px 5px 10px 30px;
	color: #454545;
	border-radius: 10px;
}
.boxQA .box-title:before {
	content: "Q";
	display: inline-block;
	line-height: 35px!important;
	position: absolute;
	padding: 0em;
	color: white;
	background: #00b1bb;
	font-weight: bold;
	width: 40px;
	text-align: center;
	height: 40px;
	line-height: 40px;
	left: -1.2em;
	top: 25px;
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	border: solid 3px white; 
	border-radius: 50%;
}
.boxQA .box-title:after {
	content: "A";
	display: inline-block;
	line-height: 35px!important;
	position: absolute;
	padding: 0em;
	color: white;
	background: #d94b59;
	font-weight: bold;
	width: 40px;
	text-align: center;
	height: 40px;
	line-height: 40px;
	left: -1.2em;
	bottom: -80px;
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	border: solid 3px white; 
	border-radius: 50%;
}

.boxQA p {
	padding: 25px 20px 15px 30px;
	line-height:25px;
	margin: 0!important;
}

.boxQA ul {
	padding: 0 1em;
	position: relative;
}
.boxQA ul li {
	line-height: 1.5;
	padding: 0.5em 0 0.5em 4.2em;
	list-style-type: none!important;
}
.boxQA ul li:before {
	font-family: "FontAwesome";
	content: "\f138";
	position: absolute;
	left : 3.5em;
	color: #FFAB8B;
}

/************************************
囲み枠
************************************/
.box-frame01 {
	padding: 0.5em 1em;
	margin: 2em 0;
	border: solid 3px #555;
}
.box-frame01 p {
	margin: 0!important; 
	padding: 0;
}

.box-frame02 {
	padding: 0.5em 1em;
	margin: 2em 0;
	border: solid 3px #00b1bb;
	position: relative;
}
.box-frame02 p {
	margin: 0!important; 
	padding: 0;
}

.box-frame02-title {
	position: absolute;
	top: -1.2em;
	left: 5px;
	font-weight: bold;
	font-size: 16px;
	background: #fff;
	padding: 0 0.5em;
	color:#00b1bb;
}

.box-frame03 {
	margin: 2em auto;
	padding: 1em;
	color: #666;
	background-color: #f7f7f7;
	border: 1px solid #ccc;
}

.box-frame03 p {
	margin:0;
	padding:0;
	font-size:14px;
}

.box-frame04 {
	margin: 2em auto;
	padding: 1em;
	color: #666;
	background-color: #eafcfc;
	border: 2px dashed #00b1bb;
}

.box-frame04 p {
	margin:0!important;
	padding:0;
}

.box-frame05{
	margin: 1em 0;
	background-color: #FDF5E6;
	padding: 1em;
}

.box-frame05 p{
	margin: 0!important;
	padding: 0;
}

.box-frame06 {
	position: relative;
	margin: 2em auto;
	padding: 1em;
	border-style: solid;
	border-color: #4dc8cf;
	border-width: 5px 1px 1px;
	background-color: #eafcfc;
	color: #555;
	box-shadow: 1px 1px 3px #ccc;
}

.box-frame06 p {
	padding: 0;
	margin: 0!important;
}

.box-frame07 {
	position: relative;
	margin: 2em auto;
	padding: 1em;
	border-style: solid;
	border-color: #f6ad49;
	border-width: 5px 1px 1px;
	background-color: #FDF5E6;
	color: #555;
	box-shadow: 1px 1px 3px #ccc;
}

.box-frame07 p {
	padding: 0;
	margin: 0!important;
}

.box-frame08 {
	position: relative;
	margin: 2em auto;
	padding: 1em;
	border-style: solid;
	border-color: #d94b59;
	border-width: 5px 1px 1px;
	background-color: #fff8f9;
	color: #555;
	box-shadow: 1px 1px 3px #ccc;
}

.box-frame08 p {
	padding: 0;
	margin: 0!important;
}

/* アイコン付きボックス */
.box-frame09 {
    position: relative;
    margin: 2em 0;
    padding: 0.8em 0 0.5em;
    border: solid 1px #333;
}
.box-frame09 .box-title {
    position: absolute;
    display: inline-block;
    top: -20px;
    left: -15px;
    padding: 5px 20px;
    margin-bottom: 15px;
    line-height: 1;
    background:#fff;
    font-size: 16px;
    color: #4c4c4c;
    font-weight: bold;
}
.box-frame09 p {
  padding:15px 0 5px 20px;
  margin: 0!important;
  font-size:15px;
}

.box-frame10 {
    margin: 2em 0;
    background: #eafcfc;
}
.box-frame10 .box-title {
    font-size: 16px;
    background: #00b1bb;
    padding: 15px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.05em;
}
.box-frame10 p {
    padding: 15px 20px;
    margin: 0;
}

.box-frame11 {
    margin: 2em 0;
    background: #fff8f9;
}
.box-frame11 .box-title {
    font-size: 16px;
    background: #d94b59;
    padding: 4px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.05em;
}
.box-frame11 p {
    padding: 15px 20px;
    margin: 0;
}

.box-frame12 {
	margin: 1em 0;
	padding: 1em;
	position: relative;
	border: 1px solid #555;
}

.box-frame12-title {
	position: absolute;
	top: -1.2em;
	left: 5px;
	font-weight: bold;
	font-size: 16px;
	background: #fff;
	padding: 0 0.5em;
}

.box-frame12 p {
	margin: 0;
	padding: 0;
}

/* 手紙風デザイン */
.box-frame13 {
	border: 1px solid #dddddd;
	background-color: #fbfcf8;
	margin: 30px 0;
	padding: 20px 40px 40px;
}
.box-frame13 p {
	line-height: 36px;
	background: url(https://ancie.jp/blog/wp-content/uploads/box-design10.png) bottom;
	margin: 0;
	padding: 0;
}

@media screen and (max-width: 768px) {
    .box-frame13 {
    	margin: 40px 0;
    	padding: 15px 15px 40px;
    }
}

.box_style_anciecolor{
	margin-bottom: 30px;
	padding: 6px;
	background-size: 4px 4px;
	background-repeat: repeat;
	font-size: 1.4rem!important;
}
.box_style_anciecolor .box_inner{ padding: 15px; }
.box_style_anciecolor .box_style_title{
	margin: -8px 0 5px -27px;
	color: #fff;
	line-height: 1.4;
}
.box_style_anciecolor{
	background-image: linear-gradient(
			-45deg,
			#fff 25%,
			#00b1bb 25%, #00b1bb 50%,
			#fff 50%, #fff 75%,
			#00b1bb 75%, #00b1bb
	);
}
.box_style_anciecolor .box_inner{ background-color: #f8fdff; }
.box_style_anciecolor .list_style02 li::before,
.box_style_anciecolor .box_style_title span{ background-color: #00b1bb;}

/* テーブルの設定 */
table { margin-bottom:4rem; }

th,td{
	padding: 1.2em .75em!important;
}

th{
	border: 1px solid #ddd;
	background-color: #00b1bb;
	color: #fff;
	font-weight: bold;
	text-align: left;
}

td{
	border: 1px solid #ddd;
}

tbody th{
	background: #00b1bb;
	border: 1px solid #ddd;
	color: #fff;
	text-align: center;
}

table caption{
	font-size:16px;
	text-align:center;
}

.table-universal{
	border-collapse: collapse;
	border: 1px solid #ccc;
	line-height: 1.5;
}

.table-universal th {
	padding: 10px;
	font-weight: bold;
	vertical-align: middle;
	background: #00b1bb;
	color: #fff;
}
.table-universal td {
	padding: 10px;
	vertical-align: middle;
}

.table-universal .td_title{background: #eafcfc;}

.table-alternate {
	border-collapse: collapse;
	border: 1px solid #ccc;
	line-height: 1.5;
}
.table-alternate th {
	padding: 10px;
	font-weight: bold;
	vertical-align: top;
	background: #00b1bb;
	color: #fff;
}
.table-alternate td {
	padding: 10px;
	vertical-align: top;
}
.table-alternate tr:nth-child(even) {background: #eafcfc;}

/************************************
スクロールできるテーブル
************************************/
.p-sticky-table{
	white-space: nowrap;
	line-height:1.6;
}
.p-sticky-table table{
	border:none;
	border: 1px solid #dedede;
	border-bottom: none;
	border-collapse: collapse;
	word-break: break-all;
	table-layout: fixed;
	display:block;
	overflow:scroll;
	max-height: 80vh;
}
.p-sticky-table thead th:first-child {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	left: 0;
	z-index: 3;
}
.p-sticky-table thead th {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 2;
	text-align:center;
	background: #00b1bb!important;
	color:#fff!important;
	font-size:14px!important;
}
.p-sticky-table tbody th:first-child{
	position: -webkit-sticky;
	position: sticky;
	left: 0;
	z-index: 1;
	border:none;
	white-space: normal;
	min-width: 150px;
}
.p-sticky-table th, .p-sticky-table td {
	min-width: 50px;
	text-align: left;
	font-size: 16px !important;
	position: relative;
	padding: 13px !important;
	color: #333;
	border: none !important;
	z-index: 0;
	text-align:center;
	vertical-align:middle !important;
	background:#fff;
}
.p-sticky-table th{
	background:#eafcfc;
	letter-spacing: 1px;
	font-weight: 600 !important;
	color: #555 !important;
}
.p-sticky-table tr{
	border-bottom:none !important;
}
.p-sticky-table img{
	margin: 10px auto;
	display: block;
	padding: 0;
	max-width: 80% !important;
}
.p-sticky-table table th::before, .p-sticky-table table td::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	border-right: 1px solid #dedede;
	border-bottom: 1px solid #dedede;
	z-index: -1;
}
@media screen and (max-width: 560px) {
	.p-sticky-table table {max-height: 60vh;}
	.p-sticky-table thead th:first-child, .p-sticky-table tbody th:first-child {
		min-width: 25vw;
		font-size:14px !important;
		text-align:center;
	}
	 .p-sticky-table th, .p-sticky-table td {
		font-size: 13px !important;
		padding: 12px !important;
	}
}
.pst-center td {
	text-align: center;
}

/************************************
結婚・婚約指輪の評価用のテーブル
************************************/
.table-diamond{
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.table-diamond::before{
	content: "※スクロールできます"
	font-size:12px;
}

.table-diamond{
	border-collapse: collapse;
	line-height: 1.5;
}

.table-diamond td {
	padding: .5em .75em!important;
	vertical-align: middle;
	font-size: 1.4rem;
	text-align: center!important;
}

.table-diamond .td_title { background: #eafcfc; }

.table-diamond caption{
	font-weight:bold;
	font-size:16px;
	text-align:left;
}

@media screen and (max-width: 560px) {
	.table-diamond td {
		padding: .5em .5em!important;
		vertical-align: middle;
		font-size: 1.2rem;
	}
}

/* 商品紹介ボックス */
.box-afitem{
	display: flex;
	width: 100%;
	margin-bottom: 20px;
	background: #f5f5f5;
	padding:15px;
}

.box-afitem-image {
	padding: 0 20px;
	margin: auto 0;
	width: 300px;
	height: auto;
	flex-shrink: 0;
}

.box-afitem-info{
	padding: 0 20px;
	width: 80%;
}
.box-afitem-detail{
	margin-top: 5px;
}
.link-button{ margin-bottom: 5px; }
.link-button a { text-decoration:none!important; }
.link-button a:hover { text-decoration:none!important; }
.c-rakuten {
	background:#bf0000!important;
	color:#fff!important;
}
.c-amazon {
	background:#ff9900!important;
	color:#fff!important;
}
.c-paypay {
	background:#8b6f0c!important;
	color:#fff!important;
}
.c-blue {
	background:#1990c7!important;
	color:#fff!important;
}
.c-pink{
	background:#f88cbd!important;
	color:#fff!important;
}
.c-green{
	background:#4cb7c3!important;
	color:#fff!important;
}
.c-red{
	background:#ef007f!important;
	color:#fff!important;
}

@media screen and (max-width: 480px) {
	.box-afitem{
		display: block;
		text-align: center;
		width: 100%;
	}
	
	.box-afitem-info{
		padding:0;
		width:95%;
		margin: 10px auto 0;
	}
	
	.box-afitem-detail {
		text-align:left;
		line-height:24px;
	}
 
	.box-afitem-image{
		max-width: 100%;
		padding: 0 20px;
		margin:0 auto;
	}
    .box-afitem-image a img{
	    max-width: 250px;
    	padding: 0;
    }
	.btn-two{
		margin: 0 5px;
		width: 100%;
	}
}

/* 商品を並列に並べる商品紹介（旧ブログと同じclass名） */
.box-design09 {
	display: block;
	position: relative;
	margin: -20px auto 15px;
	padding: 10px 0;
	width: 99%;
	background: #f1f1f1;
	box-sizing: border-box;
	font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
}

.box-design09 .box-design09_title {
	position: relative;
	display: inline-block;
	margin: 15px 0 30px !important;
	font-size: 20px;
	line-height: 28px;
	color: #222;
	text-align: center;
	display: block;
	padding: 0;
	font-weight: 500;
}

.box-design09 .box-design09_title:after {
	content: '';
	position: absolute;
	left: 47.5%;
	bottom: -12px;
	display: inline-block;
	width: 80px;
	height: 2px;
	-moz-transform: translateX(-27%);
	-webkit-transform: translateX(-27%);
	-ms-transform: translateX(-27%);
	transform: translateX(-27%);
	background-color: #555;
	border-radius: 2px;
}

.ribbon01 {
	display: inline-block;
	position: absolute;
	top: 0;
	right: 10px;
	margin: 0;
	padding: 10px 0;
	z-index: 2;
	width: 56px;
	text-align: center;
	font-size: 24px;
	color: white;
	background: #00afb5;
}

.ribbon01:after{
	content: '';
	position: absolute;
	left: 0;
	top: 100%;
	height: 0;
	width: 0;
	border-left: 28px solid #00afb5;
	border-right: 28px solid #00afb5;
	border-bottom: 10px solid transparent;
}

.box-design09 .itemList {
	overflow: hidden;
	clear: both;
	width: 99%;
	padding: 0 0 0 1.5%;
	margin:auto;
}
.box-design09 .itemList li {
	float: left;
	width: 49%;
	padding: 0 1.5%;
	list-style-type: none;
}
.box-design09 .itemList li a {
	display: block;
	border: 1px solid #ddd;
	background:#fff;
	font-size:12px;
}

.box-design09 .itemList li img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

@media screen and (max-width : 640px) {
.box-design09 {
	display: block;
	position: relative;
	margin: -25px auto 15px;
	padding: 10px 0;
	width: 99%;
	background: #f1f1f1;
	box-sizing: border-box;
	font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
}

.box-design09 .box-design09_title {
	position: relative;
	display: inline-block;
	margin: 15px 0 30px !important;
	font-size: 16px;
	line-height: 22px;
	color: #222;
	text-align: center;
	display: block;
	padding: 0;
	font-weight: 500;
}

.box-design09 .box-design09_title:after {
	content: '';
	position: absolute;
	left: 45.5%;
	bottom: -12px;
	display: inline-block;
	width: 80px;
	height: 1.1px;
	-moz-transform: translateX(-27%);
	-webkit-transform: translateX(-27%);
	-ms-transform: translateX(-27%);
	transform: translateX(-27%);
	background-color: #222;
	border-radius: 2px;
}

.ribbon01 {
	display: inline-block;
	position: absolute;
	top: 0;
	right: 10px;
	margin: 0;
	padding: 7px 0;
	z-index: 2;
	width: 50px;
	text-align: center;
	font-size: 24px;
	color: white;
	background: #00afb5;
}

.ribbon01:after{
	content: '';
	position: absolute;
	left: 0;
	top: 100%;
	height: 0;
	width: 0;
	border-left: 25px solid #00afb5;
	border-right: 25px solid #00afb5;
	border-bottom: 5px solid transparent;
}
}

/* 画像とテキストの横並びボックス */
.box-imgtxt{
	display: flex;
	width: 100%;
	margin-bottom: 60px;
	padding:0;
}

.box-imgtxt-image {
	padding: 10px 0 0 0;
	margin: 0 auto;
	height: auto;
	font-size:12px;
}
.box-imgtxt-image img{
	max-width: 300px;
	height: auto;
}
.box-imgtxt-image a img{
	max-width: 300px;
	height: auto;
}
.box-imgtxt-info{
	padding: 10px 0 0 20px;
	text-align:left;
}

@media screen and (max-width: 1024px) {
	.box-imgtxt {
		margin-top:10px;
		display: block;
		text-align: center;
		width: 100%;
	}
    .box-imgtxt-image img{
    	padding-right: 0;
    }
	.box-imgtxt-image a img{
		max-width:300px;
		padding-right: 0;
	}
	.box-imgtxt-info{
		padding:0;
		width:95%;
		margin: 10px auto 0;
	}
	.box-imgtxt-image{
		max-width: 100%;
	}
}

/* 装飾のあるステップ図 */
.ptimeline-wrap {
    margin: 0 auto 2rem;
}

.ptimeline-wrap .ptimeline {
    padding: 0 !important;
	margin-left:0!important;
    list-style: none !important;
}

.ptimeline-wrap .ptimeline-item {
    position: relative;
    padding: 0 0 1em 1.5em !important;
    margin-bottom: 0 !important;
    border: none;
}

.ptimeline-wrap .ptimeline .ptimeline-item:before {
    content: "";
    width: 3px;
    background: #eee !important;
    display: block;
    position: absolute;
    top: 25px;
    bottom: -3px;
    left: 5px;
}

.ptimeline-wrap .ptimeline-label {
    padding: 3px 0 0 2px;
    color: #aaa;
    font-size: 12px;
    font-weight: 500;
}

.ptimeline-wrap .ptimeline-title {
    font-size: 1.1em;
    font-weight: bold;
    line-height: 1.5;
    color: #00b1bb;
}

.ptimeline-wrap .ptimeline-main {
    margin-top: 0.5em;
    padding: 0 0 1.5em;
    font-size: 0.9em;
    line-height: 1.8;
    border-bottom: dashed 1px #ddd;
    color: #555;
}

.ptimeline-wrap .ptimeline-item:first-child .ptimeline-marker, .ptimeline-wrap .ptimeline-item:last-child .ptimeline-marker {
    background: #00b1bb;
}

.ptimeline-wrap .ptimeline-marker {
    display: block;
    position: absolute;
    content: "";
    top: 6px;
    left: 0;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: solid 3px #00b1bb;
}

/************************************
EC商品ショートコード用
************************************/
.c-ancie-item-widget:not(.c-ancie-item-widget--pattern-4) { width:320px; }
.c-ancie-item-widget__brand { font-size:12px!important; }
.c-ancie-item-widget__name { font-size:14px!important; }
.c-ancie-item-widget:hover:not(.c-ancie-item-widget--pattern-4) { text-decoration:none!important; }

@media screen and (max-width: 480px) {
.c-ancie-item-widget:not(.c-ancie-item-widget--pattern-4) { width:100%; }
}

/************************************
ランキング用
************************************/
.ranking-list {
  margin-right: 0;
  margin-left: 0;
  padding: 0 !important;
}

.ranking-list li {
  list-style: none;
  overflow: hidden;
  margin-bottom: 10px;
}

.ranking-title {
  border: none!important;
  background: none;
  font-size: 16px;
  padding:3px 0 0 45px!important;
  text-align:left;
  font-weight:bold;
  display:block!important;
}

.ranking-list h3:after {
	border: none!important;
}

.article-body h4.ranking-title:before{content: none;}

/* 入れ子ランキング */
ol.ranking_item{
	counter-reset:number;
	list-style-type: none!important;
	margin:0;
	background:#f8f9fb;
	text-align:left;
	padding:25px 50px;
}
ol.ranking_item li{
	position: relative;
	line-height: 1.5em;
	margin-bottom:25px!important;
}

ol.ranking_item li img {
    margin:0 auto;
}

ol.ranking_item li:before{
	position: absolute;
	counter-increment: number;
	content: counter(number);
	display:inline-block;
	background: #00b1bb;
	color: white;
	font-family: 'Avenir','Arial Black','Arial',sans-serif;
	font-weight:bold;
	font-size: 15px;
	border-radius: 50%;
	left: 0;
	width: 25px;
	height: 25px;
	line-height: 25px;
	text-align:center;
}

ol.ranking_item p {
	margin-bottom:5px;
	margin-top:15px;
}
/* 入れ子ランキングタイトル */
.ranking-list .ranking_item_title {
	margin:0;
	padding:10px 0;
	font-weight:100;
	font-size:16px;
	background:#00b1bb;
	color:#fff;
	border-left:0;
}

.ranking-list .ranking_item_title:before,.ranking-list .ranking_item_title:after {
    color:rgb(232,202,0);
	content: "\e0d0";
	font-family: wp-svg-plugin-icon-set1!important;
	padding:0 5px;
}

@media screen and (max-width: 480px) {
	ol.ranking_item{ padding: 20px 20px 1px;}
}

/* 改行の設定（指定するとPCとSPで表示非表示を設定） */
@media screen and (min-width: 680px){
	.pc_br { display:block; }
	.sp_br { display:none; }
}

@media screen and (max-width: 680px){
	.pc_br { display:none; }
	.sp_br { display:block; }
}

/* ボタンの装飾 */
.btn-detail_col a:hover{ text-decoration:none!important; }

/* カラー追加 */
.kouji{ color: #f6ad49!important; }
.mintgreen{ color: #00b1bb!important; }
.cosmos { color: #f39aab!important; }
.darkgray{ color:#333; }
.seagreen{ color:#2e8b57; }
.silver{ color:#c0c0c0; }

/* メインメニュー */
.keni-gnav_inner li a:hover{
	text-decoration:none!important;
}

/* アイコンの位置調整 */
.wp-icon {
	position:relative;
	top:4px;
}

/* ページ内メニュー */
.page_menu {
	list-style: none;
	overflow: hidden;
	margin:0;
}

.page_menu li {
	width: 49%;
	text-align: left;
	background: #00afb5;  
	float: left;
	height: 50px;
	margin-right: 2%;
	margin-bottom:20px;
	padding: 10px;
}
.page_menu li:nth-child(even) {
	margin-right:0;
}

.page_menu li a {
  position: relative;
  display: inline-block;
	text-decoration: none;
	color: #fff;
	padding-left:20px;
	font-weight: bold;
	display: block;
}

.page_menu li a:before {
  content: '';
  width: 10px;
  height: 10px;
  border: 0;
  border-bottom: solid 2px #fff;
  border-right: solid 2px #fff;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -6px;
  transform: rotate(45deg);
}

@media screen and (max-width: 480px) {
	.page_menu li {
		width:100%;
		margin-right: 0;
		margin-bottom:15px;
	}
}

.page_menu02 {
	list-style: none;
	overflow: hidden;
	margin:0;
}

.page_menu02 li {
	width: 49%;
	text-align: left;
	background: #f7f7f7;  
	float: left;
	border:1.2px solid #252525;
	height: 50px;
	margin-right: 2%;
	margin-bottom:20px;
	padding: 10px;
}
.page_menu02 li:nth-child(even) {
	margin-right:0;
}

.page_menu02 li a {
  position: relative;
  display: inline-block;
	text-decoration: none;
	color: #252525;
	padding-left:20px;
	font-weight: bold;
	display: block;
}

.page_menu02 li a:hover {
	text-decoration: none!important;
	opacity:0.4;
}


.page_menu02 li a:before {
  content: '';
  width: 10px;
  height: 10px;
  border: 0;
  border-bottom: solid 2px #252525;
  border-right: solid 2px #252525;
  position: absolute;
  top: 50%;
  left: 0;
  margin-left:3px;
  margin-top: -8px;
  transform: rotate(45deg);
}

@media screen and (max-width: 480px) {
	.page_menu02 li {
		width:100%;
		margin-right: 0;
		margin-bottom:15px;
	}
}

/* ページ内ナビゲーション */
.page_menu03 {
	margin: 40px 0 15px;
}
.page_menu03 ul {
	max-width: 780px;
	margin: auto;
	align-items: center;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
}
.page_menu03 ul > li {
	flex: 1;
	list-style:none;
	text-align: left;
	background-color:#eafcfc;
	margin-right:10px;
	min-width:200px;
	max-width:250px;
}
.page_menu03 ul > li a {
	display: block;
	padding: 15px 0 15px 15px;
	position: relative;
	color:#053063;
	font-size:16px;
	height: 100%;
	width: 100%
	height:25px;
	line-height:25px;
	vertical-align: middle;
}
.page_menu03 ul > li a:hover {
	text-decoration:none!important;
	background-color:#ededed;
}

.page_menu03 ul > li a:before {
	content: "";
	display: inline-block;
	background: url(https://ancie.jp/blog/wp-content/uploads/icon-municipalities_down.svg) no-repeat center center;
	background-size: contain;
	width: 1.5em;
	height: 1.5em;
	vertical-align: middle;
}

@media screen and (max-width:480px) {
	.page_menu03 ul > li {
		min-width:162px;
	}
	.page_menu03 ul > li:nth-child(even){ margin-right:0; }
}

/* アイコン風のリスト */
.item-list_name{
	display: inline-block;
	padding: 10px;
	color: #fff;
	font-size: 1.2rem;
	line-height: 1;
	border-radius:3px;
}

.item-list_cat001{
	background-color: #7b9ad0!important;
	color: #fff;
}

.item-list_cat002{
	background-color: #e5ab47!important;
	color: #fff;
}

.item-list_cat003{
	background-color: #66b7ec!important;
	color: #fff;
}

.item-list_cat004{
	background-color: #e1cea3!important;
	color: #fff;
}

.item-list_cat005{
	background-color: #ae8dbc!important;
	color: #fff;
}

.item-list_cat006{
	background-color: #c08e47!important;
	color: #fff;
}

.item-list_cat007{
	background-color: #51a1a2!important;
	color: #fff;
}

.item-list_cat008{
	background-color: #b1d7e4!important;
	color: #fff;
}

.item-list_cat009{
	background-color: #d5848b!important;
	color: #fff;
}

.item-list_cat010{
	background-color: #f8e352!important;
	color: #fff;
}

.t-icon {
	padding-left:25px!important;
	text-indent:-25px;
	line-height:24px;
}

.t-icon a {
    text-decoration:underline;
}

.t-icon a:hover {
    opacity:0.7;
    color:#
    text-decoration:none!important;
}

/* もっと見るのリンク */
.more_specifically_last,.more_specifically {
	margin:0;
	border-top:0.8px solid #e1e1e1;
	padding:5px 0 0;
}
.more_specifically_last {
	margin-top:0;
	margin-bottom:40px;
	border-bottom: 0.8px solid #e1e1e1;
}

.more_specifically .moreLink {
	display: flex;
	padding: 10px 0;
	position: relative;
	width: 100%;
	justify-content: space-between;
	flex-wrap: wrap;
}
.more_specifically .moreLink p {
	margin:0;
}

.more_specifically .moreLink .ml-img {
	width:30%;
	bottom: 0;
	margin:0;
	padding:0;
}
.more_specifically .moreLink .ml-title {
	width:70%;
	font-weight:bold;
	font-size:16px;
}
.more_specifically .moreLink .ml-lead {
	font-weight:normal;
	position: absolute;
	right:0;
	top:30%;
	width:70%;
	margin:0;
}

.more_specifically .arrow {
	position: relative;
	padding-right: 20px;
	margin:0;
	display: -webkit-box;
	overflow: hidden;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}
.more_specifically .arrow:after {
	content: '';
	position: absolute;
	top: 50%;
	right: 3px;
	margin-top: -4px;
	width: 10px;
	height: 10px;
	border: 0px;
	border-top: solid 2px #00BAC4;
	border-right: solid 2px #00BAC4;
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

@media screen and (max-width: 1024px) {
	.more_specifically .moreLink { padding: 10px 0 0; }
	.more_specifically .arrow {
		position: relative;
		padding-right: 20px;
		margin:0;
		display: -webkit-box;
		overflow: hidden;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		line-height:24px;
	}
	.more_specifically .moreLink .ml-title {
		width:68%;
		margin-left:2%;
		font-weight:bold;
		font-size:16px;
	}
	.more_specifically .moreLink .ml-lead {
		font-weight:normal;
		position: absolute;
		margin-left:2%;
		right:0;
		top:40%;
		font-size:14px;
		line-height:22px;
		width:68%;
		margin:0;
	}
}

@media screen and (max-width: 768px) {
	.more_specifically_last,.more_specifically {
		padding:0 0 10px;
	}
	.more_specifically .moreLink .ml-img {
		width:30%;
		bottom:0;
		margin:0;
		padding:0;
	}
	.more_specifically .moreLink .ml-title {
		width:68%;
		font-weight:bold;
		font-size:14px;
		margin-left:2%;
		margin-top:.5em;
		margin-bottom:0;
	}
	.more_specifically .moreLink .ml-lead {
		font-weight:normal;
		position: relative;
		width:99%;
		font-size:12px;
		line-height:18px;
		margin:0 auto;
		display: -webkit-box;
		overflow: hidden;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
	}
	.more_specifically .arrow {
		-webkit-line-clamp: 2;
		font-size:12px;
		line-height:20px;
		padding-top:10px;
	}
	.more_specifically .arrow p { margin-bottom:0!important; }
}

/* ラベルテキストありのボタン */
.btn_wrap {
  margin: 50px 0 0;
  text-align:center;
}

a.btn_label {
	width:90%;
	text-align:center;
	font-size: 2.2rem;
	position: relative;
	padding: 0.25rem 2rem 1.5rem 3.5rem;
	color: #fff;
	background: #39af25;
	-webkit-box-shadow: 0 5px 0 #238949;
	box-shadow: 0 5px 0 #238949;
}

a.btn_label span {
	font-size: 1.4rem;
	position: absolute;
	top: -2.35rem;
	left: calc(15%);
	display: block;
	width:70%;
	padding: .8rem 0;
	color: #1e1d1d;
	border: 2px solid #1e1d1d;
	border-radius: 100vh;
	background: #fff;
	-webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
}

a.btn_label span:before,
a.btn_label span:after {
	position: absolute;
	left: calc(50% - 10px);
	content: "";
}

a.btn_label span:before {
	bottom: -10px;
	border-width: 10px 10px 0 10px;
	border-style: solid;
	border-color: #1e1d1d transparent transparent transparent;
}

a.btn_label span:after {
	bottom: -7px;
	border-width: 10px 10px 0 10px;
	border-style: solid;
	border-color: #fff transparent transparent transparent;
}

a.btn_label i {
	margin-right: 1rem;
}

a.btn_label:hover {
	-webkit-transform: translate(0, 3px);
	transform: translate(0, 3px);
	color: #fff;
	background: #289651;
	-webkit-box-shadow: 0 2px 0 #289651;
	box-shadow: 0 2px 0 #289651;
	opacity:0.7;
}

@media screen and (max-width: 768px) {
	a.btn_label {
		width:100%;
		font-size: 1.8rem;
		padding: 0.45rem 0 1.5rem;
	}

	a.btn_label span {
		font-size: 1.2rem;
		width:100%;
		left: calc(0%);
		top: -2.85rem;
	}
}

.w50_r{ width: 49%; }
.w50_l{ width: 49%; }

/* CTA */
.cta-section {
	background: #f4f2e6;
	color: #000000;
	border:0;
	padding:30px 30px 10px;
	margin:0;
}

.cta-section h3{
	margin: 1px 1px 24px!important;
	padding: 10px 0!important;
	border-top: 2px solid #000!important;
	border-bottom: 2px solid #000!important;
	color: #000!important;
	text-align:center;
	font-size: 1.8rem!important;
}

.cta-section h3:after{
	border:0!important;
}

.cta-section img {
	width:100%;
}

.cta-section li {	line-height:1.4;}

.cta_col{
	display: flex;
	flex-flow: row wrap;
	margin-bottom:2em;
}
.cta_col div{width: 49%;}
.cta_col div:first-child{margin-right: 1%;}
.cta_col div:nth-child(2){margin-left: 1%;}

a.btn--orange {
	color: #fff;
	width:80%;
	padding:20px 0;
	font-size:18px;
	font-weight:bold;
	background-color: #f897aa;
	border-bottom: 5px solid #d7667c;
}
a.btn--orange:hover {
	margin-top: 3px;
	color: #fff;
	background: #f897aa;
	border-bottom: 2px solid #d7667c;
}
a.btn--shadow {
	-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
	box-shadow: 0 3px 5px rgba(0, 0, 0, .3);
}

@media screen and (max-width: 768px) {
	.cta-section {
		padding:20px 10px;
		margin:40px -20px 20px;
	}
	a.btn--orange { width:100%; }
	.cta_col{display: block;}
	.cta_col div{width: 100%;}
	.cta_col div:first-child{margin-right: 0;}
}

/* CTA2 */
.cta-section02 {
	background: #f0f0f0;
	color: #000000;
	border:0;
	padding:30px 30px 10px;
	margin:0;
}

.cta-section02 h3{
	margin: 1px 1px 24px!important;
	padding: 10px 0!important;
	border-top: 2px solid #000!important;
	border-bottom: 2px solid #000!important;
	color: #000!important;
	text-align:center;
	font-size: 1.8rem!important;
}

.cta-section02 h3:after{
	border:0!important;
}

.cta-section02 img {
	width:100%;
	margin-bottom:0;
}

.cta-section02 .cta_col{
	display: flex;
	flex-flow: row wrap;
	margin-bottom:2em;
}
.cta-section02 .cta_col div:first-child{margin-right: 3%; width:26%;}
.cta-section02 .cta_col div:nth-child(2){margin-left: 1%; width:70%;}

@media screen and (max-width: 768px) {
	.cta-section02 {
		padding:20px 10px;
		margin:40px -20px 20px;
	}
	.cta-section02 .cta_col { display: block; }
	.cta-section02 .cta_col div{ width: 100%; }
	.cta-section02 .cta_col div:first-child{margin-right: 0; }
    .cta-section02 .cta_col div:first-child{margin:0 auto 15px; width:80%;}
    .cta-section02 .cta_col div:nth-child(2){margin:0 auto; width:95%;}
}

/* CTA（シンプル） */
.cta-sim{
	margin:80px 0;
	border-radius: 4px;
	padding:20px 15px 0;
	box-shadow:2px 2px 10px rgb(0 0 0 / 20%);
	overflow:hidden;
}

.cta-sim_title {
  position: relative;
  font-size:18px!important;
  padding: .5rem 0.3rem;
  text-align:center;
  border-bottom:none!important;
}

.cta-sim_title::after {
  border-bottom:none!important;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%!important;
  height: 4px;
  content: '';
  background: -webkit-repeating-linear-gradient(-45deg, #00BAC4 #00BAC4 2px, #fff 2px, #fff 4px);
  background: repeating-linear-gradient(-45deg, #00BAC4, #00BAC4 2px, #fff 2px, #fff 4px);
}
.cta-sim_btn{
	display:block;
	margin:10px -15px 0;
}
.cta-btn {
	position: relative;
	font-weight: bold;
	padding: 15px 0 15px 30px;
	font-size: 16px;
	width:100%;
	text-align:center;
	background-color: #FB869E;
	color: #fff;
	display: inline-block;
	text-shadow: 1px 1px 0px rgb(140, 140, 140, 0.3);
	box-shadow: 0 3px 0 rgb(140, 140, 140, 0.3);
}
.cta-btn:before {
	content: '';
	width: 10px;
	height: 10px;
	border: 0;
	border-bottom: solid 2px #fff;
	border-right: solid 2px #fff;
	position: absolute;
	top: 50%;
	left: 20px;
	margin-top: -6px;
	transform: rotate(-45deg);
}
a:hover .cta-btn {
	opacity: 0.7;
	box-shadow: 0 0px 0 rgb(140, 140, 140, 0.3);
	animation-play-state: paused;
	top: 3px;
}

/* ハンバーガーメニューの設定 */
@media screen and (max-width: 767px) {
	.keni-gnav_btn{ position: absolute!important; }
}

.article-body h4 { display: block!important; }
.article-body ul,ol {margin: 1em 0 2.5em 1.5em;}