@charset "utf-8";
/*///////////////////// font-face 読み込み例 ///////////////////////////*/

/*NotoSansJP 300*/
@font-face {
    font-family: 'NotoSansJP';
    src: url(/fonts/NotoSansJP-Light.woff);
    font-weight: 300;
    font-display: swap;
}
/*NotoSansJP 400*/
@font-face {
    font-family: 'NotoSansJP';
    src: url(/fonts/NotoSansJP-Regular.woff);
    font-weight: 400;
    font-display: swap;
}
/*NotoSansJP 500*/
@font-face {
    font-family: 'NotoSansJP';
    src: url(/fonts/NotoSansJP-Medium.woff);
    font-weight: 500;
    font-display: swap;
}
/*NotoSansJP 600*/
@font-face {
    font-family: 'NotoSansJP';
    src: url(/fonts/ZenOldMincho-Bold.woff2);
    font-weight: 600;
    font-display: swap;
}


body {
	/*スマホで勝手に文字が大きくなる対策*/
	-webkit-text-size-adjust: 100%;
}

#contents_outer {
	background-color: #fff!important;
}
#contents {
	padding-bottom: 100px;
}
#path,
.h1_section {
	display: none;
}

.l-contents * {
	font-family: 'Noto Sans JP', sans-serif;
	box-sizing: border-box;
	letter-spacing: normal;
}
#contents_outer #article {
	width: 950px;
	margin: 0 auto;
	float: none;
}
#contents_outer #article a {
	transition: .3s;
}
#contents_outer #article a:hover {
	text-decoration: none;
	opacity: .8;
}

/*///////////////// 各部共通 ここから \\\\\\\\\\\\\\\\\\*/
.pg_inner {
	width: 1140px;
	margin: 0 auto;
	padding-bottom: 100px;
}
.storeTabItems---daikokucho a {
	background-color: #E61019;
}
.storeTabItems---awazaStation a {
	background-color: #C76983;
}
.storeTabItems---sakaisujiHommachi a {
	background-color: #007D57;
}
.storeTabItems---miyakojima a {
	background-color: #7F2668;
}

/*\\\\\\\\\\\\\\\\\ 各部共通 ここまで //////////////////*/


.mainView * {
	text-align: center;
}
.mainView {
	padding: 40px 0 0;
	margin: 0 0 60px;
}
.mainCatch {
	font-size: 36px;
	color: #001F65;
	font-weight: 300;
	margin: 0 0 15px;
	text-indent: -3px;
	letter-spacing: 1px;
}
.headLine {
	color: #333;
	font-size: 16px;
	line-height: 1.7;
	letter-spacing: 0.4px;
}

.storeTabList {
	display: flex;
	justify-content: space-between;
	margin: 0 0 60px;
}
[class*='storeTabItems---'] {
	width: 368px;
}
[class*='storeTabItems---'] a {
	position: relative;
	width: 100%;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	font-weight: bold;
	color: #fff;
}
[class*='storeTabItems---'] a::after {
	position: absolute;
	content: "";
	background: url(/images/staff/icon_bottom_arw.png)no-repeat center / cover;
	width: 15px;
	height: 9px;
	top: 0;
	bottom: 0;
	right: 22px;
	margin: auto;
	transition: .2s;
}
[class*='storeTabItems---'] a:hover::after {
	transform: translateY(3px);
}

[class*='storePanel---'] {
	padding-top: 130px;
	margin-top: -130px;
}
[class*='storePanel---']:not(:last-child) {
	margin-bottom: 60px;
}
.storeName {
	width: 292px;
    height: 70px;
}
.storeName span {
	font-size: 28px;
	font-weight: bold;
	color: #fff;
}
.daikokucho_name {
	background: url(/images/staff/ttl_bnr_daikokucho.png) no-repeat center / contain;
	padding: 15px 0 12px 76px;
}
.awazastation_name {
	background: url(/images/staff/ttl_bnr_awazastation.png) no-repeat center / contain;
	padding: 15px 0 12px 44px;
}
.sakaisujihommach_name {
	background: url(/images/staff/ttl_bnr_sakaisujihommach.png) no-repeat center / contain;
	padding: 15px 0 12px 60px;
}
.miyakojima_name {
	background: url(/images/staff/ttl_bnr_miyakojima.png) no-repeat center / contain;
	padding: 15px 0 12px 90px;
}

.staffBox {
	border: 1px solid;
	padding: 30px 40px 10px;
	display: flex;
	flex-wrap: wrap;
}
.storePanel---daikokucho .staffBox {
	border-color: #E61019;
}
.storePanel---awazaStation .staffBox {
	border-color: #C76983;
}
.storePanel---sakaisujiHommachi .staffBox {
	border-color: #007D57;
}
.storePanel---miyakojima .staffBox {
	border-color: #7F2668;
}

.staffItems {
	width: 339px;
	margin-right: 20px;
	margin-bottom: 30px;
}
.staffItems:nth-child(3n) {
	margin-right: 0;
}
.staffImages {
	width: 100%;
	height: 234px;
	margin: 0 0 13px;
}
.staffImages a * {
	position: absolute;
	width: 100%;
	height: 100%;
	transition: .4s;
	object-fit: cover;
}
.staffImages a {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	border: 1px solid #DBDBDB;
	overflow: hidden;
}
.hoverCover {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(0,0,0,.0);
	font-size: 18px;
	padding: 0 0 0 25px;
	color: #fff;
	font-weight: 500;
	text-shadow: 0 1px 10px #484848;
	opacity: 0;
	overflow: hidden;
	z-index: 2;
}
.storePanel---daikokucho .hoverCover {
	background-color: rgba(230,16,25,.0);
}
.storePanel---awazaStation .hoverCover {
	background-color: rgba(199,103,131,.0);
}
.storePanel---sakaisujiHommachi .hoverCover {
	background-color: rgba(0,126,88,.0);
}
.storePanel---miyakojima .hoverCover {
	background-color: rgba(127,38,104,.0);
}

.staffImages a:hover .hoverCover {
	opacity: 1;
	overflow: visible;
}
.storePanel---daikokucho .staffImages a:hover .hoverCover {
	background-color: rgba(230,16,25,.3);
}
.storePanel---awazaStation .staffImages a:hover .hoverCover {
	background-color: rgba(199,103,131,.3);
}
.storePanel---sakaisujiHommachi .staffImages a:hover .hoverCover {
	background-color: rgba(0,126,88,.3);
}
.storePanel---miyakojima .staffImages a:hover .hoverCover {
	background-color: rgba(127,38,104,.3);
}

.hoverCover::before,
.hoverCover::after {
	position: absolute;
	content: "";
	background-color: #fff;
	box-shadow: 0 0 7px #000000;
	width: 1px;
	height: 15px;
	top: 0;
	left: 0;
	right: 45px;
	bottom: 0;
	margin: auto;
}
.hoverCover::before {
	transform: rotate(90deg);
}
.innerImages {
	display: block;
	z-index: 1;
}
.staffImages a:hover .innerImages {
	transform: scale(1.05);
}
.staffName {
	font-size: 24px;
	font-weight: bold;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	margin: 0 0 11px;
}
.staffComments {
	line-height: 1.6;
	margin: 0 0 8px;
	font-size: 16px;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.messageBox dd {
	width: 100%;
	border-radius: 15px;
	padding: 14px 15px;
	background-color: #EFFAFF;
}
.messageBox dd .innerTexts {
	max-height: 50px;
	font-size: 16px;
	color: #002067;
	line-height: 1.5;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
