@charset "UTF-8";

body	{
	margin: 0;
	height:100%;
	background-image: url(../i/back01.png);
	background-size:cover;
	font-family: 'Arial','Hiragino Mincho ProN','MS Mincho','Yu Mincho',  sans-serif;
	-webkit-text-size-adjust: none;
}

nav{
	position: fixed;
	width: 100%;  
	z-index: 999;
}


.com-name{
	float: left;
	padding: 0 50px;
}

.menu2{
	float: right;
}

/* ナビゲーション */
.menu{
	background-image: url(../i/back01.png);
}
.menu ul{
	margin: 0;
	padding: 0;
	list-style: none
}

.menu li a	{
	display: block;
	padding:0;
	height:64px;
	line-height:64px;
	vertical-align: middle;
	color: #000000;
	font-size: 15px;
	text-decoration: none
}

.menu li span{
	font-size: 10px;
}

.menu li a:hover{
	opacity: 0.5 ;
	background-color: #69008D;
	color: #fff;
}

.menu ul:after	{
	content: "";
	display: block;
	clear: both
}

.menu li{
	float: left;
	text-align: center;
	width: 150px;
}

header{
	padding-top: 50px;
}

header img{
	width:100%;
}

/*メインエリア*/
.main-area{
	width:100%;
	margin:0 auto;
}

.main-area h2{
	text-align:center;
	font-size:30px;
	font-weight:bold
}


.flexbox {
    display: flex;
    flex-wrap: wrap;
}

.flexbox a:hover{
	opacity: 0.8
}

.text-only{
	position: relative;
	width:600px;
	padding:15px;
	word-break: break-all;
	z-index: 10;	
}

.text-only label{
	font-size:20px;
	font-weight:bold
}

.text-only p{
	font-size:18px;
}

.textbox01{
	position: absolute;
	width: 94%;
	height:80%;
	padding:15px;
	top: 25px;
	left: 0;
	z-index: 3;
}

.backbox01{
	position: absolute;
	width: 97%;
	height:80%;
	top: 0;
	left: 0;
	z-index: 3;
	background-color: #D9A0A7;
}

.backbox02{
	position: absolute;
	width: 100%;
	height:80%;
	top: 10px;
	left: 0;
	z-index: 1;
	background-color: #E7C7BB;
}

.backbox03{
	position: absolute;
	width: 98.5%;
	height:80%;
	top: 20px;
	left: 0;
	z-index: 2;
	background-color: #9AA9A4;
}

.icon01{
	position: absolute;
	width:100px;
	height:76.5px;
	bottom: 30px;
	right: 0;
	z-index: 5;
	background-image: url(../i/icon01.png);
	background-repeat: no-repeat;
}

.icon02{
	position: absolute;
	width:100px;
	height:76.5px;
	bottom: 30px;
	right: 0;
	z-index: 5;
	background-image: url(../i/icon02.png);
	background-repeat: no-repeat;
}

.item{
	padding: 5px;
	margin: 5px;
	text-align: center;
	color: #000000;
	font-size: 15px;
	text-decoration: none;
	z-index: 10;
	vertical-align:top;
}

.item p{
	text-align: center;
	font-size:18px;
}

.item img {
  max-width: 250px;
  height: auto;
}

.natori-text{
	width:100%;
	margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
  	align-items: flex-start;
	justify-content: center;
}

.natori-item{
	width:33.3%;
	padding:10px 0;
	text-align: center;
	font-size:25px;
}

/* お知らせ */
.news-area{
	width: 100%;
	margin: 15px auto;
	padding: 0;
}
.news-area ul {
	margin:0;
	padding: 0;
	font-size: 15px;
	list-style: none;
}

.news-area li time{
	margin: 0;
	font-weight: 600;
}

.news-area li label{
	background-color:#B67BC4;
	padding:5px;
	color:#fff;
}

.news-area li{
	padding: 20px 0;
	border-bottom: solid 1px #000;
}

.news-container {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

/* スマホサイズの時に縦並びにする */
@media (max-width: 768px) {
  .news-container {
    flex-direction: column;
  }
}

.news-area-left {
  flex: 1;
}

.news-area-right {
  flex-shrink: 0;
}

.news-area-right img{
  max-width: 150px;
  height: auto;
}

.more-news{
	text-align:right;
}

.more-news a{
	text-decoration:none;
	color:#000;
}


.area05::after{
	clear:both;
}

.photo01 {
	width:100%;
	margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
  	align-items: flex-start;
	justify-content: center;
}

.photo01 a:hover{
	opacity: 0.8
}


footer{
	clear:both;
	width:100%;
	height: 180px;
	background-color: #555555;
}

/* コピーライト */
.copyright{
	width:100%;
	margin-top: 80px;
	padding: 30px 0 0 0;
	color: #fff;
	text-align:center;
}
.copyright a {
padding: 5px;
margin: 5px ;
color: #fff;
text-decoration: none
}

.copyright a:hover {
	color:#555555 
}

/* ########### 320px以上 ########### */
@media (min-width: 320px) {
	
}

/* ########### 519px以下 ########### */
@media (max-width: 519px) {
	#menubtn{
		padding: 6px 12px;
		position: fixed;
		border:none;
		top: 5px;
		right: 5px;
		cursor: pointer;
		z-index: 9999;
		background-color:rgba(0,0,0,0);
	}
	
	#menubtn:hover{
		background-color:rgba(0,0,0,0);
	}
	
	#menubtn:focus{
		outline: none
	}
	
	#menubtn i{
		color: #000;
		font-size: 25px
	}
	
	#menubtn span{
		display: inline-block;
		text-indent: -9999px
	}
	
	/* ナビゲーション */
	.menu{
		display: none
	}
	
	.menu li	{
		width: 100%;
	}
	
	.menu2{
		background-image: url(../i/back01.png);
	}	
	
	.flexbox{
		flex-wrap: wrap;
	  	align-items: center;
		justify-content: center;
	}
	
	.item img {
	  max-width: 180px;
	  height: auto;
	}
	
	.news-area li{
		padding:15px;
	}
	
	.news-area li time{
		margin: 0 15px 0 0;
	}
}

/* ########### 520px以上 ########### */
@media (min-width: 520px) {
	
}

/* ########### 959px以下 ########### */
@media (max-width: 959px) {
	.text-only{
		width:95%;
		height:350px;
	}
	
	.textbox01{
		width: 90%;
		height:80%;
	}
	
	.natori-item{
		width:50%;
		font-size:18px;
	}
}

/* ########### 960px以上 ########### */
@media (min-width: 960px) {
	/* トグルボタン */
	#menubtn{
		display: none
	}	

	/*メインエリア*/
	.main-area{
		width:1500px;
		margin:0 auto;
	}
	
	/* お知らせ */
	.news-area{
		width: 1000px;
		margin: 15px auto;
		padding: 0;
	}
}