@charset "UTF-8";

.maru-box {
	width: 240px;
	height: 240px;
	border-radius: 120px;
	border: solid 1px #000;
	padding: 40px;
}
.maru-box a{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	text-indent:-999px;
}
.maru-box:hover {
	background: #84a2b3;
	border: solid 1px #84a2b3;
	color: #fff;
}
.yaji {
	border-bottom: solid 1px #000;
	margin-bottom: 5px;
}
.maru-box:hover .yaji {
	border-bottom: solid 1px #fff;
}

.bg-w-wrap {
	position: absolute;
	top: 0;
	right: 0;
	z-index: -1;
	background: #e6e6e6;
	width: 100%;
	height: 100%;
}
.bg-w-box {
	position: absolute;
	top: 0;
	right: 0;
	background: #fff;
	width: 90%;
	height: 100%;
	z-index: -1;
}
.kurobox {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 45%;
	background:rgba(0,0,0,0.7);
}
.yajirushi {
	position: absolute;
	top: 68%;
	right: 2%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
}





.bg-contents {
	position: absolute;
	width: 100%;
	height: 360px;
	top: 0;
	left: 0;
	background: #90B1C4;
	z-index: -1;
}
.item-icon {
	width: 90px;
	height: 90px;
}
.works-ph {
	height: 200px;
}

.swiper {
	position: relative;
	overflow: hidden;
}
.slide-media {
	width: 100%;
	height: 500px;
}
.thumb-media {
	width: 25%;
	height: 60px;
}
.thumb-media:hover img{
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    left: 0;
    background: #000;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    right: 0;
    background: #000;
}
.swiper-button-next:after, .swiper-button-prev:after {
    font-size: 1.4rem;
    color: #fff;
}



/*PCのみ*/
@media (min-width: 768px) {




}

@media (max-width: 768px) {

	.maru-box {
		width: 110px;
		height: 110px;
		border-radius: 55px;
		border: solid 1px #000;
		padding: 5px;
	}
	.bg-w-box {
		width: 98%;
	}


}