@charset "UTF-8";

#mv { position: relative; }
#mv .mvImg { width: 100%; height: 100vh; }

@media screen and (max-width: 1079px) {	
	.headline-news { position: absolute; bottom:0px; left: 0; right: 0; width: 100%; z-index: 10; }
	dl.headline-news-dl { background: #fff; display: flex; justify-content: flex-start; height: 30px; line-height: 30px; }
	dl.headline-news-dl dt { width: 100px; background: #217440; color: #fff; text-align: center; font-size: 0.7rem;}
	dl.headline-news-dl dd { color: #000; width: 100%; padding: 0 2%; font-size: 0.7rem;}
	dl.headline-news-dl dd .roboto { margin-right: 10px;}
	dl.headline-news-dl dd a         { resize: none; }
	dl.headline-news-dl dd a:link    { color:#333333; text-decoration: none; }
	dl.headline-news-dl dd a:visited { color:#333333; text-decoration: none; }
	dl.headline-news-dl dd a:hover   { color:#007440; text-decoration: underline; }
	dl.headline-news-dl dd a:active  { color:#333333; text-decoration: none; }
	
	section#anch01,section.top-news { margin: 0%; padding: 6%; }
	section#anch02 { padding: 6%; }
	.top-ttl01 { font-size: 1.2rem; text-align: center; margin-bottom: 0px; color: #1aafa8; line-height: 1.5; }
	.top-subTtl01 { text-align: center; color: #dedede; margin-bottom: 20px; font-size: 0.7rem; }
		
	.top-flexThird .ovry { background: rgba(26,175,168,0.8); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
	.top-flexThird .in-flex-copy { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 2; width: 90%; margin: 0 auto; }
	.top-flexThird .in-flex-copy h3 { font-size: 1.3rem; color: #fff; margin-bottom: 10px; font-weight: normal; }
	.top-flexThird .in-flex-copy h4 { font-size: 0.6rem; color: #fff; margin-bottom: 10px; font-weight: normal; }
	.top-flexThird .in-flex-copy h6 { font-size: 0.7rem; color: #fff; opacity: 0.5; }
	.top-flexThird .in-flex-copy .icon { width: 50px; margin: 0 auto 20px; }
	.top-flexThird li:nth-child(1) .in-flex-copy .icon { width: 40px; margin: 0 auto 20px; }
	.top-flexThird li:nth-child(3) .in-flex-copy .icon { width: 30px; margin: 0 auto 20px; }
	.top-flexThird li.g_box:hover { cursor:pointer; opacity:1.0; }
	.top-flexThird li.g_box:hover .ovry { background: rgba(26,175,168,0.0); }
	
	.top-flexThird li { overflow: hidden; }
	.top-flexThird li .hover-img img { transition:1s all; }
	.top-flexThird li:hover .hover-img img { transform:scale(1.1,1.1); transition:1s all; }
	
	.tabs { border-bottom: 1px solid #000; display: flex; justify-content: center; margin: 40px auto; max-width: 960px; width: 100%; }
	.tabs li { height: 35px; line-height: 35px; width: 100px; text-align: center; border-top: 1px solid #000; border-right: 1px solid #000; border-left: 1px solid #000; margin: 0 5px; font-size: 0.9rem; position: relative;}
	.tabs li.selected { background: #000; }
	.tabs li.selected:after { position: absolute; bottom: -1px; left: 0; content: ""; width: 100px; height: 1px; background: #000; z-index: 1; }
	.tabs li a { display: block; }
	.tabs li a:link    { color:#000; text-decoration: none; }
	.tabs li a:visited { color:#000; text-decoration: none; }
	.tabs li a:hover   { color:#fff; text-decoration: none; background: #000; }
	.tabs li a:active  { color:#000; text-decoration: none; }
	
	.tabs li.selected a:link    { color:#fff; text-decoration: none; }
	.tabs li.selected a:visited { color:#fff; text-decoration: none; }
	.tabs li.selected a:hover   { color:#fff; text-decoration: none; opacity: 0.7; }
	.tabs li.selected a:active  { color:#fff; text-decoration: none; }
	
	.top-works { background: #f4f4f4; padding: 40px 0; }
	
	.newsList { max-width: 1020px; width: 100%; margin: 0 auto 40px; }
	.newsList li { display: flex; justify-content: flex-start; align-items: center; }
	.newsList li .newsDl { margin-right: 10px; }
	
	#anch01 { background: url("../img/common/index-anch01-bg.jpg") center center no-repeat; background-size: cover; position: relative; min-height: 300px; }
	#anch01 .ovry { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(26,175,168,0.75); z-index: 1;}
	#anch01 .in { position: relative; z-index: 2; padding: 10vh 0; }
	#anch01 .in .top-ttl01 { color: #fff; }
	#anch01 .in p { color: #fff; }
}
@media screen and (max-width: 599px) {	
	.top-flexThird li { width: 80%; margin: 0px auto 10px;; }

	#anch03 .arrow-button.mb40.alR { text-align: left; }
	.top-works { padding: 20px 0; }
	.tabs { margin: 10px auto 30px; }
	.tabs li { height: 30px; line-height: 30px; font-size: 0.8rem; }
	.worksSwiper { margin-bottom: 20px;}
	
	.newsList { }
	.newsList li { display: block; }
	.newsList li .newsDl { margin-bottom: 10px; }
	
	.facSec ul { display: block; }
	.facSec ul li { width: 100%; position: relative; height: 200px;  }
	.facSec ul li .in-faqsec { width: 80%; }
	.facSec ul li p { text-align: center; font-size: 0.8rem; }
}
@media screen and (min-width: 600px) and (max-width: 899px)  {
	/*section#anch01,section.top-news { margin: 4%; }*/
	.headline-news { position: absolute; bottom:0px; left: 0; right: 0; max-width: 500px; width: 100%; z-index: 10; }
	.flexThird.top-flexThird { justify-content: center; }
	.flexThird.top-flexThird li { margin: 0 2%; }
}
@media screen and (min-width: 900px) and (max-width: 1079px)  {
	.headline-news { position: absolute; bottom:0px; left: 0; max-width: 600px; width: 100%; z-index: 10; }
	.flexThird.top-flexThird { justify-content: center; }
	.flexThird.top-flexThird li { margin: 0 2%; }
}
@media screen and (min-width: 1080px) {	
	.headline-news { position: absolute; bottom:-1px; left: 0; max-width: 900px; width: 100%; z-index: 10; }
	dl.headline-news-dl { background: #fff; display: flex; justify-content: flex-start; height: 30px; line-height: 30px; }
	dl.headline-news-dl dt { width: 100px; background: #217440; color: #fff; text-align: center; font-size: 0.9rem;}
	dl.headline-news-dl dd { color: #000; width: 100%; padding: 0 2%; font-size: 0.8rem;}
	dl.headline-news-dl dd .roboto { margin-right: 10px;}
	dl.headline-news-dl dd a         { resize: none; }
	dl.headline-news-dl dd a:link    { color:#333333; text-decoration: none; }
	dl.headline-news-dl dd a:visited { color:#333333; text-decoration: none; }
	dl.headline-news-dl dd a:hover   { color:#007440; text-decoration: underline; }
	dl.headline-news-dl dd a:active  { color:#333333; text-decoration: none; }
	
	.top-ttl01 { font-size: 2.0rem; text-align: center; margin-bottom: 0px; color: #1aafa8; line-height: 1.5; }
	.top-subTtl01 { text-align: center; color: #dedede; margin-bottom: 20px; font-size: 0.8rem; }
	
	.flex-ul-li { display: flex; justify-content: flex-start; flex-wrap: wrap; }
	.flex-ul-li li { width: 22.0%; margin-right: 4%; margin-bottom: 0px; }
	.flex-ul-li li:last-child { margin-right: 0%; }
	.flex-ul-li li div { margin-bottom: 10px; }
	.flex-ul-li li p { text-align: center; font-size: 0.9rem; }
	
	.top-flexThird { max-width: 1260px; width: 96%; margin: 0 auto; }
	.top-flexThird li { width: 40%; margin-bottom: 0px; }
	.top-flexThird li div { margin-bottom: 0px; }
	.top-flexThird .ovry { background: rgba(26,175,168,0.8); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
	.top-flexThird .in-flex-copy { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 2; width: 90%; margin: 0 auto; }
	.top-flexThird .in-flex-copy h3 { font-size: 1.8rem; color: #fff; margin-bottom: 10px; font-weight: normal; }
	.top-flexThird .in-flex-copy h4 { font-size: 1.0rem; color: #fff; margin-bottom: 10px; font-weight: normal; }
	.top-flexThird .in-flex-copy h6 { font-size: 0.8rem; color: #fff; margin-bottom: 0px; opacity: 0.5; }
	.top-flexThird .in-flex-copy .icon { width: 60px; margin: 0 auto 20px; }
	.top-flexThird li:nth-child(1) .in-flex-copy .icon { width: 80px; margin: 0 auto 20px; }
	.top-flexThird li:nth-child(3) .in-flex-copy .icon { width: 50px; margin: 0 auto 20px; }
	.top-flexThird li.g_box:hover { cursor:pointer; opacity:1.0; }
	.top-flexThird li.g_box:hover .ovry { background: rgba(26,175,168,0.0); }
	
	.top-flexThird li { overflow: hidden; }
	.top-flexThird li .hover-img img { transition:1s all; }
	.top-flexThird li:hover .hover-img img { transform:scale(1.1,1.1); transition:1s all; }
	
	.tabs { border-bottom: 1px solid #000; display: flex; justify-content: center; margin: 40px auto; max-width: 960px; width: 100%; }
	.tabs li { height: 35px; line-height: 35px; width: 100px; text-align: center; border-top: 1px solid #000; border-right: 1px solid #000; border-left: 1px solid #000; margin: 0 5px; font-size: 0.9rem; position: relative;}
	.tabs li.selected { background: #000; }
	.tabs li.selected:after { position: absolute; bottom: -1px; left: 0; content: ""; width: 100px; height: 1px; background: #000; z-index: 1; }
	.tabs li a { display: block; }
	.tabs li a:link    { color:#000; text-decoration: none; }
	.tabs li a:visited { color:#000; text-decoration: none; }
	.tabs li a:hover   { color:#fff; text-decoration: none; background: #000; }
	.tabs li a:active  { color:#000; text-decoration: none; }
	
	.tabs li.selected a:link    { color:#fff; text-decoration: none; }
	.tabs li.selected a:visited { color:#fff; text-decoration: none; }
	.tabs li.selected a:hover   { color:#fff; text-decoration: none; opacity: 0.7; }
	.tabs li.selected a:active  { color:#fff; text-decoration: none; }
	
	.top-works { background: #f4f4f4; padding: 40px 0; }
	
	.newsList { max-width: 1020px; width: 100%; margin: 0 auto 40px; }
	.newsList li { display: flex; justify-content: flex-start; align-items: center; }
	.newsList li .newsDl { margin-right: 10px; }
	
	#anch01 { background: url("../img/common/index-anch01-bg.jpg") center center no-repeat; background-size: cover; position: relative; min-height: 300px; }
	#anch01 .ovry { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(26,175,168,0.75); z-index: 1;}
	#anch01 .in { position: relative; z-index: 2; padding: 10vh 0; }
	#anch01 .in .top-ttl01 { color: #fff; }
	#anch01 .in p { color: #fff; }
	
	.flexThird.top-flexThird { justify-content: center; }
	.flexThird.top-flexThird li { margin: 0 2%; }
	
	#anch02 { padding: 5vh 0; background: url("../img/common/top-sec02-bg.png") center center no-repeat; background-size:cover; }
}
@media screen and (min-width: 600px) and (max-width: 899px)  {
}
@media screen and (min-width: 900px) and (max-width: 1079px)  {
}
@media screen and (min-width: 1080px) and (max-width: 1179px)  {
}
@media screen and (min-width: 1180px) and (max-width: 1279px)  {
}
@media screen and (min-width: 1280px) and (max-width: 1379px)  {
}
@media screen and (min-width: 1380px) {
}

.worksSwiper .swiper-button-prev:after { content: 'prev'; color: rgba(155,155,155,0.9); border-radius: 25px; font-size: 1rem; }
.worksSwiper .swiper-button-next:after { content: 'next'; color: rgba(155,155,155,0.9); border-radius: 25px; font-size: 1rem; }
.worksSwiper .swiper-button-prev,.worksSwiper .swiper-button-next { width: 50px; height: 50px; border-radius: 25px; background: rgba(187,187,187,0.5); }
@media screen and (max-width: 599px) {	
	.worksSwiper .swiper-button-prev,.worksSwiper .swiper-button-next { width: 30px; height: 30px; border-radius: 15px; }
	.worksSwiper .swiper-button-prev:after,.worksSwiper .swiper-button-next:after { font-size: 0.7rem; }	
	.worksSwiper .swiper-button-prev { left: -10px;}
	.worksSwiper .swiper-button-next { right: -10px;}
	.worksSwiper { position: relative; margin-bottom: 20px; }
	.worksSwiper .swiper div { margin-bottom: 10px;}
	.worksSwiper .swiper p { font-size: 0.9rem; margin-bottom: 0px;}
	.worksSwiper .swiper h4 { font-weight: bold; margin-bottom: 10px; font-size: 0.9rem;}
}
@media screen and (min-width: 600px) and (max-width: 899px) {	
	.worksSwiper .swiper-button-prev,.worksSwiper .swiper-button-next { width: 30px; height: 30px; border-radius: 15px; }
	.worksSwiper .swiper-button-prev:after,.worksSwiper .swiper-button-next:after { font-size: 0.7rem; }	
	.worksSwiper .swiper-button-prev { left: 25px;}
	.worksSwiper .swiper-button-next { right: 25px;}
	.worksSwiper { position: relative; margin-bottom: 40px; }
	.worksSwiper .swiper div { margin-bottom: 10px;}
	.worksSwiper .swiper p { font-size: 0.9rem; margin-bottom: 0px;}
	.worksSwiper .swiper h4 { font-weight: bold; margin-bottom: 10px; font-size: 0.9rem;}
}
@media screen and (min-width: 900px) {
	.worksSwiper .swiper-button-prev { left: 22.5px;}
	.worksSwiper .swiper-button-next { right: 22.5px;}
	
	.top-works { padding: 40px 0; }
	.worksSwiper { position: relative; margin-bottom: 40px; }
	.worksSwiper .swiper div { margin-bottom: 10px;}
	.worksSwiper .swiper p { font-size: 0.9rem; margin-bottom: 0px;}
	.worksSwiper .swiper h4 { font-weight: bold; margin-bottom: 10px; font-size: 0.9rem;}
}
@media screen and (min-width: 900px) and (max-width: 1079px) {	
	.workSwiper .swiper-button-prev,.workSwiper .swiper-button-next { width: 45px; height: 45px; border-radius: 22.5px;}
	.workSwiper .swiper-button-prev{ left: 22.5px;}
	.workSwiper .swiper-button-next { right: 22.5px;}
}
@media screen and (min-width: 1080px) and (max-width: 1199px) {	
	.worksSwiper .swiper-button-prev,.worksSwiper .swiper-button-next { width: 45px; height: 45px; border-radius: 22.5px;}
	.worksSwiper .swiper-button-prev { left: 22.5px;}
	.worksSwiper .swiper-button-next { right: 22.5px;}
}
@media screen and (min-width: 1200px) {	
	.worksSwiper .swiper-button-prev { left: 20px;}
	.worksSwiper .swiper-button-next { right: 20px;}
}

.worksSwiper02 .swiper-button-prev:after { content: 'prev'; color: rgba(155,155,155,0.9); border-radius: 25px; font-size: 1rem; }
.worksSwiper02 .swiper-button-next:after { content: 'next'; color: rgba(155,155,155,0.9); border-radius: 25px; font-size: 1rem; }
.worksSwiper02 .swiper-button-prev,.worksSwiper .swiper-button-next { width: 50px; height: 50px; border-radius: 25px; background: rgba(187,187,187,0.5); }
@media screen and (max-width: 599px) {	
	.worksSwiper02 .swiper-button-prev,.worksSwiper02 .swiper-button-next { width: 30px; height: 30px; border-radius: 15px; }
	.worksSwiper02 .swiper-button-prev:after,.worksSwiper02 .swiper-button-next:after { font-size: 0.7rem; }	
	.worksSwiper02 .swiper-button-prev { left: -10px;}
	.worksSwiper02 .swiper-button-next { right: -10px;}
	.worksSwiper02 { position: relative; margin-bottom: 40px; }
	.worksSwiper02 .swiper div { margin-bottom: 10px;}
	.worksSwiper02 .swiper p { font-size: 0.9rem; margin-bottom: 0px;}
	.worksSwiper02 .swiper h4 { font-weight: bold; margin-bottom: 10px; font-size: 0.9rem;}
}
@media screen and (min-width: 600px) and (max-width: 899px) {	
	.worksSwiper02 .swiper-button-prev,.worksSwiper02 .swiper-button-next { width: 30px; height: 30px; border-radius: 15px; }
	.worksSwiper02 .swiper-button-prev:after,.worksSwiper02 .swiper-button-next:after { font-size: 0.7rem; }	
	.worksSwiper02 .swiper-button-prev { left: 25px;}
	.worksSwiper02 .swiper-button-next { right: 25px;}
	.worksSwiper02 { position: relative; margin-bottom: 40px; }
	.worksSwiper02 .swiper div { margin-bottom: 10px;}
	.worksSwiper02 .swiper p { font-size: 0.9rem; margin-bottom: 0px;}
	.worksSwiper02 .swiper h4 { font-weight: bold; margin-bottom: 10px; font-size: 0.9rem;}
}
@media screen and (min-width: 900px) {
	.worksSwiper02 .swiper-button-prev { left: 22.5px;}
	.worksSwiper02 .swiper-button-next { right: 22.5px;}
	
	.top-works { padding: 40px 0; }
	.worksSwiper02 { position: relative; margin-bottom: 40px; }
	.worksSwiper02 .swiper div { margin-bottom: 10px;}
	.worksSwiper02 .swiper p { font-size: 0.9rem; margin-bottom: 0px;}
	.worksSwiper02 .swiper h4 { font-weight: bold; margin-bottom: 10px; font-size: 0.9rem;}
}
@media screen and (min-width: 900px) and (max-width: 1079px) {	
	.workSwiper02 .swiper-button-prev,.workSwiper .swiper-button-next { width: 45px; height: 45px; border-radius: 22.5px;}
	.workSwiper02 .swiper-button-prev{ left: 22.5px;}
	.workSwiper02 .swiper-button-next { right: 22.5px;}
}
@media screen and (min-width: 1080px) and (max-width: 1199px) {	
	.worksSwiper02 .swiper-button-prev,.worksSwiper .swiper-button-next { width: 45px; height: 45px; border-radius: 22.5px;}
	.worksSwiper02 .swiper-button-prev { left: 22.5px;}
	.worksSwiper02 .swiper-button-next { right: 22.5px;}
}
@media screen and (min-width: 1200px) {	
	.worksSwiper02 .swiper-button-prev { left: 20px;}
	.worksSwiper02 .swiper-button-next { right: 20px;}
}

.top-concept01 .flexImg { background: url("../img/common/img01.jpg") center center no-repeat; background-size: cover; }
.top-concept02 .flexImg { background: url("../img/common/img02.jpg") center center no-repeat; background-size: cover; }



/* loop */
@keyframes infinity-scroll-left {
from {
  transform: translateX(0);
}
  to {
  transform: translateX(-100%);
}
}
.scroll-infinity__wrap { display: flex; overflow: hidden; margin-bottom: 40px; }
.scroll-infinity__list { display: flex; list-style: none; padding: 0 }
.scroll-infinity__list--left { animation: infinity-scroll-left 80s infinite linear 0.5s both; }
.scroll-infinity__item { width: calc(100vw / 5); position: relative; }
.scroll-infinity__item>img { width: 100%; }
.scroll-infinity__item:after { content: "\f055"; font-family: "Font Awesome 5 Free"; font-weight: 900; position: absolute; bottom: 2%; right: 2%; color: rgba(255,255,255,0.5); }
@media screen and (max-width: 599px) {	
	.scroll-infinity__item { width: calc(100vw / 2); }
}
@media screen and (min-width: 600px) and (max-width: 889px) {	
	.scroll-infinity__item { width: calc(100vw / 3); }
}
@media screen and (min-width: 900px) and (max-width: 1079px) {	
	.scroll-infinity__item { width: calc(100vw / 4); }
}