#pagetitle1 {
	background-image: url("../images/about/mv.jpg");
}
/* --------------------------------------------------- */
#sec01 {
	position: relative;
	text-align: center;
	padding: 5% 0 10%;
}
#sec01 h3 {
	display: inline-block;
	text-align: center;
	font-size: 1.3em;
	font-weight: 400;
	letter-spacing: 6px;
	position: relative;
	padding: 30px 0;
	line-height: 2.4em;
}
#sec01 h3 .br-clear {
	display: none;
}
@media screen and (max-width: 900px) {
	#sec01 h3 {
		font-size: 1.2em;
		padding: 30px 40px;
	}
	#sec01 h3 .br-clear {
		display: inherit;
	}
}
@media screen and (max-width: 580px) {
	#sec01 {
        padding: 5% 0 15%;
    }
	#sec01 h3 {
		font-size: 1em;
		padding: 0;
		line-height: 2em;
		padding-left: 3px;
		letter-spacing: 3px;
	}
	
}
/* --------------------------------------------------- */
#sec02 {
	position: relative;
	text-align: center;
	width: 80%;
	margin: 0 auto 60px;
}
.sliderArea {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 25px;
}
.sliderArea.w300 {
  max-width: 300px;
}
.slick-slide {
  margin: 0 5px;
}
.slick-slide img {
  width: 100%;
  height: auto;
}

.slick-slide {
  transition: all ease-in-out .3s;
  opacity: .2;
}
.slick-active {
  opacity: 1;
}
.slick-current {
  opacity: 1;
}
.thumb {
  margin: 20px 0 0;
}
.thumb .slick-slide {
  cursor: pointer;
}
.thumb .slick-slide:hover {
  opacity: .7;
}
.slick-dots {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}
.slick-dots li {
  margin: 0 0px;
}
.slick-dots li button {
  font-size: 0;
}
.slick-dots li span.dot {
  display: block;
  width: 12px;
  height: 2px;
  background: #ddd;
  transition: background 0.3s;
}
.slick-dots li.slick-active span.dot {
  background: #333;
}

.slick-prev, .slick-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  z-index: 10;
}
.slick-prev {
  left: -40px;
}
.slick-next {
  right: -40px;
}
.slick-prev .material-symbols-outlined,
.slick-next .material-symbols-outlined {
  font-size: 36px;
  color: #333;
  transition: color 0.3s;
}

.slick-prev:hover .material-symbols-outlined,
.slick-next:hover .material-symbols-outlined {
  color: #c00; /* ホバー時の色 */
}
@media screen and (max-width: 580px) {
	.slick-prev {
      left: -30px;
    }
    .slick-next {
      right: -30px;
    }
	.slick-prev .material-symbols-outlined,
    .slick-next .material-symbols-outlined {
      font-size: 26px;
    }
}
/* --------------------------------------------------- */

/* --------------------------------------------------- */


