/* TOC+ */
#toc_container{
	margin:20px auto 30px;
	background-color:rgba(44,153,181,.04); /* 目次全体の背景カラー */
	border:3px solid rgba(64,105,144,.2); /* 目次全体の枠線 */
	border-radius:3px;
	box-sizing:border-box;
	padding:38px 52px;
	display:table;
	min-width: 68%;
	counter-reset:li;
}
 
/* テーマによるリストの装飾を一旦無効化 */
#toc_container ul.toc_list li::before{
	content:none;
	padding:0;
	margin:0;
	width:0;
	height:0;
	background:none;
	box-shadow:none;
}
 
/* 目次の見出しタイトル */
#toc_container .toc_title{
	text-align:center;
	font-weight:bold;
	font-size:118%;
	padding:0;
}
 
/* 見出しタイトル左のアイコン */
#toc_container .toc_title::before{
	position:relative;
	font-size:28px;
	content:"\2254";
	display:inline-block;
	width:40px;
	height:40px;
	line-height:34px;
	margin-right:8px;
	border-radius:50%;
	vertical-align:baseline;
	speak:none;
	-webkit-font-smoothing:antialiased;
	color:#fff;
	background-color:#5f7b96;
}
 
/* 表示／非表示トグル */
#toc_container .toc_toggle a{
	font-size:13px;
	font-weight:normal;
	padding:2px 4px;
}
 
/* 目次エリア */
#toc_container p.toc_title + ul.toc_list{
	padding:20px 0 0;
	margin:20px 0 0;
	border-top:1px solid rgba(0,0,0,.1);
}
 
/* リスト共通スタイル */
#toc_container ul.toc_list li{
	position:relative;
	padding:0;
	margin:0;
}
 
/* 目次リンク共通スタイル */
#toc_container ul.toc_list li a{
	position:relative;
	font-size:94%;
	font-weight:normal;
	text-decoration:none;
	display:inline-block;
	line-height:1.6;
	padding:3px 0;
	margin:5px 0;
	transition:all .3s ease;
}
#toc_container ul.toc_list a,
#toc_container ul.toc_list a:visited{
	color:#5f7b96; /* リンクカラー */
}
/* マウスオーバー時 */
#toc_container ul.toc_list li a:hover{
	text-decoration:none;
	box-shadow:0 2px;
}
 
/* 親の目次 */
#toc_container ul.toc_list > li > a{
	font-size:104%;
	font-weight:bold;
	margin-left:40px;
}
 
/* 親の目次(左側の連番) */
#toc_container ul.toc_list > li::before,
#toc_container ul.toc_list > li::after{
	position:absolute;
	top:3px;
	left:0;
}
/* 連番背景 */
#toc_container ul.toc_list > li::before{
	content:'';
	display:inline-block;
	vertical-align:bottom;
	width:32px;
	height:32px;
	margin-right:7px;
	border-radius:16px;
	background-color:rgba(125,157,188,0.66);
}
/* 連番 */
#toc_container ul.toc_list > li::after{
	counter-increment:li;
	content:counter(li);
	width:32px;
	line-height:32px;
	font-family:'Avenir Next', 'Helvetica Neue', Arial, 'Meiryo','Yu Gothic', san-serif;
	font-weight:400;
	text-align:center;
	color:#fff;
}
 
/* 子の目次 */
#toc_container ul.toc_list > li > ul{
	margin-left:40px;
}
 
/* 子の目次の左側のアイコン */
#toc_container ul.toc_list > li ul li::before{
	position:absolute;
	top:3px;
	left:0;
	content:'\2023';
	display: inline-block;
	width:14px;
	height:28px;
	line-height:28px;
	font-size:18px;
	color:#5f7b96;
}
#toc_container ul.toc_list > li ul li a{
	font-weight: normal;
	margin-left:16px;
}
 
/* レスポンシブ設定(667px幅以下) */
@media only screen and (max-width: 667px){
	#toc_container{
		padding:20px 3vw;
		min-width:auto;
		width:100%!important;
	}
	#toc_container p.toc_title + ul.toc_list{
		padding:20px 0 0;
	}
	#toc_container ul.toc_list > li > ul{
		margin-left:30px;
	}
}
#toc_container ul {
color:transparent
}

/* リンクカード */
.pb-btn{
  margin: 3em auto;
  max-width:500px;
  width:80%;
  position:relative;
}
.pb-btn p{
  margin:0 !important;
  padding:0 !important;
}
.pb-btn a{
  display:block;
  padding:1.5em 2em 1.3em;
  color:#333 !important;
  background:#FAFAFA;
  border:2px solid #777;
  font-size:16px !important;
  font-weight:600;
  position:relative;
  transition:all 0.2s;
  text-decoration:none;
}
.pb-btn .pb-btn__text{
  max-width: 90%;
  display: block;
  line-height:1.8;
}
.pb-btn .pb-btn__label{
  background: #EE8F81;
  color: #fff;
  display: inline-block;
  padding: 0.5em 1em !important;
  font-size: 12px !important;
  line-height: 12px;
  font-weight: 600;
  letter-spacing: 0.5px;
  position:absolute;
  top: -12px;
  left: 23px;
  z-index: 1;
}
.pb-btn .pb-btn__add{
  font-size:12px !important;
  letter-spacing:0.5px;
  margin: 7px auto 0 !important;
  max-width:90%;
  color: #EE8F81;
  font-weight:600;
  text-align:center;
}
.pb-btn a:after{
  position: absolute;
  content: "";
  display: inline-block;
  right: 7%;
  top: 50%;
  width: 9px;
  height: 9px;
  border-top: 3px solid #333;
  border-right: 3px solid #333;
  -webkit-transform: rotate(45deg) translateY(-50%);
  transform: rotate(45deg) translateY(-50%);
}
.pb-btn a:hover{
  border-color:#EE8F81;
  transition:0.2s;
  text-decoration:none;
  opacity:1;
}
@media screen and (max-width:600px) {
  .pb-btn{
    width:90%;
  }
  .pb-btn a {
    padding: 1.3em 1.3em 1.2em;
    font-size:14px !important;
  }
  .pb-btn .pb-btn__label{
    left:14px;
  }
  .pb-btn .pb-btn__add{
    text-align:left;
  }
}

/* リンクカード */
.pb-btn .pb-btn__label-2{
  color: #EE8F81;
  display: inline-block;
  font-size: 12px !important;
  line-height: 12px;
  font-weight: 600;
  letter-spacing: 0.5px;
  position: absolute;
  top: -24px;
  left: -23px;
  z-index: 1;
  transform: rotate( -5deg);
}
.pb-btn .pb-btn__label-2:before,.pb-btn .pb-btn__label-2:after{
  display:inline-block;
}
.pb-btn .pb-btn__label-2:before{
  content:"＼";
  margin-right:3px;
}
.pb-btn .pb-btn__label-2:after{
  content:"／";
  margin-left:3px;
}

/*ボタンデザイン */
@import "https://use.fontawesome.com/releases/v5.13.0/css/all.css";

*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 62.5%;
}

.btn,
a.btn,
button.btn {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

.btn-wrap {
  margin: 30px 0;
}

a.btn-c {
  font-size: 2.2rem;

  position: relative;

  padding: 0.25rem 2rem 1.5rem 3.5rem;

  color: #fff;
  background: #32b16c;
  -webkit-box-shadow: 0 5px 0 #2c9d60;
  box-shadow: 0 5px 0 #2c9d60;
}

a.btn-c span {
  font-size: 1.5rem;

  position: absolute;
  top: -10px;
  left: calc(50% - 150px);

  display: block;

  width: 300px;
  padding: 0.2rem 0;

  color: #32b16c;
  border: 2px solid #32b16c;
  border-radius: 0.5rem;
  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-c:hover {
  -webkit-transform: translate(0, 3px);
  transform: translate(0, 3px);

  color: #fff;
  background: #30a967;
  -webkit-box-shadow: 0 2px 0 #2c9d60;
  box-shadow: 0 2px 0 #2c9d60;
}

a.btn-c:hover:before {
  left: 2rem;
}