@charset "utf-8";

/* ***************************************************************************************************
	COMMON
*************************************************************************************************** */

  @media screen and (max-width: 768px) {
	.mainRoleHeaderVisualBox .ppic img {
	  margin-left: -25%;
	}
}


/* ***************************************************************************************************
	PAGE
*************************************************************************************************** */

/* galleryContainer
------------------------------------------------------------------------ */
	.galleryContainer .contbox {
		width:var(--default-contentWide-XM);
	}
	.galleryContainer:not(.cat-2ldk) {
		position: relative;
		margin-top:		clamp(90px, 10.833vw, 120px);	/* 1200px以下からサイズ変更 */
		padding-top:	clamp(90px, 10.833vw, 120px);	/* 1200px以下からサイズ変更 */
	}
	.galleryContainer:not(.cat-2ldk)::before {
	  content: "";
	  position: absolute;
	  top: 0;
	  bottom: auto;
	  left: 0;
	  right: 0;
	  width: var(--default-contentWide-XM);
	  max-width: 1260px;
	  margin: auto;
	  border-top: 1px solid #555;
	}

@media screen and (max-width: 520px) { /*{SPs}*/
	.galleryContainer:not(.cat-2ldk) {
		position: relative;
		margin-top:		60px;
		padding-top:	60px;
	}
	.galleryContainer:not(.cat-2ldk)::before {
		width: 100%;
	}
}

/* lNav
------------------------------------------------------------------------ */
	.lNavWrap {
		max-width: calc(1260px + (5px * 2));	
		margin-bottom: 0.5em;
	}
	.lNavWrap ul {
		margin: 0 auto;
	}
	.lNavWrap ul li {
		width: 25%;
		padding: .82em 5px;
	}
	.lNavWrap ul li a {
		min-height: 50px;
		border-radius: 3px 3px 0 0;
	}
	.lNavWrap li:not(.is_current) a::after {
		content: "";
		display: block;
		position: absolute;
		top: 0;
		bottom: 0;
		left: auto;
		margin: auto;
		right: 14px;
		width: 10px;
		height: 10px;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		transform: rotate(135deg);
		transition: all .2s;
	}
	.lNavWrap li a .ln .en {
		font-size: 1.19em;
	}
	.lNavWrap li:not(.is_current) a:hover::after {
		top: 0.3em;
	}
	
@media (hover:hover) {
		.lNavWrap li:not(.is_current) a:focus {
		background: rgba(147,143,137, 1);
	}
}
@media screen and (max-width: 900px) { /*{MinorBreakpoint}*/
	.lNavWrap ul li {
		width: 50%;
		padding: .3em 5px;
	}
	.lNavWrap ul li a {
		min-height: 40px;
		padding: .5em 1.2em .55em;
	}

}
@media screen and (max-width: 520px) { /*{SPs}*/
	.lNavWrap li a .ln .sml {
		display: block;
		line-height: 0.6;

	}
	.lNavWrap li:not(.is_current) a::after {
		right: 10px;
		width: 8px;
		height: 8px;
	}

}


/* ***************************************************************************************************
	PAGE
*************************************************************************************************** */

/* mr_Slick_wrap
------------------------------------------------------------------------ */
	.mr_Slick_wrap{
	}
	.mr_Slick_wrap .slick-dotted.slick-slider {
		margin-bottom: 10px;
	}
	.mr_Slick_wrap .slideItem {
		position: relative;
	}
	.mr_Slick_wrap .slideItem small {
		font-size: 1.3rem;
		font-family:var(--site-font_family-serif);
		background: rgba(0, 0, 0, .45);
		padding: 5px 10px;
	}
	.mr_Slick_wrap .slideItem small.leftCap {
		left: 0;
		right:auto;
	}
	.mr_Slick_wrap .slick-dots{
		position: static !important;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.mr_Slick_wrap .slick-dots li {
		height: auto !important;
		width: calc(12.5% - 10px);
		margin: 0.95% 5px;
		background:#000;
		/*margin: 0.95% 0.3%;
		width: 16%;*/
		position: relative;
	}
	.mr_Slick_wrap .slick-dots button,
	.mr_Slick_wrap .slick-dots button:hover { /* module.css のリセット */
		display: block;
		width: auto;
		height: auto;
		padding: 0;
		cursor: pointer;
		font-size: 0;
		line-height: 0;
		border: 0;
		border-radius: 0;
		background: transparent !important;
		width: 100%!important;
		height: 100%!important;
	}
	.mr_Slick_wrap .slick-dots li img {
		width: 100%;
		max-width: none;
		height: auto;
		opacity: 0.4;
		transition: opacity 0.25s ease-out;
	}

	/* active , hover */
	.mr_Slick_wrap .slick-dots li.slick-active {
		box-shadow: 0 0 0 1px #ffffff;
	}
	.mr_Slick_wrap .slick-dots li.slick-active img {
		opacity: 1;
	}
	.mr_Slick_wrap .slick-dots li:not(.slick-active) button:hover img,
	.mr_Slick_wrap .slick-dots li:not(.slick-active) button:focus img{
		opacity: 0.85;
	}

	.mr_Slick_wrap .slick-dots li.slick-active button::before{
		content:none!important;
	}

@media screen and (max-width: 980px) { /*{TBs}*/

}
@media screen and (max-width: 768px) { /*{SP}*/
	.mr_Slick_wrap .slick-dots{
		/*justify-content: space-between;*/
	}
	.mr_Slick_wrap .slick-dots li {
		margin: 0.95% 0.5%;
		width: 32.3333%!important;
	}
	.cat-1r .mr_Slick_wrap .slick-dots li,
	.cat-common .mr_Slick_wrap .slick-dots li {
		width:24%!important;
	}
	.mr_Slick_wrap .slideItem small {
		font-size: 1rem;
		padding: 0.3em 0.7em;
	}

}
@media screen and (max-width: 520px) { /*{SPs}*/


}


/* slick-arrow(矢印の設定)
--------------------------------- */
	.mr_Slick_wrap .slick-arrow {
		z-index: 1;
		width: 64px;
		height: 77px;
		overflow: hidden; /* 矢印の形を成型するため */
	}
	.mr_Slick_wrap .slick-prev {
		left: 0;
	}
	.mr_Slick_wrap .slick-next {
		right: 0;
	}
	.slick-prev, .slick-next {
		top: 40%!important;
	}
	.mr_Slick_wrap .slick-arrow::before {
		content: "";
		display: block;
		width: 64px;
		height: 64px;
		border: 0 solid #fff;
		border-width: 7px 7px 0 0;
	}
	.mr_Slick_wrap .slick-prev::before {
		transform: translateX(17%) scaleX(0.55) rotate(-135deg);
	}
	.mr_Slick_wrap .slick-next::before {
		transform: translateX(-17%) scaleX(0.55) rotate(45deg);
	}
@media screen and (max-width: 1340px) { /*{TBl}*/
	.mr_Slick_wrap .slick-arrow {
		width: 54px;
		height: 67px;
	}
	.mr_Slick_wrap .slick-arrow::before {
		width: 54px;
		height: 54px;
	}
}
@media screen and (max-width: 768px) { /*{SP}*/
		.slick-prev, .slick-next {
		top: 33%!important;
	}
	.mr_Slick_wrap .slick-arrow {
		width: 7.3vw;
		height: 8.8vw;
	}
	.mr_Slick_wrap .slick-arrow::before {
		width: 7.3vw;
		height: 7.3vw;
		border-width: calc(2px + 0.5vw) calc(2px + 0.5vw) 0 0;
	}
}