@charset "UTF-8";
/* CSS Document */
#titarea h1 {
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 20px;
}
#titarea p {font-size: 85%;line-height: 180%;}
#titarea .top_keyword {margin-bottom: 10px;}
#titarea .top_keyword ul li {font-size: 70%;color: #999;display: inline;}
#titarea .top_keyword ul li a {color: #999;text-decoration: underline;}
#titarea .top_keyword ul li a:hover {text-decoration: none;}

/*
##############
  A.J.A Recommend Engine
##############
*/
.ajarecommend div,.ajarecommend span,.ajarecommend h1,.ajarecommend h2,.ajarecommend h3,.ajarecommend h4,.ajarecommend h5,.ajarecommend h6,.ajarecommend p,.ajarecommend blockquote,.ajarecommend pre,.ajarecommend em,.ajarecommend img,.ajarecommend small,.ajarecommend strong,.ajarecommend sub,.ajarecommend sup,.ajarecommend b,.ajarecommend i,.ajarecommend dl,.ajarecommend dt,.ajarecommend dd,.ajarecommend ol,.ajarecommend ul,.ajarecommend li,.ajarecommend label,.ajarecommend table,.ajarecommend caption,.ajarecommend tbody,.ajarecommend tfoot,.ajarecommend thead,.ajarecommend tr,.ajarecommend th,.ajarecommend td,.ajarecommend article,.ajarecommend aside,.ajarecommend footer,.ajarecommend header,.ajarecommend nav,.ajarecommend section{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;box-sizing:border-box}.ajarecommend li{list-style:none}.ajarecommend{overflow:hidden}.ajarecommend .ajarecommend-title{padding:0px 0px 5px 3px;margin:1em 0px;font-size:18px;font-weight:bold;border-bottom:2px solid #585858}.ajarecommend .ajarecommend-frame{overflow:hidden;margin-left:-2%;letter-spacing:-1em}.ajarecommend .ajarecommend-frame__list{display:inline-block;vertical-align:top;position:relative;padding:0;padding-left:2%;margin-bottom:3%;letter-spacing:0em}.ajarecommend .ajarecommend-frame__list:nth-of-type(4n+1){clear:both}.ajarecommend .ajarecommend-frame__list__col4 .ajarecommend-frame__list{width:25%}.ajarecommend .ajarecommend-frame__link{display:block;overflow:hidden}.ajarecommend .ajarecommend-frame__link:hover{cursor:pointer}.ajarecommend .ajarecommend-frame__link:hover .ajarecommend-frame__text .ajarecommend-frame__title{text-decoration:underline}.ajarecommend .ajarecommend-frame__thumbnail{position:relative;margin-bottom:4%}.ajarecommend .ajarecommend-frame__thumbnail__frame>p{position:absolute;top:0px;left:0px;display:inline-block;overflow:hidden;width:100%;height:100%;margin:0px;background-position:center center;background-repeat:no-repeat;background-size:cover}.ajarecommend .ajarecommend-frame__thumbnail__landscape .ajarecommend-frame__thumbnail__frame{padding-top:66.45%}.ajarecommend .ajarecommend-frame__text{word-wrap:break-word;overflow-wrap:break-word}.ajarecommend .ajarecommend-frame__title{overflow:hidden;margin-bottom:7%;max-height:47px;color:#000;font-size:13px;line-height:1.3;font-weight:bold}.ajarecommend .ajarecommend-frame__provider,.ajarecommend .ajarecommend-frame__date{color:#999;font-size:11px;line-height:14px}

/*
###############################
  #snsbutton
###############################
*/
.snsbutton {float: left;}
.snsbutton ul {text-align: center;}
.snsbutton li {float: left;margin-right: 5px;}
.snsbutton li a {
	display: block;
	height: 25px;
	width: 141px;
	text-align: center;
	vertical-align: middle;
	padding-top: 5px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.snsbutton .btn-fb a {background-color: #3B5998;}
.snsbutton .btn-tw a {background-color: #55ACEE;}
.snsbutton .btn-ha a {background-color: #1AA4DC;}
.snsbutton .btn-po a {background-color: #E5364E;}
.snsbutton .btn-feedly a {background-color: #87BF31;}
.viewtop {
	float: right;
	font-size: 125%;
	font-weight: bold;
}
.viewtop span {
	margin-left: 5px;
	font-weight: normal;
	font-size: 12px;
	color: #999;
}
#single  #cover {margin-bottom: 20px;}
#single  #cover img {height: auto;width: 100%;}

/*
###############################
  .table-contents
###############################
*/
.table-contents,
#toc_container {
	border: 1px solid #CCC;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
  margin-bottom: 20px;
}
.table-contents p,
#toc_container p {
	font-size: 120%;
	margin-bottom: 10px;
	padding-bottom: 5px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #efefef;
}
.table-contents ul li,
#toc_container ul li {
	font-size: 95%;
	margin-bottom: 5px;
	background-image: url(img/ico_table.png);
	background-repeat: no-repeat;
	background-position: left center;
	background-size:10px 9px; 
	padding-left: 15px;
	line-height: 140%;
}
/*
###############################
  #article
###############################
*/
#article,
.contents_post  {
	font-size: 85%;
	line-height: 195%;
	margin-top: 20px;
}

.contents_post ol{
	padding-left: 20px;
}
.contents_post ol li{
	list-style-type: decimal;
}

#article a,
.contents_post a  {
/*  text-decoration: underline;*/
}
#article a:hover,
.contents_post a:hover  {
/*  text-decoration: none;*/
}

#article h2,
.contents_post h2 {
   background: url(./img/bg_stripe_brown.jpg) repeat-x 0 90%;
   background-size: auto 10px;
   color: #674e2e;
   font-size: 1.5rem;
   font-weight: 700;
   line-height: 1.4;
   margin-top: 25px;
   margin-bottom: 25px;
   padding-bottom: 16px;
   border-bottom: none 0 !important ;
}
#article h3,
.contents_post h3 {
	border-left: 5px solid #674e2e;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
   color: #674e2e;
   font-size: 1.25rem;
   font-weight: 700;
   line-height: 1.4;
   margin: 25px 0;
   padding-left: 10px;
}
.authority a {scolor: #a1a1a1 !important;}
.authority {
    font-size: 12px;
    line-height: 21px;
    color: #a1a1a1 !important;
    font-weight: normal;
}
#article strong,
.contents_post strong
 {
	font-weight: bold;
	display: block;
	margin-top: 20px;
}

/*
###############################
  #アイテム紹介テキスト
###############################
*/
.block_mcommerce.clearfix .mcDetail h5 {font-weight: bold;}
.block_mcommerce.clearfix .mcDetail .mcTxt {line-height: 180%;}


/*
###############################
  #引用
###############################
*/
.block_mcommerce .mcDetail .mcInner blockquote  {/*アイテムの中見の引用*/
	font-size: 90%;
	line-height: 160%;
	padding-top: 28px;
	padding-right: 25px;
	padding-bottom: 20px;
	padding-left: 25px;
	margin-top: 10px;
}

blockquote {
	background-color: #f5f5f5;
	border-radius:3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	background-image: url(img/blockquote.png);
	background-repeat: no-repeat;
	background-position: 10px 10px;
	background-size:20px 17px;
        font-size: 75%;line-height: 160%;padding: 15px;
}
blockquote p{font-size: 75%;line-height: 160%;padding: 15px;}

.item_detail .name {font-size: 12px;}
.text_area {padding-bottom: 5px;line-height: 130%;}

/*
###############################
  #Q&A
###############################
*/
.qa-question {font-weight: bold;margin-bottom: 15px;}
.qa-question::before {
	content: 'Q';
	border-radius: 5px;
	color: #fff;
	font-weight: bold;
	background-color: #E40175;
	padding: 0px 6px;
    　　margin-right: 1em;
	font-size: 15px;
}
.qa-answer {margin-left: 2em;}
.qa-answer::before {
	content: 'A';
	background-color:#3B88C3;
	border-radius: 5px;
	color: #fff;
	font-weight: bold;
   　　　 padding: 0px 6px;
    　　　margin-right: 1em;
	font-size: 15px;
}
.qa-answer + .qa-answer {margin-bottom:0px;margin-left: 4.5em;}
.qa-answer + .qa-answer::before {content: ' '; background-color: #fff;padding: 0px;margin-right: 0em;}
.qa-question + .qa-question {margin-left: 3em;  }
.qa-auestion + .qa-question::before {content: ' ';  }
/*
###############################
  #関連記事
###############################
*/
.introduce {display: none;}

.panel.panel-default ul.list-group{
	border:1px solid #DDDDDD;
	position:relative;
	margin-bottom: 10px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;	
}
.panel.panel-default ul.list-group li a {display: inline-block;}
.panel.panel-default ul.list-group li a:hover {background-color: #F9F9F9;}
.panel.panel-default ul.list-group p.kanren {display: none;}
.panel.panel-default ul.list-group li p.title {
	font-size: 120%;
	font-weight: 500;
	line-height: 18px;
	width: 550px;
	display: inline-block;
	margin-top: 25px;
}
.panel.panel-default ul.list-group li p.title:hover {text-decoration: underline;}
.panel.panel-default ul.list-group li p.extracts {
    font-size: 12px;
    display: inline-block;
    line-height: 20px;
	color: #999;
	width: 550px;
}
.panel.panel-default ul.list-group img {
	float: left;
	height: 120px;
	width: 120px;
	margin-right: 10px;
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;  
	-webkit-border-bottom-left-radius: 5px;  
	-moz-border-radius-bottomleft: 5px; 
}

/*
###############################
  .section
###############################
*/
.section {margin-bottom: 20px;}
.contents_post h4 {
   color: #674e2e;
   font-size: 16px;
   font-weight: bold;
   margin-top: 25px;
   margin-bottom: 15px;
   border-bottom-width: 1px;
   border-bottom-style: solid;
   border-bottom-color: #674e2e;
   padding-bottom: 5px;
}
/*
###############################
  .section
###############################
*/
.relatedpost dl {margin-bottom: 10px;margin-right: 15px;float: left;width: 330px;}
.relatedpost dl dt {float: left;margin-right:10px;}
.relatedpost dl dt img {height: 75px;width: 75px;}
.relatedpost dl dd {font-size: 80%;}
.relatedpost .pr {color: #666;}
/*
#################
  #nav-cat
#################
*/
#nav-cat ul {
	border-top-width: 2px;
	border-bottom-width: 1px;
	border-left-width: 2px;
	border-right-width: 2px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-style: solid;
	border-top-color: #f3f3f3;
	border-bottom-color: #f3f3f3;
	border-left-color: #f3f3f3;
	border-right-color: #f3f3f3;
}
#nav-cat ul li a {
	float: left;
	width: 27.2%;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #f3f3f3;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #f3f3f3;
	padding-top: 2%;
	padding-right: 3%;
	padding-bottom: 2%;
	line-height: 24px;
	padding-left: 3%;
	display: block;
}
#nav-cat ul li.rightlist a {border-right: none;}
#nav-cat li a:hover {background-color: #F9F9F9;}
#nav-cat ul li  img {float: right;}
#nav-cat .name {font-size: 90%;color: #666;}
#nav-cat .count {font-size: 80%;color: #999;}

/*
#############################
  SNS
#############################
*/
.sns-section{border:1px solid #EEEEEE;overflow:hidden;*zoom:1}
.sns-section.is-twitter{border:none;text-align:right;margin-top:15px}
.sns-cover{width:300px;height:180px;float:left;margin-right:15px;vertical-align:middle;background-color:#f5f5f5;background-size:cover;background-position:50% 50%;background-repeat:no-repeat}
.sns-cover img {width:300px;height:200px;}
.sns-right{padding:15px;margin-top:15px;text-align:center}
.sns-likeText{font-size:18px;color:#333;line-height:27px;font-weight:700}
.sns-likeText div{font-weight:inherit}
.sns-likeText-blue{font-weight:inherit;color:#86CCCC;}
.sns-likeButton{display:inline-block;width:300px;margin-top:34px}

/*
#############################
  SNS
#############################
*/
.fixed {position: fixed;top: 20px;right:205px;}
/*
#############################
  editor
#############################
*/
#single .editor-section {border: 3px solid #E5E5E5;padding: 10px;}
#single .editor-section dl {margin-bottom: 10px;}
#single .editor-section dt {float: left;margin-right: 10px;height: 65px;width: 65px;}
#single  .editor-section dt img {height: auto;width: 100%;border-radius:100px;-webkit-border-radius: 100px;-moz-border-radius: 100px;}
#single  .editor-section dd {font-size: 80%;}
#single  .editor-section .editor_info-desc {font-size: 75%;}

.contents_post > p > a,
.contents_post > a,
.contents_post > p > span a {
  text-decoration: underline;
}
.contents_post > p > a:hover,
.contents_post > a:hover,
.contents_post > p > span a:hover {
  text-decoration: none;
}
/*
#############################
 top_tags_lis
#############################
*/
.top_tags_list a {
  background: #7a6a56;
  border-radius: 20px;
  color: #fff;
  display: inline-block;
  font-size: 0.8rem;
  font-weight: bold;
  margin-bottom: 8px;
  padding: 3px 15px;
}
/* .top_tags_list a:hover {
  text-decoration: none;
}
.top_tags_list a::before {
  font-size: 14px;
  display: inline-block;
  content: "#";
  width: 1em;
  height: 1em;
  color: #88b04b;
} */

/*
#############################
 bottom_tags_group
#############################
*/
.bottom_tags_group {}
.bottom_tags-list a {
   background: #7a6a56;
   border-radius: 20px;
   color: #fff;
   display: inline-block;
   padding: 3px 15px;
   font-size: 0.8rem;
   font-weight: bold;
}
.bottom_tags-list a:hover {}
.bottom_tags-list li {
   margin-top: 16px;
   text-align: center;
   vertical-align: top;
   width: auto;
   display: inline-block;
   margin-right: 10px;
}
.bottom_tags-list a::before {}
.bottom_tags_title {
  font-weight: bold;
  margin-bottom: 15px;
}

/*
#############################
 video-container
#############################
*/
.video-container {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
	margin-top: 10px;
	margin-bottom: 10px;
}
.video-container iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

/*
#############################
 em-marker
#############################
*/
.em-marker {
  font-weight: bold;
  font-size: 13.6px;
  background: linear-gradient(transparent 60%, #fff585 40%);
}

/*
#############################
data-info
#############################
*/
.data-info {
  background-color: #e3e9d2;
  border-radius: 10px;
  padding: 15px;
  margin: 10px 0;
}

/*
#############################
external_link
#############################
*/
.external_link {
    background-color: #126b5c;
    text-align: center;
    display: block;
    height: 50px;
    width: 400px;
    font-size: 12px;
    font-weight: bold;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    margin-right: auto;
    margin-left: auto;
    color: #FFF;
    line-height: 50px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.external_link:hover {
    background-color:  #2a9c89;
    text-decoration: none;
}

/*
#############################
.additionalLink
#############################
*/
#article .additionalLink {
	background: #116a5b;
	line-height: 40px !important;
	margin-top: 5px !important;
	-moz-box-shadow: 0px 3.5px 0px 0px ;
	-webkit-box-shadow: 0px 3.5px 0px 0px rgba(9,49,42,1.00);
	-ms-box-shadow: 0px 3.5px 0px 0px rgba(9,49,42,1.00);
	box-shadow: 0px 3.5px 0px 0px rgba(9,49,42,1.00);
}

/*
#############################
.sponsored
#############################
*/
.sponsored {
	text-align: right;
}
.sponsored span {
    border: 1px solid #CCC;
    margin: 10px !important;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    padding-right: 4px;
    padding-left: 4px;
    font-weight: normal;
	 display: inline-block;
}

/*
#############################
.table-warp
#############################
*/
.table-warp {
  max-width: 730px;
}
@media all and (max-width: 768px) {
  .table-warp {
    max-width: 100%;
  }
}
.table-warp .table {
  margin-bottom: 30px;
}
.table-warp .table-ranking {
  overflow-x: scroll;
}
@media all and (max-width: 768px) {
  .table-warp .table-nonranking {
    overflow-x: scroll;
  }
  .table-warp .table-nonranking table {
    min-width: 500px;
  }
}
.table-warp table {
  min-width: 100%;
  border-collapse: separate;
  table-layout: inherit;
  margin-bottom: 0;
}
.table-warp table th, .table-warp table td {
  font-size: 11px;
  color: #000;
  border: 1px solid #ccc;
  padding: 6px;
}
.table-warp table th .txtname, .table-warp table td .txtname {
  text-align: center;
  color: #999;
}
.table-warp table td:first-child {
  background: #eaeaea;
}
.table-warp table .btndetail {
  margin: 0;
  margin-bottom: 5px;
}
.table-warp table .btndetail:last-child {
  margin-bottom: 0;
}
.table-warp table .btndetail a {
  font-size: 12px;
  padding: 6px;
}
.table-warp table.ranking td {
  min-width: 144px;
  max-width: 144px;
}
.table-warp table.ranking td:first-child {
  min-width: 80px;
}
.table-warp table.ranking tr:nth-child(2) td {
  vertical-align: top;
}
.table-warp table.ranking tr:nth-child(2) td .img {
  position: relative;
}
.table-warp table.ranking tr:nth-child(2) td .img img {
  width: 130px;
  max-width: 130px;
}
.table-warp table.nonranking td {
  text-align: center;
}
.table-warp table.nonranking td:first-child {
  text-align: left;
}
.table-warp table.nonranking tr:first-child td {
  text-align: center;
}
.table-warp table{
  white-space: inherit !important;
}