.host_sns{
	width: 94%;
	margin: 12px auto 0;
	display: flex;
	gap: 2% 4%;
}

.group_sns{
	width: 55%;
	margin: 12px auto 0 3%;
	display: flex;
	gap: 2% 8%;
}

.group_sns li,
.host_sns li{
	width: 19%!important;
}

.group_sns li a img,
.host_sns li a img{
	width: 100%;
	display: block;
}

.hostimg{
	width: 90%!important;
}

.ranksep{
	display: flex;
	flex-wrap: wrap;
	gap: 8px 2%;
}

.ranksep section{
	width: 48%;
}

.ranksep section.no1{
	width: 98%;
}

.js-tab-contents {
	display: none;
}

.js-tab-wrap > ul{
	width:100%;
	margin:12px auto 0;
	display:flex;
	font-size:14px;
}

.js-tab-wrap ul li{
	width:50%;
}

.js-tab-contents.current {
	display: block;
}

.js-tab-btn {
	padding: 4px;
	background: #fff;
	border-bottom: 2px solid #ddd;
	text-align: center;
	font-size: 14px;
}

.js-tab-btn.current {
	color: #4d7ba7;
	background: #fff;
	border-bottom: 2px solid #4d7ba7;
	font-weight: bold;
	font-size: 120%;
}

.hostwork_rec:before{
	content: '' !important;
	display: inline-block !important;
	width: 28px !important;
	height: 28px !important;
	background-image: url(https://host-work.com/special/s679/hostworklogo.gif) !important;
	background-size: contain !important;
	vertical-align: middle !important;
	margin-right: 4px !important;
	margin-bottom: 4px !important;
	background-color: #fff !important;
}


@media only screen and ( min-width : 600px ) {

.ranksep section.no1,
.ranksep section{
	width: 18%;
}

.group_sns{
	width: 30%;
	margin: 12px auto 0 3%;
	display: flex;
	gap: 2% 8%;
}

}

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

.ranksep section.no1 .rankhostsep .host_sns{
	width: 50%;
	margin: 12px auto 0 3%;
	display: flex;
	gap: 2% 8%;
}

.ranksep section.no1 .hostwork_rec{
	font-size: 110%;
}

.js-tab-wrap > ul{
	flex-wrap: wrap;
}

.js-tab-wrap ul li{
	width:16.5%;
}


}
