/*CMS部分*/
.aricle_box{
	width:100%;
	margin:0;
	float:left
}
.aricle_menu{
	width:10%;
	margin-right:5%;
	display:none;
	float:left
}
.article_list{
	width:100%;
	margin:0 0 90px;
	float:left
}
.article_error{
	width:100%;
	margin:90px 0 0;
	float:left
}
.article_list ul{

}
.article_list ul li{
	width:100%;
	margin-bottom:30px;
	border-bottom:1px solid #CCC;
	padding-bottom:20px;
	
	float:left
}

.article_list ul li:nth-child(1){
	width:100%;
	padding-bottom:0;
	margin-bottom:0;
	border-bottom:none;

}
.article_list ul li:last-child{
	border-bottom:none;
	padding-bottom:0;
	margin-bottom:0;

}
.article_list ul li:nth-child(1) .image-trim {
	width:100%;
	position: relative;
	overflow: hidden;
	padding-top: 100%; /* 比率 */
	margin-left:0;
	margin-bottom:10px;
	float:left

}
.article_list ul li:nth-child(1) .image-trim img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.article_list ul li:nth-child(1) .article_box{
	width:94%;
	bottom:0;
	margin:0 3%;
	margin-right:0;
	float:left;
	box-sizing:border-box
}




.article_list ul li .image-trim {
	width:30%;
	position: relative;
	overflow: hidden;
	padding-top: 30%; /* 比率 */
	margin-left:3%;
	margin-bottom:10px;
	float:left

}
.article_list ul li .image-trim img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.article_list ul li .article_box{
	width:59%;
	margin-left:5%;
	margin-right:3%;
	float:left;
	
}

.article_list ul li .article_title{
	width:100%;
	font-weight:500;
	font-size:14px;
	color:#333;
	line-height:160%;
	text-align:left;
	margin:0;
	float:left
}
.article_list ul li .article_start_date{
	width:100%;
	font-size:12px;
	color:#CCCCCC;
	font-weight:300;
	height: 20px;
	text-align:left;
	
	float:left
}
.article_list ul li .article_contents{
	width:100%;
	font-size:12px;
	line-height:160%;
	height: 60px;
	font-weight:300;
	overflow-y:hidden;
	text-align:left;
	margin:0;
	float:left
}


.article_list ul li:last-child{
	margin-bottom:0
}
.navi_wrap{
	width:100%;
	margin:50px 0 0;
	padding:0 0 0 0 ;
	text-align:right;
	float:left
}
/*-----------------------------------
detail
------------------------------------*/

.article_detail_wrap{
	width:100%;margin:30px 0 0;float:left
}
.article_title_wrap{
	width:94%;margin:0 3% 10px;float:left
}
.article_title_wrap h2{
	font-size:18px;
	line-height:160%;
	color:#000000;
	margin-bottom:10px;
	font-weight:bold;
	text-align:left;
}
.article_contents_wrap{
	width:94%;
	text-align:left;
	margin:0 3% 10px;
	float:left
}
.article_title_wrap .article_release_date{
	width:100%;
	font-size:12px;
	color:#CCC;
	margin:0;
	text-align:right;
	float:left
}
.article_title_wrap .article_social_icon{
	width:100%;
	font-size:13px;
	font-weight:bold;
	color:#666666;
	text-align:right;
	float:left;
	margin-bottom:5px;
}
.article_title_wrap .article_social_icon img{
	width:26px;
	height:auto;
	margin:0 0 0 2%;
	vertical-align:bottom;
}

.article_title_wrap .article_category{
	width:100%;
	margin:0 0 20px;
	line-height:1;
	font-size:14px;

	float:left
}

.article_writer_wrap{
	width:100%;
	margin:0 0 35px;
	float:left
}

.article_category ul li{
	width:30%;
	margin:0 1%;
	border:1px solid #000;
	color:#FFF;
	line-height:1;
	font-size:14px;

	background:#000000;
	padding:3px;
	float:left
}
.article_category ul li:nth-child(2n){
	background:#FFF;
	color:#000;
	line-height:1;
}
.article_main_img{
	width:100%;
	margin:0 0 20px;
	float:left
}
.article_contents_wrap{
	width:94%;
	line-height:180%;
	letter-spacing:1.4px;
	margin:0 3% 50px;
	text-align:left;
	float:left
}
.paragraph_wrap{
	width:100%;
	float:left
}
.paragraph_wrap > ul > li{
	width:100%;
	line-height:180%;
	letter-spacing:1.4px;
	margin:0 0 5px;
	float:left
}
.paragraph_wrap ul li h3{
	width:100%;
	font-size:18px;
	padding: 10px 2%;
	text-align:left;
	color: #000000;
	background:#D4A29F;
	margin:0 0 20px;
	float:left;
	box-sizing: border-box;
	letter-spacing: 0.5px;
}
.paragraph_wrap ul li .default_img{
	width:94%;
	margin:0 3%;
	float:left
}

.paragraph_wrap ul li .paragraph_contents_wrap{
	width:94%;
	margin:0 3% 10px;
	text-align:left;
	float:left
}
.paragraph_contents_wrap ul {
    list-style-type: disc
}

.paragraph_contents_wrap ul li {
    list-style-type: disc;
    margin: 0 0 0 7%;
}
.product_link{
	width:60%;
	margin:20px 20% 0;
		
}
.paragraph_wrap ul li .paragraph_contents_wrap a{
	text-decoration:underline
}
.paragraph_contents_wrap > ul{
	list-style-type: initial;
}
.paragraph_contents_wrap > ul > li{

	list-style-type: initial;

}
/*関連カテゴリー記事*/
#same_article_title{
	width:100%;
	margin:0 0 20px;
	border-top:1px solid #999;
	border-bottom:1px solid #999;	
	padding:10px 0;
	text-align:center;
	float:left
}
.same_article_thumb{
	width:94%;
	margin: 0 3% 60px;
	float:left
}
.same_article_thumb h3{
	width:100%;
	background:#000000;
	padding:10px 0;
	color:#FFF;
	margin-bottom:20px;
	text-align:center;
	float:left;
}
.same_article_thumb ul{

}
.same_article_thumb ul li{
	width:49%;
	margin:0 2% 15px 0;
	position:relative;
	float:left;
	box-sizing:border-box
}
.same_article_thumb ul li:nth-child(2n){
	margin-right:0;
}
.same_article_thumb ul li .same_article_thumb_img{
	width:100%;
	margin:0 0 10px;
	float:left
}
.same_article_thumb ul li .same_article_thumb_img img{
	width:100%;
	/*height:130px;*/
	object-fit: cover;
	font-family: 'object-fit: cover;'; /*IE対策*/
	float:left
}
.same_article_thumb .same_article_title_wrap{
	width:98%;
	text-align:left;
	overflow: hidden;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
	font-size:12px;
	
	margin:0 1% 5px;
	float:left
}
.same_article_thumb .same_article_category{
	width:100%;
	margin:0 0 5px;
	font-size:12px;
	float:left
}
.same_article_thumb .same_article_category ul li{
	width:36%;
	margin:0 1%;
	border:1px solid #000;
	color:#FFF;
	line-height:1;
	font-size:13px;
	background:#000000;
	padding:3px;
	float:left
}
.same_article_thumb .same_article_category ul li:nth-child(2n){
	background:#FFF;
	color:#000;
	line-height:1;
}

/*記事の画像レイアウト*/
.maru_layout_wrap {
  width: 100%;
  display: block;
  padding-bottom: 100%;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  position: relative;
  overflow: hidden;
}
.maru {
  min-width: 100%;
  min-height: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

/*投稿者*/
.article_writer_wrap{
	width:94%;
	margin:0 3% 35px;
	float:left
}

.article_writer_wrap .profile_img{
	width:30%;
	margin:0 5% 0 0;
	display:inline-block;
	vertical-align:middle
}
.article_writer_wrap .profile_img img{
  width: 100%;
  display: block;
  padding-bottom: 0;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  position: relative;
  overflow: hidden;
}
.article_writer_wrap .profile_explain{
	width:64%;
	text-align:left;

	font-size:12px;
	display:inline-block;
	vertical-align:middle
}