@charset "UTF-8";

/* +++ acs +++ */
#acs{
	border:1px solid #cc0000;
	margin:1em auto;
	width:90vw;
	padding:0 1em;
}
#acs p{
	font-size:1.2em;
	font-weight: 600;
	text-align:center;
}
@media all and (min-width:1024px){
#acs{
	width:40%;
}
}

/* +++ banner +++ */
.bannerlist{
	margin-bottom:1em;
}
/* +++ LINE +++ */
#lineft{
	border:1px solid #00c300;
	margin:1em auto;
	width:90vw;
	padding:1em;
	text-align:center;
}
#lineft h2{
	color:#00c300;
	margin:0 0 0.2em;
	padding:0;
}
#lineft p{
	margin:0 0 0.5em;
	padding:0;
		text-align:center;
}
@media all and (min-width:1024px){
#lineft{
	display:none;
}
}

/* +++ news +++ */
#news{
	width:90vw;
	margin:3em auto;
}
.newslist{
	border-bottom:1px solid #cccccc;
	margin: 0 auto 1em;
	padding-bottom:0.3em;
}
#news h3{
	margin:0;
}
.newslist h3 span{
	color:#666666;
	padding-right:0.5em;
}
.encont{
	border:1px solid var(--main-purple);
	color:var(--main-purple);
	padding:0 0.3em;
}
#infomore{
	text-align:right;
	margin:0 2em 1em;
}
#infomore a{
	border:1px solid #cccccc;
	padding:0.2em 0.5em;
}

@media all and (min-width:1024px) {
#news{
	width:1000px;
	margin:0 auto 3em;
	padding:1em;
}
.newslist{
	width:auto;
	border-bottom:1px solid #cccccc;
	margin: 0 auto 1em;
	padding-bottom:0.3em;
}
}

/* +++ abuut dear +++ */
#top-au{
	width:90vw;
	margin:0 auto 3em;
}

@media all and (min-width:1024px) {
#top-au{
	width:1000px;
	margin:0 auto 3em;
}
#top01{
	width:1000px;
	margin:auto;
}
}

/* +++ Recommended +++ */
#top02,#top03{
	margin:3em 0;
}
#top02 p,#top03 p{
	text-align:center;
	margin: 0 0 2em;
	padding:0;
}


/* +++ access +++ */
#access{
	width: 100vw;
	margin:0 auto;
	padding:1em 0 0;
}
#access p{
	text-align:center;
	margin:0 auto 1em;
	padding:0 1em;
}
#access p{
	text-align:center;
}
#accessmap{
	width:100vw;
	height:500px;
	/* margin-top:2em; */
	margin: 0;
	padding: 0;
}
#access p a{
	font-size:1.1em;
	font-weight:bold;
	color:#ff0000;
}

@media all and (min-width:1280px) {
   /* base1200 */
#access{
	padding:0;
}
#accessmap{
	border:1px solid #f4deac;
}
}

/* +++ top banner +++ */
#banner{
	width:90vw;
	 margin:0.5em auto 2em;
}
#banner img{
	width:90vw;
}
@media all and (min-width:1024px) {
#banner{
	width:800px;
}
#banner img{
	width:800px;
}
}
@media all and (min-width:1280px) {
#banner{
	width:1000px;
}
#banner img{
	width:1000px;
}
}