main,
#sidebar { padding-top: 100px; }
.main__content h2 { margin-top: 50px; }
.main__content h3,
.main__content h4 {
  position: relative;
  margin-bottom: 20px;
  padding: 15px 0;
}
.main__content h3:before,
.main__content h3:after,
.main__content h4:before,
.main__content h4:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 7%;
  height: 2px;
  background-color: #66cdaa;
}
.main__content h3:after,
.main__content h4:after {
  left: auto;
  right: 0;
  height: 1px;
  width: 92.5%;
  background: #fff;
  border-bottom: 2px solid #ddd;
}
.main__content h4:before,
.main__content h4:after {
  height: 1px;
  background-color: #1e90ff;
}
.main__content h4:after {
  height: 1px;
  border-bottom: 2px solid #ddd;
}
.main__content ul { padding-left: 30px; }
.main__content .image img {
  object-fit: cover;
  object-position: center;
  height: 430px;
}
@media screen and (max-width: 991px){
  main,
  #sidebar { padding-top: 3rem; }
  .main__content .posts__modified ul {
    display: flex;
    padding-left: 0;
  }
  .main__content ul { padding-left: 2rem; }
  .main__content h3:before,
  .main__content h4:before { width: 19%; }
  .main__content h3:after,
  .main__content h4:after { width: 80%; }
  .main__content .image img { height: 230px; }
}






.templates__post main .posts__modified ul {
  position: relative;
  padding-left: 0;
}
.templates__post main .posts__modified li {
  position: relative;
  color: #959595;
  font-size: 12px;
}
.templates__post main .posts__modified li:first-child::before,
.templates__post main .posts__modified li:nth-of-type(2)::before {
  font-family: 'Font Awesome 6 Free';
  font-weight: bold;
  margin-right: 3px;
}
.templates__post main .posts__modified li:first-child::before { content: '\f073'; }
.templates__post main .posts__modified li:nth-of-type(2)::before { content: '\f0e2'; }
.templates__post main .posts__modified li:nth-child(n+2) { margin-left: 15px; }
.templates__post main .posts__modified li:nth-child(n+3) {
  padding: 0 10px;
  color: #fff;
  background: #fd7e00;
  border-radius: 5px;
}
.templates__post main .title { margin: 30px 0 50px; }
@media screen and (max-width: 991px){
}










.custom__posts__tp1 main .title,
.custom__posts__tp2 main .title,
.custom__posts__tp1 main .image {
  margin-bottom: 50px;
}

.custom__posts__tp1 .main__content h2 {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 15px;

}
.custom__posts__tp1 .main__content h2::before,
.custom__posts__tp1 .main__content h2::after {
  height: 0 !important;
  border-bottom: 0 !important;
}
.custom__posts__tp1 main dl {
  display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
    border: 1px solid #66cdaa;
    border-bottom: none;
    border-radius: 3px;
}
.custom__posts__tp1 main dt {
  background: #66cdaa;
    padding: 20px;
    width: 150px;
    color: #fff;
    border-right: 1px solid #66cdaa;
    border-bottom: 1px solid #fff;
}

.custom__posts__tp1 main dd {
  background: #fff;
  padding: 20px;
  width: calc(100% - 150px);
  font-size: 15px;
  border-bottom: 1px solid #66cdaa;
}
.custom__posts__tp1 main dd h1 {
  font-size: 15px;
  font-weight: normal;
}
.custom__posts__tp1 main dd.url a {
  text-decoration: underline;
  color: #1e90ff;
  font-size: 14px;
}
@media screen and (max-width: 991px){
  .custom__posts__tp1 main dl { display: block; }
  .custom__posts__tp1 main dt,
  .custom__posts__tp1 main dd {
    width: 100%;
  }
}




/**
 * sns_share_banner
 */
.site__content .sns_banner.post {
  position: relative;
  margin: 50px 0;
  padding: 15px 20px 17px;
  border: solid 1px #eee;
  border-radius: 3px;
}
.site__content .sns_banner.post .sns_shere_title {
  position: absolute;
  top: -9px;
  padding: 0 3px;
  color: #999;
  font-size: 12px;
  background: #fff;
  border-radius: 10px;
}
.site__content .sns_banner.post .flex {
  flex-wrap: nowrap;
  padding-left: 0;
}
.site__content .sns_banner.post li {
  position: relative;
  text-align: center;
  width: 100%;
}
.site__content .sns_banner.post img {
    height: 25px;
    width: 100%;
    object-fit: cover;
    object-position: center;
}
.site__content .sns_banner.post .sns_share_comment {
  position: absolute;
  display: none;
  top: -26px;
  text-align: center;
  margin-bottom: 0;
  padding: 0 10px 3px;
  width: 100%;
  font-size: 11px;
  background: #ddd;
  border-radius: 10px;
}
.site__content .sns_banner.post .sns_share_comment:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -7px;
  border: 7px solid transparent;
  border-top: 7px solid #ddd;
}
.site__content .main_content .sns_banner { margin: 50px 0; }
.site__content .add_content .sns_banner { margin-bottom: 100px; }
.pc .site__content .sns_banner.post a:hover ~ .sns_share_comment { display: block; }
@media screen and (max-width: 991px){
  .site__content .main_content .sns_share_banner { margin: 3rem 0; }
  .site__content .add_content .sns_share_banner { margin-bottom: 5rem; }
  .site__content .sns_banner.post .flex { display: flex; }
}


/* toc */
#toc_container {
  margin-bottom: 50px;
  padding: 30px;
  background: #fff;
  border: solid 1px #eee;
}
#toc_container .toc_title {
  text-align: center;
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: solid 1px #eee;
}
.toc_list {
  padding-left: 30px;
  list-style: disc;
}
@media screen and (max-width: 991px){
  #toc_container { padding: 1.5rem 1.5rem 3rem; }
}





/*
#related .posts__list__frm__content .posts__description { display: none; }
.custom__posts #related .posts__list__frm__content .posts__description {
  display: -webkit-box;
  margin-bottom: 0;
}
.custom__posts #related .posts__list__frm__content .posts__date,
.custom__posts #related .posts__list__frm__content .posts__view { display: none; }
*/

/*
.evaluation_color { color: #FFD700; }

/* article date,tag
.posts_date_tag { margin-bottom: 50px;}
.posts_date_tag li { margin-right: 10px; }
.posts_date_tag li,
.posts_date_tag li a { font-size: 13px; }
.posts_date_tag .posts_tag a {
  padding: 1px 5px 2px;
  background: #eee;
}
@media screen and (max-width: 991px){
  .posts_date_tag { margin-bottom: 3rem; }
  .posts_date_tag .flex { display: flex; }
}

/* article
.main_content h1,
.main_content .thumbnail {
  margin-bottom: 30px;
}
.main_content h2 {
  position: relative;
  margin: 80px 0 30px;
  padding: 10px;
  color: #fff;
  background: #5f9ea0;
}
.main_content h3 {
  margin: 30px 0 20px;
  padding: 10px;
  color: #5f9ea0;
  border-top: solid 1px #5f9ea0;
  border-bottom: solid 1px #5f9ea0;
}
.main_content h4 {
  margin: 30px 0 10px;
  padding: 10px;
  border-bottom: solid 1px #555;
}
.main_content .content ul { padding-left: 30px; }
.main_content .content table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
  max-width: 750px;
  border-radius: 3px;
  overflow: hidden;
}
.main_content .content table tr { background-color: #e6f1f6; }
.main_content .content table tr:nth-child(even) { background-color: #fff; }
.main_content .content table th, table td { padding: 1rem; }
.main_content .content table th { color: #4d9bc1; }
.main_content .content table thead th,
.main_content .content table thead td {
  background-color: #4d9bc1;
  color: #fff;
  font-weight: bold;
  text-align: center;
}
.main_content .content table.tb2 th:first-child,
.main_content .content table.tb2 td:first-child { width: 30%; }
@media screen and (max-width: 991px) {
  .main_content .content table {
    border-radius: 0;
    text-align: left;
  }
  .main_content .contentain table thead { display:none; }
  .main_content .content table tr {
    border: solid 1px #4d9bc1;
  }
  .main_content .content table th, table td {
    display: block;
    border: 0;
    border-bottom: 1px dotted #4d9bc1;
  }
  .main_content .content table tbody th {
    background: #4d9bc1;
    color:#fff;
    text-align: center;
    border-bottom: 1px dotted #fff;
  }
  .main_content .content table tbody th:last-child,
  .main_content .content table th,
  table td:last-child { border-bottom: 0; }
  .main_content .content table td:first-child::before {
    content: attr(data-label);
    background-color: #e6f1f6;
    font-weight: bold;
    display: inline-block;
    width: 10%;
    min-width: 3rem;
    text-align: center;
    margin-right: 0.5em;
    padding: 4px;
    border-radius: 100vh;
  }
  .main_content .content table tr:nth-child(odd) td:first-child::before {
    content: attr(data-label);
    background-color: #fff;
    font-weight: bold;
    display: inline-block;
    width: 10%;
    min-width: 3rem;
    text-align: center;
    margin-right: 0.5em;
    padding: 4px;
    border-radius: 100vh;
  }
  .main_content .content table thead th::before,
  .main_content .content table thead td::before {
    width: 0 !important;
    min-width: 0 !important;
    padding: 0 !important;
  }
  .main_content .content table.tb2 th:first-child,
  .main_content .content table.tb2 td:first-child { width: 100%; }
}


/* web sub_title
.web .sub_title h1 {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0;
  margin-bottom: 70px;
  color: #5f9ea0;
}
.web .sub_title h1::before,
.web .sub_title h1::after{
  position: relative;
  content: '';
  height: 1px;
  width: 50px;
  background-color: #9ad5db !important;
  background-image: none;
}
.web .sub_title h1::before{ margin-right: 10px; }
.web .sub_title h1::after{ margin-left: 10px; }
.web .favorite { margin: 30px 0; }
.web dl {
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	width: 100%;
	border: 1px solid #5f9ea0;
	border-bottom: none;
  border-radius: 3px;
}
.web dl dt {
	background: #5f9ea0;
	padding: 10px;
	width: 150px;
  color: #fff;
	border-right: 1px solid #5f9ea0;
	border-bottom: 1px solid #fff;
}
.web dl dt:last-child { border-bottom: 1px solid #5f9ea0; }
.web dl dt h2 {
  margin: 0;
  padding: 0;
  font-size: 15px;
}
.web dl dd {
	background: #fff;
	padding: 10px;
	width: calc(100% - 150px);
	border-bottom: 1px solid #5f9ea0;
}
.web dl dd ul { margin-left: 25px; }
.web dl dd a { color: #5f9ea0; }
.web .tag_list { margin-top: 30px; }
.web .tag_list .flex { display: flex; }
.web .tag_list li { margin-bottom: 10px; }
.web .tag_list a {
  position: relative;
  margin-right: 10px;
  padding: 5px 10px;
  color: #66cdaa;
  font-size: 12px;
  background: #fff;
  border: solid 1px #66cdaa;
  border-radius: 3px;
}
.web .tag_list a::before {
  content: "\f02b";
  font-family: "Font Awesome 5 Free";
  font-weight: bold;
  margin-right: 5px;
}
.pc .web dl dd a:hover { color: #ff8c00; }
.pc .web .tag_list a:hover {
  color: #fff;
  background: #66cdaa;
}
@media screen and (max-width: 991px){
  .web .sub_title h1 { margin-bottom: 3rem; }
  .web dl dt{
		width: 100%;
		border-right: none;
	}
	.web dl dd{ width: 100%; }
}

/* recommend

#recommend { margin-top: 70px; }
#recommend h2 {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0;
  margin-bottom: 50px;
  color: #5f9ea0;
}
#recommend h2::before,
#recommend h2::after {
  position: relative;
  content: '';
  height: 1px;
  width: 50px;
  background-color: #9ad5db !important;
  background-image: none;
}
#recommend h2::before { margin-right: 10px; }
#recommend h2::after { margin-left: 10px; }
/*
#recommend .posts_frm_vertical .posts_frm { width: 49%; }
#recommend .posts_frm_vertical .posts_frm:nth-child(3n) { margin-right: 2%; }
#recommend .posts_frm_vertical .posts_frm:nth-child(2n) { margin-right: 0 }

@media screen and (max-width: 991px){
  /*
  #recommend .posts_frm { background: inherit; }
  #recommend .posts_frm_vertical .posts_frm { width: 100%; }
  #recommend .posts_frm_vertical .posts_frm:nth-child(3n) { margin-right: 0; }
  #recommend .posts_frm_vertical .posts_image img { height: 9rem; }
  #recommend .posts_frm_vertical .posts_description {
    display: -webkit-box;
    margin-bottom: 0;
  }*/
  /*
}
*/



#related h2 { margin-top: 50px; }
.templates__post #related .posts__list__frm__content .posts__detail .posts__description,
.custom__posts__tp1 #related .posts__list__frm__content .posts__detail .posts__date,
.custom__posts__tp2 #related .posts__list__frm__content .posts__detail .posts__date,
#related .posts__list__frm__content .posts__detail .posts__view { display: none; }
.custom__posts__tp1 #related .posts__list__frm__content .posts__detail .posts__description,
.custom__posts__tp2 #related .posts__list__frm__content .posts__detail .posts__description {
  margin-bottom: 0;
  -webkit-line-clamp: 2;
}
#related .posts__list__frm__content .posts__detail .posts__cat ul { flex-wrap: wrap; }
#related .posts__list__frm__content .posts__detail .posts__cat li { margin-bottom: 5px; }
@media screen and (max-width: 991px){
  #related .container { margin: 0; }
  #related .posts__list__frm__content {
    margin-right: 0;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    width: 100%;
    border-bottom: solid 1px #eee;
  }
  #related .posts__list__frm__content .posts__image .image__bg { display: none; }
  #related .posts__list__frm__content .posts__image {
    margin-right: 5%;
    width: 30%;
  }
  #related .posts__list__frm__content .posts__image img {
    object-fit: cover;
    height: 10rem;
  }
  #related .posts__list__frm__content .posts__detail {
    position: relative;
    padding: 0;
    width: 65%;
  }
  #related .posts__list__frm__content .posts__detail .posts__title h3,
  .custom__posts__tp1 #related .posts__list__frm__content .posts__detail .posts__description { color: #333; }
  .templates__post #related .posts__list__frm__content .posts__detail .posts__date,
  .custom__posts__tp2 #related .posts__list__frm__content .posts__detail .posts__description { display: none; }
  .templates__post #related .posts__list__frm__content .posts__detail .posts__title { margin-bottom: 0; }
  .custom__posts__tp1 #related .posts__list__frm__content .posts__detail .posts__title { margin-top: 0; }
}


/**
 * comments
 */
#comments { margin: 50px 0 0; }
#comments #reply-title { display: none; }
#comments form p { margin-bottom: 20px; }
#comments .comment-notes,
#comments input[type="submit"]  { font-size: 12px; }
#comments label,
#comments input,
#comments textarea { font-size: 14px; }
#comments span { color: #ff0000; }
#comments input[type="submit"] {
  cursor: pointer;
  padding: 3px 15px;
  color: #fff;
  background: #105AAF;
  border: 0;
  border-radius: 5px;
}
@media screen and (max-width: 991px){
  #comments .comment-notes,
  #comments input[type="submit"] { font-size: 1.2rem; }
  #comments form p { margin-bottom: 1rem; }
  #comments form { padding: 10px 0 0; }
  #comments label,
  #comments input,
  #comments textarea { font-size: 1.6rem; }
}