@charset "UTF-8";

.works_ph {
  height: 130px;
  padding: 0;
  background: #d9d9d9;
}
.works_ph_main {
  width: 100%;
  height: 700px;
  background: #d9d9d9;
}
.works_cat01 {
  background: #a7b697;
}
.works_cat02 {
  background: #dbcaba;
}
.works_cat03 {
  background: #aabbcf;
}


:root {
  --textdarkgray: #3e3a39;
  --textlightgray: #959696;
  --darkgray: #727171;
  --mediumgray: #999999;
  --lightgray: #808080;
  --bordergray: #d2d3d3;
  --darkgold: #9a8a7a;
  --mediumgold: #a3916c;
  --lightgold: #b5a695;
  --redgold: #6c4f43;
  --prime: #3f4044;
  --primetitle: #968d8d;
  --court: #90732f;
  --courttitle: #cebf9c;
  --stage: #979798;
  --stagetitle: #d8d6d6;
  --realestate: #887752;
  --teal: #6c8a86;
  --mainnavbar: #666666;
  --beigebg: #e7e2de;
  --goldbg: #efebe2;
  --lightgraybg: #edeeee;
  --red: #6f262b;
}



.selecter a {
	display: block;
	font-size: 14px;
	background: #a6b2b6;
	color: #fff;
	width: 100%;
	padding: 10px;
	text-align: center;
}
.selecter a:hover {
	background: #000;
}
.box-ph {
	height: 190px;
}
.bg-contents {
	position: absolute;
	width: 100%;
	height: 360px;
	top: 0;
	left: 0;
	background: #90B1C4;
	z-index: -1;
}
.item-icon {
	width: 90px;
	height: 90px;
}

.text-overflow-line3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}
.swiper {
	position: relative;
	overflow: hidden;
}
.slide-media {
	width: 100%;
	height: 525px;
}
.thumb-media {
	width: 25%;
	height: 125px;
}
.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 {
    top: 300px;
    left: 0;
    /* background: #000; */
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    top: 300px;
    right: 0;
    /* background: #000; */
}
.swiper-button-next:after, .swiper-button-prev:after {
      font-size: 3rem;
    font-weight: 600;
    color: #000;
}




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




}

@media (max-width: 768px) {

.slide-media {
	height: 200px;
}
.thumb-media {
	height: 60px;
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    top: 100px;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    top: 100px;
}
.swiper-button-next:after, .swiper-button-prev:after {
    font-size: 1.3rem;
}








}