/* =================================================================== file name  : top.css
=================================================================== */
.con-mainvisual .txt { max-width: 1120px; margin: auto; }
@media only screen and (min-width: 1025px) and (max-width: 1120px) { .con-mainvisual .txt { width: 95%; } }
@media print { .con-mainvisual .txt { width: 95%; } }
.ie8 .con-mainvisual .txt, .con-mainvisual .ie8 .txt { width: 95%; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-mainvisual .txt { width: 92%; } }
@media only screen and (max-width: 767px) { .con-mainvisual .txt { width: 83%; } }

/*Animate */
/* -----------------------------------------------------------
	.con-mainvisual
----------------------------------------------------------- */
.con-mainvisual { position: relative; }
.con-mainvisual:before { content: ""; background: #bf1443; width: 80%; height: 80%; position: absolute; bottom: 0; left: 0; z-index: -1; }
@media only screen and (max-width: 1024px) { .con-mainvisual:before { width: 90%; } }
.con-mainvisual .box-slider { position: relative; z-index: 1; opacity: 0; transition: opacity .5s linear; margin: 0 auto; }
.con-mainvisual .box-slider.slick-initialized { opacity: 1; }
.con-mainvisual .box-slider .slick-dots { text-align: center; margin-top: 30px; }
@media only screen and (max-width: 767px) { .con-mainvisual .box-slider .slick-dots { margin-top: 8px; } }
.con-mainvisual .box-slider .slick-dots li { display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; }
@media only screen and (max-width: 767px) { .con-mainvisual .box-slider .slick-dots li { margin: 0 4px; overflow: hidden; } }
.con-mainvisual .box-slider .slick-dots li.slick-active button { background: white; }
.con-mainvisual .box-slider .slick-dots li button { display: block; width: 10px; background: rgba(255, 255, 255, 0); padding: 8px 0 0; height: 0; overflow: hidden; margin: 0 8px; cursor: pointer; border: 1px solid #fff; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
.con-mainvisual .box-slider .slick-dots li button:focus { outline: none; }
@media only screen and (max-width: 767px) { .con-mainvisual .box-slider .slick-dots li button { margin: 0 4px; } }
.con-mainvisual .box-slider .slide { position: relative; }
.con-mainvisual .box-slider .slide.slick-current .img { overflow: hidden; }
.con-mainvisual .box-slider .slide.slick-current .img img { -webkit-animation-duration: 10s; animation-duration: 10s; -webkit-animation-fill-mode: both; animation-fill-mode: both; transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1); -webkit-animation-name: imgZoom; animation-name: imgZoom; }
.con-mainvisual .box-slider .slide.slick-current h1 .title span { animation: text_anime_on 0.5s ease-out forwards; }
.con-mainvisual .box-slider .slide .img { width: 80%; margin-left: auto; }
@media only screen and (max-width: 767px) { .con-mainvisual .box-slider .slide .img { width: 90%; } }
.con-mainvisual .box-slider .slide .img img { width: 100%; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-mainvisual .box-slider .slide .img { overflow: hidden; }
  .con-mainvisual .box-slider .slide .img img { max-width: none; width: 160%; margin-left: -30%; } }
@media only screen and (max-width: 767px) { .con-mainvisual .box-slider .slide .img { overflow: hidden; }
  .con-mainvisual .box-slider .slide .img img { max-width: none; width: 200%; margin-left: -50%; } }
.con-mainvisual .box-slider .slide h1 { position: absolute; left: 5%; bottom: 30px; color: #fff; font-size: 5rem; line-height: 1.14; letter-spacing: 0.02em; font-family: "Marcellus", serif; }
@media only screen and (max-width: 767px) { .con-mainvisual .box-slider .slide h1 { bottom: 15px; font-size: 2.4rem; } }
.con-mainvisual .box-slider .slide h1 .title { display: block; }
.con-mainvisual .box-slider .slide h1 .title span { opacity: 0; display: inline-block; }
.con-mainvisual .txt { padding: 30px 0; font-size: 1.3rem; letter-spacing: 0.02em; text-align: center; }
@media only screen and (max-width: 767px) { .con-mainvisual .txt { padding: 16px 0; } }

@keyframes text_anime_on { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-webkit-keyframes imgZoom { from { transform: scale(1); }
  to { transform: scale(1.1); } }
@keyframes imgZoom { from { transform: scale(1); }
  to { transform: scale(1.1); } }
/* -----------------------------------------------------------
	.con-information
----------------------------------------------------------- */
.con-information { padding: 48px 0 0; }
@media only screen and (max-width: 767px) { .con-information { padding: 24px 0 0; } }
.con-information .box-information { margin-top: 80px; }
@media only screen and (max-width: 767px) { .con-information .box-information { margin-top: 30px; } }
.con-information .txt-intro { width: 78%; margin: 0 auto; overflow-wrap: break-word; }
@media only screen and (max-width: 767px) { .con-information .txt-intro { width: 90%; } }
.con-information .txt-intro h3 { font-size: 2.5rem; }
@media only screen and (max-width: 767px) { .con-information .txt-intro h3 { font-size: 2rem; } }

/* ---------------------
	 .news-list
------------------------ */
.news-list > li { display: flex; gap: 1em; }
@media only screen and (max-width: 767px) { .news-list > li { flex-direction: column; gap: .5em; } }
.news-list > li + li { margin-top: .5rem; }
@media only screen and (max-width: 767px) { .news-list > li + li { margin-top: 2rem; } }
.news-list .news-list .news-date { flex: 1 0 auto; }
.news-list .news-body { flex: 1 1 auto; word-break: break-all; }
.news-list a { position: relative; display: inline; word-break: break-all; color: #00f; }
.news-list a:hover, .news-list a:active { background-image: linear-gradient(to top, #bf1443 2px, rgba(0, 0, 0, 0) 2px); }
