/* ===================================================================
other
=================================================================== */
/* ===================================
item-list
=================================== */
.item-list{
	padding: 50px 0 0;
}

@media only screen and (max-width: 750px){
	.item-list{
		width: 92%;
		margin-right: auto;
		margin-left: auto;
	}
}

.item-list li{
	padding: 30px 0;
}

@media only screen and (max-width: 750px){
	.item-list li{
		padding: 20px 0;
	}
}

.item-list li +li{
	border-top: 1px solid #dcdcdc;
}

.item-list li:last-child{
	padding-bottom: 0;
}

.item-list li .imgtxt-box{
	margin-top: 0;
}

@media only screen and (max-width: 750px){
	.item-list li .imgtxt-box{
		display: block;
		width: 100%;
	}
}

@media only screen and (max-width: 750px){
	.item-list li .imgtxt-box .img{
		max-width: 100%;
		width: 100%;
	}
}

.item-list li .imgtxt-box .img img{
	width: 320px;
	height: auto;
}

@media only screen and (max-width: 750px){
	.item-list li .imgtxt-box .img img{
		width: 100%;
	}
}

@media only screen and (max-width: 750px){
	.item-list li .imgtxt-box .description{
		width: 100%;
		margin-top: 18px;
	}
}

.item-list .btn-wrap{
	margin-top: 20px;
	padding: 0;
	/* flex */

	justify-content: flex-start;
}

.item-list .btn{
	margin: 0;
}

@media only screen and (max-width: 750px){
	.item-list .btn{
		width: 72.46%;
	}
}

.item-list .btn +.btn{
	margin-left: 15px;
}

@media only screen and (max-width: 750px){
	.item-list .btn +.btn{
		margin-left: 0;
	}
}

.item-list .btn a span{
	/* flex */
	display: flex;
	flex-direction: row;

	align-items: center;
	flex-wrap: nowrap;
	justify-content: flex-start;
}

.item-list .btn a span::before{
	display: block;
	content: '';
}

.item-list .btn a.blank::before{
	width: 13px;
	height: 13px;
	border: none;
	background: url(/wp-content/themes/Twellv/assets/common/img/icon_blank.png) left top no-repeat;
	background-size: 13px	auto;
	transform: none;
}

.item-list .btn a.blank:hover::before{
	background: url(/wp-content/themes/Twellv/assets/common/img/icon_blank_white.png) left top no-repeat;
	background-size: 13px	auto;
}

.item-list .btn.twitter a span{
	margin-left: -20px;
}

.item-list .btn.twitter a span::before{
	width: 24px;
	height: 20px;
	margin-right: 10px;
	background: url(/wp-content/themes/Twellv/assets/common/img/icon_share_twitter_color.png) left top no-repeat;
	background-size: 24px auto;
}

.item-list .btn.twitter a:hover span::before{
	background: url(/wp-content/themes/Twellv/assets/common/img/icon_share_twitter.png) left top no-repeat;
	background-size: 24px auto;
}

.item-list .btn.facebook a span{
	margin-left: -10px;
}

.item-list .btn.facebook a span::before{
	width: 23px;
	height: 23px;
	margin-right: 10px;
	background: url(/wp-content/themes/Twellv/assets/common/img/icon_share_facebook_color.png) left top no-repeat;
	background-size: 23px auto;
}

.item-list .btn.facebook a:hover span::before{
	background: url(/wp-content/themes/Twellv/assets/common/img/icon_share_facebook.png) left top no-repeat;
	background-size: 22px auto;
}

/* ===================================
howto-list
=================================== */
.howto-list{
	/* flex */
	display: flex;
	flex-direction: row;
	position: relative;

	align-items: flex-start;
	flex-wrap: nowrap;
	justify-content: center;
}

@media only screen and (max-width: 750px){
	.howto-list{
		flex-direction: column;
		width: 92%;
		margin-right: auto;
		margin-left: auto;

		flex-wrap: wrap;
	}
}

.howto-list li{
	/* flex */
	display: flex;
	flex-direction: row;
	margin: 0 80px;

	align-items: stretch;
	flex-wrap: nowrap;
	justify-content: center;
}

@media only screen and (max-width: 750px){
	.howto-list li{
		display: block;
		width: 100%;
		margin-right: auto;
		margin-left: auto;
	}
	.howto-list li +li{
		margin-top: 20px;
	}
}

.howto-list li:first-child::after{
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 53px;
	height: 53px;
	background: url(/wp-content/themes/Twellv/assets/common/img/img_plus.gif) left top no-repeat;
	content: '';
	transform: translate(-50%, -50%);
}

.howto-list li:first-child::after _::content,
.howto-list li:first-child::after _:future,
.howto-list li:first-child::after:not(*:root){
	image-rendering: -webkit-optimize-contrast;
}

@media only screen and (max-width: 750px){
	.howto-list li:first-child::after{
		position: static;
		position: static;
		top: auto;
		left: auto;
		margin-top: 20px;
		margin-right: auto;
		margin-left: auto;
		transform: none;
	}
}

.howto-list li .description{
	width: 180px;
	margin-right: 20px;
}

@media only screen and (max-width: 750px){
	.howto-list li .description{
		width: 100%;
		margin-right: 0;
		font-size: 13px;
		font-size: 1.3rem;
	}
}

@media only screen and (max-width: 750px){
	.howto-list li .img{
		margin-top: 20px;
		text-align: center;
	}
}

.howto-list li .img img{
	width: 180px;
	height: auto;
}

@media only screen and (max-width: 750px){
	.howto-list li .img img{
		width: 40%;
	}
}

.howtowatch .list li img{
	margin: 0 10px;
	vertical-align: middle;
}

.howtowatch .text-wrap .notes{
	margin-top: 0;
	color: #999999;
}
