/*-------------------------------
	f view
-------------------------------*/

#fview_column {
	background:url(../img/column/bg_subf_column.jpg) no-repeat center / cover;
	position:relative;
}

#fview_column::before {
	background-color:rgba(0,0,0,0.24);
}

/*-------------------------------
	column list
-------------------------------*/

.column_affe_wrap {
	width:100%;
	max-width:1200px;
	margin:0 auto;
}

.column_list {
	padding:0;
	margin-bottom:140px;
}

.column_list_wrap {
	width:calc(100% - 150px);
	padding-right:10%;
}

.info_title  {
	font-size:2rem;
	margin-bottom:1em;
	max-height:100%;
	font-weight:600;
	letter-spacing: 0.05em;
	transition:color .3s;
}

.column_affe .cate {
	margin-right:1em;
	margin-bottom:0.75em;
}

/*-------------------------------
	column_featured 
-------------------------------*/

.column_featured {
	margin-bottom:120px;
	/* border-bottom:2px solid #0cd1f7; */
}

.column_featured a {
	width:47.7%;
	max-width:400px;
	margin-bottom:70px;
}

.column_featured a:first-of-type {
	width:100%;
	max-width:100%;
}

.column_featured a figure {
	position:relative;
	height:230px;
	margin-bottom:15px;
	overflow:hidden;
}

.column_featured a figure::after {
	content:attr(data-tag);
	display: block;
	width:100px;
	height:35px;
	line-height:35px;
	border-radius:0 0 10px 0;
	letter-spacing: 0.1em;
	background:#0cd1f7;
	text-align:center;
	font-size:1.2rem;
	font-family: 'Lato', sans-serif;
	color:#fff;
	font-weight:bold;
	position:absolute;
	left:0;
	top:0;
}

.column_featured a:first-of-type figure {
	height:485px;
	margin-bottom:30px;
}

.column_featured a:first-of-type .column_txt {
	padding:0 1.5em;
}

.column_featured a figure img {
	transition:transform .3s;
}

.column_featured a:hover figure img {
	transform:scale(1.1);
}

.column_featured a:hover .info_title {
	color:#0cd1f7;
}

.column_featured a .info_date {
	margin-bottom:0.75em;
	margin-left:auto;
}

/*-------------------------------
	column_list
-------------------------------*/


.column_list li {
	width:100%;
	margin-bottom:40px;
}

.column_line {
	width:100%;
}

.column_list figure {
	width:260px;
	height:150px;
	overflow:hidden;
}

.column_list figure img {
	transition:transform .3s;
}

.column_list a:hover figure img {
	transform:scale(1.1);
}

.column_list .column_txt {
	width:calc(100% - 260px);
	padding:0px 0 0 20px;
}

.column_line:hover .info_title {
	color:#0cd1f7;
}

.info_date {
	margin:0em 0 1.5em;
	display: inline-block;
	padding-right:0em;
}

.info_title  {
	font-size:2rem;
	margin-bottom:1em;
	max-height:100%;
}

.column_list li .info_date {
	margin-bottom:0.75em;
	margin-left:auto;
}



/*-------------------------------
	info detail
-------------------------------*/

.info_title_wrap {
	padding-bottom:1em;
	margin-bottom:1em;
	border-bottom:2px solid #0cd1f7;
}

.info_title_wrap .info_title {
	margin-bottom:0;
	font-size:2.8rem;
}

.info_detail_wrap .btn_orange span {
	padding-right:0;
	padding-left:1em;
}

.info_detail_wrap .btn_orange span::after {
	right:auto;
	left:0;
	transform:rotate(180deg);
}

/*-------------------------------
	responsive
-------------------------------*/

@media screen and (max-width:960px){

	.column_list figure {
		width:30%;
	}
	
	.column_list .column_txt {
		width:70%;
	}

} /* end 960px */


/*-------------------------------
	ver sp
-------------------------------*/

@media screen and (max-width:768px){


/*-------------------------------
	column list
-------------------------------*/

.column_affe_wrap {
	max-width:100%;
}

.column_list {
	padding:0;
	margin-bottom:25vw;
}

.column_list_wrap {
	width:100%;
	padding-right:0%;
}

/*-------------------------------
	column_featured 
-------------------------------*/

.column_featured {
	margin-bottom:20vw;
}

.column_featured a {
	width:100%;
	max-width:100%;
	margin-bottom:10vw;
}

.column_featured a:first-of-type {
	width:100%;
	max-width:100%;
}

.column_featured a figure {
	height:55.5vw;
	margin-bottom:3.5vw;
}

.column_featured a figure::after {
	width:25vw;
	height:8.75vw;
	line-height:8.75vw;
	border-radius:0 0 2.5vw 0;
	font-size:3.25vw;
}

.column_featured a:first-of-type figure {
	height:55.5vw;
	margin-bottom:3.5vw;
}

.column_featured a:first-of-type .column_txt {
	padding:0;
}

/*-------------------------------
	column_list
-------------------------------*/

.column_list li {
	width:100%;
	margin-bottom:10vw;
}

.column_list figure {
	width:38.333%;
	height:24.5vw;
}

.column_list .column_txt {
	width:61.667%;
	padding:0 0 0 2.5vw;
}

.info_title  {
	font-size:5vw;
}

.info_title_wrap .info_title {
	font-size:6vw;
}

.column_latest_list .info_title {
	font-size:4vw;
}


/*-------------------------------
	column detail
-------------------------------*/

.column_title_wrap {
	border-width:0.5vw;
}
	

} /* end 768px */