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

#welfare h3{
	font-size:2.6vw;
	line-height:1.4;
	margin-bottom:30px;}

#welfare .wrap{
	text-align:center;
	}

#welfare #performance {
	margin-top:50px;
}

#welfare #performance div {
	width:30%;
}

#welfare #performance div h4 {
	font-size:1.4vw;
	color:#004E8D;
	border-bottom:solid #004E8D 1px;
	margin-bottom:20px;
	padding:0.5vw 1vw;
}

#welfare #performance div img{
	width:50%;
}

#welfare #performance div p:nth-of-type(1){
	font-size:1.4vw;
}

#welfare #performance div .percent{
	display:block;
	font-size:5vw;
	color:#004E8D;
	line-height:1.2;
	font-weight: bold;
	font-family: 'Fjalla One', sans-serif;
}

#welfare #performance div .percent span{
	font-size:40%;
	margin-left:0.5rem;
}

#welfare article{
	margin:100px auto 0;
	}
	
#welfare .service{
	border:solid #E0E0E0 1px;}

#welfare .service ul li{
	list-style:disc;
	list-style-position:inside;
	text-align:left;}

#welfare #club h4,
#welfare #dormitory h4,
#welfare #item h4{
	display:inline-block;
	min-width:8.0vw;
	padding:0.5vw 1vw;
	margin-bottom:40px;
	background:#004E8D;
	color:#FFF;}

#welfare #club h5{
	font-size:1.6vw;
	color:#004E8D;
	}

#welfare #club .service{
	padding:30px;
	margin-top:50px;
	text-align:left;
	}

#welfare #club .service .link{
	margin-top:30px;}

#welfare #club .service .link a{
	color:#F18D1E;}







#welfare #dormitory .service{
	margin-top:30px;}
 
#welfare #dormitory > ul > li {
  display: flex;
  flex-direction: column;
  text-align:left;
}

#welfare #dormitory > ul > li > h5 {
	font-size:1.6vw;
	text-align:left;
	color:#004E8D;
	padding:30px 30px 5px;
}

#welfare #dormitory > ul > li > h5 + ul {
	padding:5px 0px 30px 30px;
}

#welfare #dormitory > ul > li > ul > li {
	list-style-type: disc;
	list-style-position:inside;
}

#welfare #dormitory > ul > li:nth-of-type(1) {
  width: 33.333%;
}

#welfare #dormitory > ul > li:nth-of-type(2) {
  width: 66.666%;
}
 
#welfare #dormitory .imgbox {
  margin-top: auto;
}

#welfare #dormitory li:nth-of-type(2) .imgbox p {
	width: 50%;
}

#welfare #dormitory li .imgbox p span {
	display:block;
	padding:10px;
}



#welfare #item .flexbox{
	margin-top:10px;}
	
#welfare #item > ul > li{
	width:30%;
	margin-bottom:30px;}

#welfare #item > ul > li h5{
	font-size:1.4vw;
	color:#F18D1E;
	padding-bottom: 10px;
	border-bottom:solid #F18D1E 1px;}

#welfare #item > ul > li p{
	margin-top:20px;
	text-align:left;}


@media screen and (max-width: 769px) {

#welfare h3{
	font-size:1.8rem;}

#welfare p{
	font-size:1.2rem;
	text-align:left;}

#welfare #performance div p {
	text-align:center;
	font-size:1.2rem;
}

#welfare #performance div p:nth-of-type(1){
	font-size:1.2rem;
	line-height:1.2;
}

#welfare #performance div h4 {
	font-size:1.6rem;
	padding:5px 0;
}


#welfare article{
	margin:50px auto 0;
	}

#welfare .service{
	font-size:1.2rem;}

#welfare #club h4,
#welfare #dormitory h4,
#welfare #item h4{
	font-size:1.6rem;
	min-width:120px;
	padding:5px 15px;
	margin-bottom:30px;}

#welfare #club h5{
	font-size:1.6rem;
	margin-bottom:10px;
	}

#welfare #club .service{
	padding:20px;
	margin-top:30px;
	}



#welfare #dormitory > ul > li > h5 {
	font-size:1.6rem;
	padding:20px 20px 5px;
}

#welfare #dormitory > ul > li > h5 + ul {
	padding:5px 20px 20px;
}

#welfare #dormitory > ul > li:nth-of-type(1) {
  width: 50%;
}

#welfare #dormitory > ul > li:nth-of-type(2) {
  width: 100%;
}




#welfare #item > ul > li{
	width:47%;}

#welfare #item > ul > li h5{
	font-size:1.6rem;}

}



@media screen and (max-width: 480px) {

#welfare #performance div {
	width:100%;
	margin-bottom:30px;
}

#welfare #performance div:last-of-type{
	margin-bottom:0;
}

#welfare #performance div .percent{
	font-size:5.0rem;
}


#welfare #dormitory > ul > li:nth-of-type(1) {
  width: 100%;
}

#welfare #dormitory > ul > li:nth-of-type(2) {
  width: 100%;
}

#welfare #item > ul > li{
	width:100%;}


}