@charset "UTF-8";
/* ================================================================

制作コンテンツ

info:
- レスポンシブの場合は、ブレイクポイント 768px で記述してください。
- SP用CSSを先に記述する方法を推奨します。下記の記述は例です。
- PCのみの場合は、記述を削除してください。

================================================================ */
/* SP用CSSの記述 */
/* PC、Tablet用CSSの記述 */
/*====================================
basic
====================================*/
img {
  display: block;
}

@media (any-hover: hover) {
  .hover:hover {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -ms-filter: "alpha(opacity=70)";
  }
}

/* headernavi */
#click {
  position: fixed;
  top: 0px;
  right: 0px;
  z-index: 9999;
}

#top {
  position: relative;
  padding-top: 140px;
}

.credit {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  z-index: 2;
  margin: 0;
  padding: 0;
}

.container.headernavi {
  position: absolute;
  top: 50px;
  left: 0;
  right: 0;
  height: 90px;
  z-index: 9999;
  background-color: rgba(255, 255, 255, 0.9);
}

.container.headernavi.active {
  position: fixed;
  top: 0;
}

.inner.headernavi {
  position: relative;
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.btn-01 + .btn-02 {
  margin-left: 36px;
}

/* .btn-01 {
  position: absolute;
  left: 30px;
  top: 15px;
}

.btn-02 {
  position: absolute;
  left: 515px;
  top: 15px;
} */
/* slider */
.container.titlebase {
  position: relative;
  background-color: #dfeaf2;
}

.container.titlebase h1 {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  margin: auto;
  display: flex;
  justify-content: center;
  z-index: 2;
}

.sliderbox {
  width: 100%;
  display: flex;
}

.flexslider1 {
  width: 50%;
  position: relative;
  padding: 0;
  margin: 0;
}

.flexslider1 ul li img {
  margin: 0 0 0 auto;
}

.flexslider2 {
  width: 50%;
  position: relative;
  padding: 0;
  margin: 0;
}

.flexslider1 img {
  width: 600px;
  height: auto;
  vertical-align: bottom;
}

.flexslider2 img {
  width: 600px;
  height: auto;
  vertical-align: bottom;
}

.slides li:not(:first-child) {
  display: none;
}

.inner.titlebase {
  position: relative;
}

main {
  padding-top: 28px;
  overflow: hidden;
}

.block01 {
  max-width: 964px;
  margin: 0 auto;
}

.block01 .images a.link01 {
  left: 286px;
  top: 202px;
}

.block01 .images a.link02 {
  left: 734px;
  top: 381px;
}

.block01 .images img.img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.block02 {
  max-width: 1300px;
  margin: 57px auto 0;
  display: flex;
  justify-content: center;
}

.block02 .images {
  width: 1300px;
  max-width: none;
}

.block02 .images a {
  z-index: 4;
}

.block02 .images a.link01 {
  left: 185px;
  bottom: 78px;
}

.block02 .images a.link01 > div {
  position: relative;
}

.block02 .images a.link01 > div img {
  position: absolute;
  z-index: 2;
}

.block02 .images a.link01 > div img + img {
  position: relative;
  z-index: 1;
}

.block02 .images a.link02 {
  right: 178px;
  bottom: 81px;
}

.block02 .images a.link02 > div {
  position: relative;
}

.block02 .images a.link02 > div img {
  position: absolute;
  z-index: 2;
}

.block02 .images a.link02 > div img + img {
  position: relative;
  z-index: 1;
}

.block02 img.img, .block02 img.txt, .block02 img.bg {
  width: 1300px;
  max-width: none;
}

.block02 img.txt {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.block02 img.img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
}

.block02 img.bg {
  position: relative;
  z-index: 1;
}

.block03 {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}

.block03 a.link01 {
  left: 153px;
  top: 128px;
}

.block03 a.link02 {
  left: 348px;
  top: 128px;
}

.block03 a.link03 {
  left: 662px;
  top: 27px;
}

.block03 a.link04 {
  left: 600px;
  top: 185px;
}

.block03 a.link05 {
  left: 824px;
  top: 181px;
}

.block03 .images {
  width: 1100px;
  max-width: none;
}

.block03 .images img.img, .block03 .images img.txt {
  width: 1100px;
  max-width: none;
}

.block03 .images img.img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.block04 {
  max-width: 1372px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
}

.block04 .images {
  width: 1372px;
  max-width: none;
}

.block04 .images img.img, .block04 .images img.txt, .block04 .images img.bg {
  width: 1372px;
  max-width: none;
}

.block04 .images img.txt {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
}

.block04 .images img.img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.block04 .images img.bg {
  position: relative;
  z-index: 1;
}

.block04 .images a {
  z-index: 4;
}

.block04 .images a.link01 {
  left: 408px;
  top: 474px;
}

.block04 .images a.link02 {
  right: 234px;
  top: 457px;
}

.block04 .images a.link03 {
  left: 533px;
  top: 626px;
}

.block04 .images a.link04 {
  left: 532px;
  top: 780px;
}

.block04 .images a.link05 {
  right: 387px;
  top: 778px;
}

.block04 .images a.link06 {
  right: 301px;
  top: 935px;
}

.block04 .images a.link07 {
  left: 463px;
  top: 1040px;
}

.block05 {
  max-width: 1200px;
  margin: -30px auto 0;
}

.block05 .images {
  width: 1200px;
  max-width: none;
}

.block05 .images a.link01 {
  left: 131px;
  top: 148px;
}

.block05 .images a.link02 {
  left: 456px;
  top: 149px;
}

.block05 .images a.link03 {
  left: 800px;
  top: 149px;
}

.block05 .images img {
  width: 100%;
}

.block05 .images img.img, .block05 .images img.txt {
  width: 1200px;
  max-width: none;
}

.block05 .images img.img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.images {
  position: relative;
}

.images a {
  position: absolute;
  z-index: 3;
}

.images .img,
.images .txt {
  width: 100%;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: scale(0.85);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.flow_images {
  overflow: hidden;
  margin: -48px 0 11px;
  position: relative;
  z-index: 3;
}

.flow_images .images {
  animation: image-slide 50s linear infinite;
  display: flex;
  min-width: 100%;
  width: min-content;
  position: relative;
}

.flow_images .images .img {
  width: 2340px;
  max-width: inherit;
  z-index: 1;
}

@keyframes image-slide {
  100% {
    transform: translateX(-50%);
  }
}

.btn_area {
  z-index: 2;
  position: relative;
  max-width: 906px;
  margin: 0 auto 65px;
  padding-top: 0;
}

.btn_area a {
  position: absolute;
}

.btn_area a.btn01 {
  left: 0;
  top: 0;
}

.btn_area a.btn02 {
  left: 8px;
  top: 164px;
}

.btn_area a.btn03 {
  left: 312px;
  top: 164px;
}

.btn_area a.btn04 {
  right: 3px;
  top: 164px;
}

.btn_area a.btn05 {
  left: 8px;
  top: 314px;
}

.btn_area a.btn06 {
  left: 312px;
  top: 314px;
}

.btn_area a.btn07 {
  right: 4px;
  top: 314px;
}

.pagetop {
  position: fixed;
  bottom: 40px;
  right: -80px;
  z-index: 9999;
  width: 80px;
  height: 80px;
  cursor: pointer;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.pagetop.active {
  right: 0;
}

.globalFooter-lead {
  display: flex;
  justify-content: center;
  margin-bottom: 25px;
}
