.mv{ position: relative; }
.mv .mask{ width: 100%; height: 100%; background: url(../images/index/mv-mask01.png) no-repeat; background-size: cover; position: absolute; top: 0; left: 0; z-index: 10; }
.mv .main-slide img{ width: 100%; }
.mv .main-slide img.sp{ display: none; }
.mv p, .mv h1{ font-size: 3.83vw; font-weight: 700; color: #fff; position: absolute; left: 11.42vw; top: 16.67vw; z-index: 11; }
.mv p span{ font-size: 2.08vw; font-weight: 400; display: block; line-height: 2.8; }
.mv h1{left: 11.42vw; top: 42.67vw; font-size: 2.08vw;}

.news{ margin-top: 36px; margin-bottom: 46px; border: solid 1px; border-radius: 8px; display: flex; align-items: center; }
.news .ttl{ width: 200px; height: 113px; display: flex; align-items: center; justify-content: center; }
.news h2{ color: #f0a252; text-align: center; line-height: 1.4; }
.news h2 span{ font-size: 24px; display: block; text-align: center; }
.news ul{ width: calc(100% - 200px); padding-right: 40px; }
.news ul li{ line-height: 2.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.news ul li .time{ margin-right: 1.2em; }
.news ul li a{ text-decoration: underline; }
h2.general{ font-size: 16px; text-align: center; }
h2.general span{ font-size: 36px; display: block; text-align: center; line-height: 1.4; position: relative; margin-bottom: 6px; }
h2.general span:after{ content: ''; width: 150px; height: 1px; background: #32325a; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
h2 span.josef{ letter-spacing: .11em; }

.info{ padding-bottom: 70px; }
.info .flex{ margin-top: 35px; }
.info .flex .left{ width: 376px; }
.info .flex .left p.address{ margin: 1em 0; padding-top: 1em; border-top: solid 1px #eaeaee; }
.info .flex .right{ width: 377px; }
.info .flex .right a.btn{ margin: 15px 0 0 auto; }

.concept{ display: flex; align-items: center; padding: 50px 0 60px; position: relative; z-index: 10; }
.concept:before{ content: ''; width: calc(50vw + 400px); height: 100%; background: url(../images/index/bg-concept01.png) #fdf6ee no-repeat; background-size: 396px; background-position: bottom right; position: absolute; top: 0; left: 0; z-index: -1; border-radius: 8px 0 0 8px; }
.concept .ttl{ width: 327px; display: flex; justify-content: center; align-items: center; }
.concept h2{ font-size: 16px; color: #f0a252; }
.concept h2 span{ font-size: 36px; display: block; line-height: 1.4; position: relative; margin-bottom: 6px; }
.concept h2 span:after{ content: ''; width: 150px; height: 1px; background: #f0a252; position: absolute; bottom: 0; left: 0; }
.concept .content{ width: calc(100% - 327px); }
.concept h3{ font-size: 20px; font-weight: 700; color: #f0a252; margin-bottom: .8em; }
.concept p{ color: #f0a252; }
.concept a{ color: #f0a252; margin-top: 20px; }

.img-box01{ height: 410px; background: url(../images/index/bg-img-box01.jpg) no-repeat; background-size: cover; background-position: center; background-attachment: fixed; margin-top: -175px; }
.img-box02{ height: 300px; background: url(../images/index/img-box02.jpg) no-repeat; background-size: cover; background-position: center; background-attachment: fixed; overflow: hidden;  }
.img-box02 .item01.pc{ display: block; width: 468px; }
.img-box03{ height: 340px; background: url(../images/index/img-box03.jpg) no-repeat; background-size: cover; background-position: bottom; background-attachment: fixed; }

.feature{ padding: 65px 0 70px; }
.feature ul{ margin-top: 65px; counter-reset: feature; }
.feature ul li{ position: relative; }
.feature ul li + li{ margin-top: 30px; }
.feature ul li .content{ width: 450px; padding: 36px 50px; position: relative; }
.feature ul li:nth-of-type(1) .content{ background: #b4dede; }
.feature ul li:nth-of-type(2) .content{ background: #84ccde; }
.feature ul li:nth-of-type(3) .content{ background: #a7b1ca; }
.feature ul li:nth-of-type(4) .content{ background: #f6ae96; }
.feature ul li:nth-of-type(5) .content{ background: #f7d0a8; }
.feature ul li:nth-of-type(odd) .content{ border-radius: 0 8px 8px 0; margin-left: auto; }
.feature ul li:nth-of-type(even) .content{ border-radius: 8px 0 0 8px; }
.feature ul li .content:before{ counter-increment: feature; content: counter(feature,decimal-leading-zero); font-size: 38px; font-family: 'Josefin Sans', sans-serif; letter-spacing: .05em; position: absolute; top: -30px; left: 50%; transform: translateX(-50%); }
.feature ul li:nth-of-type(1) .content:before{ color: #82c8c8; }
.feature ul li:nth-of-type(2) .content:before{ color: #32aac8; }
.feature ul li:nth-of-type(3) .content:before{ color: #506496; }
.feature ul li:nth-of-type(4) .content:before{ color: #f07850; }
.feature ul li:nth-of-type(5) .content:before{ color: #f0a252; }
.feature ul li .content h3{ font-size: 24px; font-weight: 700; text-align: center; color: #fff; margin-bottom: .6em; }
.feature ul li .content p{ color: #fff; }
.feature ul li .content a.btn{ color: #fff; margin: 20px auto 0; }
.feature ul li .img{ width: calc(50vw - 50px); height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; position: absolute; top: 0; }
.feature ul li:nth-of-type(1) .img{ background-image: url(../images/index/feature01.jpg); left: calc(-50vw + 400px); }
.feature ul li:nth-of-type(2) .img{ background-image: url(../images/index/feature03.jpg); right: calc(-50vw + 400px); }
.feature ul li:nth-of-type(3) .img{ background-image: url(../images/index/feature02.jpg); left: calc(-50vw + 400px); }
.feature ul li:nth-of-type(4) .img{ background-image: url(../images/index/feature04.jpg); right: calc(-50vw + 400px); }
.feature ul li:nth-of-type(5) .img{ background-image: url(../images/index/feature05.jpg); left: calc(-50vw + 400px); }

.trouble.wrap{ padding-top: 90px; padding-bottom: 100px; width: 900px; }
.trouble h2{ margin-bottom: 55px; }
.trouble a.btn{ margin: 70px auto 0; }

.staff{ background: #fad6ca; padding: 20px 20px 0; }
.staff .inner{ max-width: 1160px; margin: 0 auto; position: relative; z-index: 2; padding: 70px 0 20px; }
.staff .inner:before{ content: ''; width: 100%; height: calc(100% + 50px); background: #fff; border-radius: 8px; position: absolute; top: 0; left: 0; z-index: -1; }
.staff *{ color: #f07850; }
.staff h2{ margin-bottom: 50px; }
.staff h2.general span:after{ background: #f07850; }
.staff .flex .content{ width: 50%; }
.staff .flex .content img{ display: block; width: 100%; margin-bottom: 15px;d }
.staff .flex .content:nth-of-type(1) img{ border-radius: 8px 0 0 8px; }
.staff .flex .content:nth-of-type(2) img{ border-radius: 0 8px 8px 0; }
.staff .flex .content h3{ font-size: 24px; font-weight: 700; text-align: center; color: #f07850; }
.staff .flex .content h3 span{ display: block; text-align: center; font-size: 14px; font-weight: 500; line-height: 1.4; }
.staff h4{ margin: 50px 0 10px; position: relative; z-index: 0; }
.staff h4:before{ content: ''; width: 100%; height: 1px; background: #f07850; position: absolute; top: 50%; left: 0; transform: translateY(-50%); z-index: -1; }
.staff h4 span{ background: #fff; padding-right: 1em; }
.staff h4 strong{ font-size: 22px; margin-right: .6em; }
.staff a.btn{ margin: 55px auto 0; }

.blog{ padding: 60px 0 80px; background: #eaf6f9; overflow: hidden; }
.blog .wrap{ position: relative; z-index: 0; }
.blog .wrap .bg{ display: block; width: 668px; position: absolute; top: -70px; left: -290px; z-index: -1; }
.blog h2{ font-size: 16px; color: #32aac8; margin-bottom: 40px; }
.blog h2 span{ font-size: 36px; display: block; line-height: 1.4; position: relative; margin-bottom: 6px; }
.blog h2 span:after{ content: ''; width: 150px; height: 1px; background: #32aac8; position: absolute; bottom: 0; left: 0; }
.blog-list{ display: flex; justify-content: space-between; flex-wrap: wrap; }
.blog-list li{ width: 390px; min-height: 143px; background: #fff; border-radius: 8px; overflow: hidden; display: flex; justify-content: space-between; position: relative; transition: .3s; }
.blog-list li:hover{ opacity: .7; }
.blog-list li:nth-of-type(n+3){ margin-top: 24px; }
.blog-list li .thumb{ width: 175px; background-repeat: no-repeat; background-size: cover; background-position: center; }
.blog-list li .content{ width: calc(100% - 175px); padding: 20px; }
.blog-list li .content .time{ color: #98d4e3; display: block; }
.blog-list li .content p{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; color: #32aac8; font-weight: 500; }
.blog a.btn{ position: absolute; top: 0; right: 0; color: #32aac8; }

.equipment{ padding-top: 60px; padding-bottom: 70px; }
.equipment ul{ display: flex; justify-content: space-between; margin-top: 40px; }
.equipment ul li{ width: 240px; }
.equipment ul li img{ display: block; width: 100%; border-radius: 8px; margin-bottom: 14px; }
.equipment ul li h3{ font-size: 16px; font-weight: 700; text-align: center; margin-bottom: 10px; }
.equipment a.btn{ margin: 35px auto 0; }

