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

/*=========================================== 
スマホ向けのレイアウトの指定：～768px 
===========================================*/
@media only screen and (min-width: 0px) {

html,body{
	color: rgb(50,50,50);
}

#container{
	display: none;
}


/*メインビジュアル*/
.mv{
	width: 100%;
	height: 200px;
	margin: 0 auto;
}

.title_box{
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mv h1.title{
	margin: 70px auto 0;
	padding: 10px 20px;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	line-height: 1.3;
	letter-spacing: 0.06em;
	font-family: serif;
	color: rgb(82,118,119);
	background: rgba(255,255,255,0.7);
}

.mv .small{
	margin: 10px auto 0;
	font-size: 20px;
	text-align: center;
	font-family: 'Satisfy', cursive;
	color: rgb(240,240,240);
}


/*パンくずリスト*/
#breadcrumb{
	width: 100%;
	margin: 0 auto;
	background: rgb(240,240,240);
}

#breadcrumb ul{
	width: 90%;
	margin: 0 auto;
	padding: 10px;
	overflow: hidden;
}

#breadcrumb ul li{
	font-size: 14px;
	line-height: 1.5;
    float: left;
}

#breadcrumb ul li:after {
	font-family: "Font Awesome 5 Free";
	content: "\f054";
	font-weight: 900;
	
    margin: 0 8px;
	color: rgb(138,198,206);
}

#breadcrumb ul li:last-child:after {
    content: "";
}

#breadcrumb ul li a{
	color:rgb(50,50,50);
}
    
    
.news {margin: 20px auto 0;}

.news a {
    display: block;
    padding: 20px;
    color: rgb(220,0,0);
    font-size: 16px;
    font-weight: bold;
    text-decoration: underline;
    cursor: pointer;
}

}


/*=========================================== 
PC向けのレイアウトの指定：768px〜
===========================================*/
@media only screen and (min-width: 769px) {


/*メインビジュアル*/
.mv{
	width: 100vw;
}

.mv h1.title{
	margin: 64px auto 0;
	padding: 20px 80px;
	font-size: 32px;
}

.mv .small{
	font-size: 32px;
}


/*パンくずリスト*/
#breadcrumb{
	width: 100vw;
	margin: 0 auto;
}

#breadcrumb ul{
	width: auto;
	max-width: 940px;
}

#breadcrumb ul li{
	line-height: 1;
}
}