@charset "utf-8";
/* CSS Document */

/*-----------------------------------------------
#19BEBE
-----------------------------------------------*/

/*-----------------------------------------------
  mainVisual
-----------------------------------------------*/
#mainVisual {
position: relative;
height: 42vw;
background-image: url("img/main.jpg");
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}
#mainVisual .logo {
position: absolute;
top: 35%;
right: 7.5%;
width: 25%;
}
@media screen and (max-width: 799px) {
	#mainVisual {
	height: 65vw;
	}
	#mainVisual .logo {
	position: absolute;
	top: 27.5%;
	right: 4%;
	width: 48%;
	}
}

/*-----------------------------------------------
  available
-----------------------------------------------*/
#available {
padding: 0 4%;
}
#available .border {
padding: 20px 0;
border-bottom: 1px solid #333;
}
#available .inner {
max-width: 800px;
margin: auto;
}
#available .link {
display: block;
font-size: 1.5em;
text-align: center;
color: #19BEBE;
}
#available .link a {
color: inherit;
}
#available .link a:hover {
text-decoration: underline;
}
#available .link::before {
content: "＞＞";
margin-right: 0.25em;
}
#available .link::after {
content: "＜＜";
margin-left: 0.25em;
}
@media screen and (max-width: 799px) {
	#available .border {
	padding: 4% 0;
	}
	#available .link {
	font-size: 1.25em;
	}
}

/*-----------------------------------------------
  news
-----------------------------------------------*/
#news {
padding: 20px 4% 60px 4%;
}
#news .inner {
max-width: 800px;
margin: auto;
}
#news .list {
margin-top: 60px;
}
#news .list dl {
display: flex;
justify-content: flex-start;
align-items: center;
padding: 20px 0;
border-bottom: 1px solid #C8C8C8;
}
#news .list dl:first-child {
border-top: 1px solid #C8C8C8;
}
#news .list .date {
width: 8em;
}
#news .list .text {
width: calc(100% - 8em);
font-weight: 400;
}
#news a:hover {
text-decoration: underline;
}
#news .more {
margin-top: 30px;
font-size: 1.25em;
text-align: center;
}
@media screen and (max-width: 799px) {
	#news {
	padding: 4% 4% 8% 4%;
	}
	#news .list {
	margin-top: 0;
	}
	#news .list dl {
	display: block;
	padding: 2.5% 0;
	}
	#news .list dl:first-child {
	border-top: 0;
	}
	#news .list .date {
	width: 100%;
	}
	#news .list .text {
	width: 100%;
	}
	#news .more {
	margin-top: 8%;
	font-size: 1em;
	}
}


/*-----------------------------------------------
  gallery
-----------------------------------------------*/
#gallery {
padding: 40px 0 20px 0;
background: #F0F0F0;
}
#gallery .photo img {
margin-bottom: 0.5em;
}
#gallery .photo li {
margin: 0 20px;
font-size: 0.875em;
text-align: center;
}
#gallery .arrow {
position: absolute;
z-index: 100;
width: 60px;
border-radius: 50%;
box-shadow: 2px 2px 4px rgba(0,0,0,0.25);
transition: 0.2s;
}
#gallery .arrow:hover {
cursor: pointer;
opacity: 0.75;
}
#gallery .prev {
left: calc(30% - 50px);
top: calc(50% - 40px);
}
#gallery .next {
right: calc(30% - 50px);
top: calc(50% - 40px);
}
@media screen and (max-width: 799px) {
	#gallery {
	padding: 4% 0;
	}
	#gallery .photo li {
	margin: 0 10px;
	}
	#gallery .arrow {
	width: 50px;
	}
	#gallery .prev {
	left: 4%;
	top: calc(50% - 35px);
	}
	#gallery .next {
	right: 4%;
	top: calc(50% - 35px);
	}
}

/*-----------------------------------------------
  facility
-----------------------------------------------*/
#facility {
padding: 60px 4%;
}
#facility .inner {
max-width: 1200px;
margin: auto;
}
#facility .grid {
display: flex;
justify-content: space-between;
align-items: stretch;
padding: 30px;
}
#facility .grid:not(:first-child) {
border-top: 1px solid #C8C8C8;
}
#facility .photo {
width: 32%;
}
#facility dl {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
width: 65%;
}
#facility dt {
font-size: 1.5em;
font-weight: 400;
}
#facility dt .num {
margin-left: 0.5em;
font-size: 0.6em;
color: #000;
}
#facility .text {
margin-top: 20px;
line-height: 1.75;
text-align: justify;
}
#facility .link {
margin-top: auto;
font-size: 1.25em;
}
#facility .link a:hover {
text-decoration: underline;
}
@media screen and (max-width: 799px) {
	#facility {
	padding: 8% 4% 2% 4%;
	}
	#facility .grid {
	display: block;
	padding: 6% 0;
	}
	#facility .grid:not(:first-child) {
	border-top: 1px solid #C8C8C8;
	}
	#facility .photo {
	width: 100%;
	max-width: 600px;
	margin: auto;
	}
	#facility .photo img {
	width: 100%;
	height: 50vw;
	object-fit: cover;
	}
	#facility dl {
	display: block;
	width: 100%;
	margin-top: 4%;
	}
	#facility dt {
	font-size: 1.5em;
	font-weight: 400;
	}
	#facility dt .num {
	display: block;
	margin: 2% 0 0 0;
	}
	#facility .text {
	margin-top: 4%;
	line-height: 1.5;
	}
	#facility .link {
	margin-top: 4%;
	font-size: 1.15em;
	}
}

/* color */
#facility .facility1 dt,
#facility .facility1 .link a {
color: #D778B4;
}
#facility .facility2 dt,
#facility .facility2 .link a {
color: #19BE40;
}
#facility .facility3 dt,
#facility .facility3 .link a {
color: #19BEFF;
}
#facility .facility4 dt,
#facility .facility4 .link a {
color: #FF8200;
}

/*-----------------------------------------------
  worker
-----------------------------------------------*/
#worker {
padding: 60px 4%;
background: #A5E6E6;
}
#worker .inner {
max-width: 1080px;
margin: auto;
}
#worker h2 {
font-size: 2em;
line-height: 1.75;
text-align: center;
}
#worker h3 {
margin-top: 40px;
padding: 0.25em;
font-size: 1.5em;
text-align: center;
color: #19BEBE;
background: linear-gradient(to right, rgba(255,255,255,0) 0%, #FFF 20%, #FFF 80%, rgba(255,255,255,0) 100%);
}
#worker .list {
width: 80%;
margin: auto;
margin-top: 20px;
}
#worker .list dl {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-top: 10px;
}
#worker .list dt {
width: 12em;
font-size: 1.25em;
font-weight: 400;
}
#worker .list dd {
width: calc(100% - 15em);
}
#worker .pict {
margin-top: 40px;
padding: 4%;
background: #FFF;
border-radius: 10px;
}
@media screen and (max-width: 799px) {
	#worker {
	padding: 8% 4%;
	}
	#worker h2 {
	font-size: 1.25em;
	line-height: 1.5;
	text-align: justify;
	}
	#worker h3 {
	margin-top: 6%;
	font-size: 1.25em;
	}
	#worker .list {
	width: 100%;
	margin-top: 4%;
	}
	#worker .list dl {
	display: block;
	margin-top: 4%;
	}
	#worker .list dt {
	width: 100%;
	font-size: 1.15em;
	}
	#worker .list dd {
	width: 100%;
	}
	#worker .pict {
	margin-top: 6%;
	}
}


