@charset "utf-8";
/*--------------------------------------
	copyright : yuyu design.
--------------------------------------*/

@import url(reset.css);
@import url(common.css);
@import url(../libs/aos/aos.css);
/* @import url(../libs/OwlCarousel/assets/owl.carousel.min.css); @import url(../libs/OwlCarousel/assets/owl.theme.default.min.css); */
/* @import url(../libs/lightGallery/css/lightgallery.min.css); */
@import url(../libs/Remodal/remodal.css); @import url(../libs/Remodal/remodal-default-theme.css);


/*
company
==============================*/
.btw { text-align: center; margin-top: 6rem; }
.list li { font-weight: 500; }
.img_box-wrap {}
.img_box-wrap.-col2 { align-items: start; }
.img_box-wrap .img_box { position: relative; overflow: hidden; margin-top: 3rem; }
.img_box-wrap.-col2 .img_box { display: flex; flex-direction: column-reverse; }
.img_box-wrap .img_box .img { float: right; width: 50%; max-width: 46.4rem; margin-left: 3rem; border-radius: 1rem; }
.img_box-wrap.-col2 .img_box .img { float: none; width: 100%; max-width: 46.4rem; margin-left: 0; margin-top: 3rem; }
@media screen and (max-width:480px) { /* s */
	.img_box-wrap.-col2 { gap: 0 !important; }
	.img_box-wrap .img_box .img { float: none; width: 100%; margin-left: 0; }
	.img_box-wrap .img_box { display: flex; flex-direction: column-reverse; }
	.img_box-wrap .img_box .img { margin-top: 2rem !important; }
}


/* pageKv ----------*/
#pageKv h1 { position: relative; }
#pageKv h1 .banner_kenko { position: absolute; max-width: 20rem; left: 0; top: calc(100% + 3rem); }
@media screen and (max-width:480px) { /* s */
	#pageKv h1 .banner_kenko { top: calc(100% + 1.5rem); width: 10rem; }
}

/* main ----------*/
#main p { font-weight: 500; }

/* vi ----------*/
#vi {}
#vi .logo { text-align: center; padding: 8rem 4rem; }
#vi .logo img { max-width: 25rem; }
#vi h3 { text-align: center; font-size: 3rem; color: #04684A; margin-bottom: 3rem; }
#vi h3 span { display: block; text-align: center; font-size: 1.4rem; color: #584343; }
#vi .list li { font-size: 1.8rem; }
@media screen and (max-width:480px) { /* s */
	#vi .logo { text-align: center; padding: 4rem }
	#vi .logo img { max-width: 60%; }
}

/* message ----------*/
#message {}
#message .w { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; }
#message .w .pw img { border-radius: 2rem; }
#message .w .pw .name { display: flex; color: #000; font-size: 1.6rem; align-items: center; justify-content: end; }
#message .w .pw .name strong { font-size: 1.8rem; }
#message .w .tw h3 { margin-bottom: 3rem; font-size: 2.6rem; line-height: 1.6; }
#message .w .tw p { font-weight: 500; }
@media screen and (max-width:896px) { /* m */
	#message .w { grid-template-columns: 1fr; }
	#message .w .pw { max-width: 40rem; margin: auto; }
}

/* map ----------*/
#map {}
#map .map { position: relative; }
#map .map a:hover { opacity: 1; }
#map .zoom { position: absolute; bottom: -7rem; right: 2rem; transition: all 0.3s ease-out; }
#map .zoom:hover { opacity: 0.6; }
#map .map + .list { padding-right: 8rem; }
#map rect { transition: all 0.3s ease-out; }
#map #map_link_03:hover rect { fill: #4291E5; box-shadow: 6px 6px 15px 0 rgba(0, 0, 0, 0.10); }
#map #map_link_04:hover rect,
#map #map_link_05:hover rect { fill: #3D99C4; box-shadow: 6px 6px 15px 0 rgba(0, 0, 0, 0.10); }
#map #map_link_01:hover rect,
#map #map_link_02:hover rect,
#map #map_link_07:hover rect,
#map #map_link_08:hover rect { fill: #2CBD43; box-shadow: 6px 6px 15px 0 rgba(0, 0, 0, 0.10); }
#map #map_link_06:hover rect,
#map #map_link_09:hover rect { fill: #ADCE22; box-shadow: 6px 6px 15px 0 rgba(0, 0, 0, 0.10); }
#map #map_link_10:hover rect { fill: #E3AF12; box-shadow: 6px 6px 15px 0 rgba(0, 0, 0, 0.10); }
#map #map_link_11:hover rect { fill: #A760BE; box-shadow: 6px 6px 15px 0 rgba(0, 0, 0, 0.10); }
@media screen and (max-width:480px) { /* s */
	#map .zoom { bottom: -5rem; right: 0; width: 3rem; }
#map .map + .list { padding-right: 4rem; }
}

/* historys ----------*/
.historys-titles { display: grid; grid-template-columns: 1fr 1fr; gap: 15rem; margin-bottom: 4rem; align-items: end; }
.historys-titles > div:nth-child(1) * { color: #DC822E; border-color: #8AC1A1; }
.historys-titles > div:nth-child(1) span::before, .historys-titles > div:nth-child(1) span::after { background-color: #8AC1A1; }
.historys-titles > div:nth-child(2) { text-align: right; }
.historys-titles > div:nth-child(2) * { color: #5695D4; border-color: #C07576; }
.historys-titles > div:nth-child(2) span::before, .historys-titles > div:nth-child(2) span::after { background-color: #C07576; }
.historys-titles .arrow { display: none; }
.historys { position: relative; }
.historys li { margin-bottom: 1.2rem; }
.historys li .y { position: relative; z-index: 2; display: block; color: #B4A7A7; font-size: 3rem; font-weight: bold; font-family: "Josefin Sans", sans-serif; line-height: 1; text-align: center; width: 100%; padding-bottom: 1rem; }
.historys li .history { line-height: 1.7; position: relative; z-index: 2; }
.historys li .history .ymd { display: block; font-weight: bold; padding-top: 0.5rem; }
.historys li .history p { margin: 0; padding-bottom: 0.7rem; }
.historys li .img { position: relative; z-index: 2; text-align: center; margin-top: 1.2rem; }
.historys::before { content: ""; position: absolute; z-index: 1; width: 0; height: 100%; top: -2rem; left: 50%; border-left: dashed 2px #E7DEDE; }
.historys::after { content: ""; position: absolute; z-index: 1; width: 1rem;aspect-ratio: 1; top: -2rem; left: calc(50% - 0.5rem); background-color:  #E7DEDE; border-radius: 100%; }
.historys.-old li:nth-child(1)::after { content: ""; position: absolute; z-index: 1; width: 1rem; aspect-ratio: 1; bottom: 2rem; left: calc(50% - 0.5rem); background-color:  #E7DEDE; border-radius: 100%; }
.historys.-old .y { position: absolute; left: 50%; transform: translateX(-50%); }
.historys.-old li { width: calc((100% - 15rem) / 2); }
.historys.-old li.-h0 { height: 0; margin-bottom: 0; }
.historys.-old .history1 {}
.historys.-old .history1 .history { padding-left: 3rem; padding-right: 1.5rem; border-radius: 2rem 0 0 2rem; background-color: #F8E5D4; }
.historys.-old .history2 { margin-left: auto; }
.historys.-old .history2 .history { padding-left: 1.5rem; padding-right: 3rem; border-radius: 0 2rem 2rem 0; background-color: #E3EBF7; }
.historys.-old .history_all { width: 100%; padding-top: 4rem; }
.historys.-old .history_all .y { margin-top: -4rem; }
.historys.-old .history_all .history { border-radius: 2rem; background-color: #E9E9E9; text-align: center; }
.historys.-old .history_all .history p { text-align: center; }
.historys.-new { max-width: 80rem; margin: auto; margin-top: 9rem; }
.historys.-new li { padding-bottom: 4rem; margin-bottom: 0; }
.historys.-new li .y { color: #04684A; }
.historys.-new .history { border-radius: 2rem; background-color: #DBECE3; text-align: center; }
.historys.-new .history p { text-align: center; }
.historys-association { display: flex; flex-flow: wrap; margin-top: 6rem; justify-content: center; row-gap: 0.5rem; column-gap: 6rem; }
@media screen and (max-width:480px) { /* s */
	.historys-titles { gap: 0.5rem; margin-left: -2rem; margin-right: -2rem; }
	.historys-titles .h2 { display: flex; align-items: center; flex-direction: column; gap: 1rem; font-size: 1.8rem; text-align: center; padding: 1rem 0; border-radius: 1rem; box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.15); }
	.historys-titles .h2 span { border: none; color: #FFF; }
	.historys-titles .h2 span::before,
	.historys-titles .h2 span::after { display: none; }
	.historys-titles .h2 strong { display: block; color: #FFF; }
	.historys-titles > div:nth-child(1) .h2 { background-color: rgba(220, 130, 46, 0.60); }
	.historys-titles > div:nth-child(2) .h2 { background-color: rgba(124, 171, 237, 0.71); }
	.historys-titles .arrow { display: block; width: 1.8rem; aspect-ratio: 17 / 12; fill: #FFF; }
	.historys::before, .historys::after, .historys.-old li:nth-child(1)::after { display: none; }
	.historys.-old li { width: 100%; }
	.historys.-old .y { position: relative; text-align: left; padding-top: 1rem; padding-left: 1.5rem; }
	.historys.-old .history1 .history { padding-left: 4.5rem; border-radius: 0 1rem 1rem 0; margin-left: -3rem; }
	.historys.-old .history2 .history { border-radius: 1rem 0 0 1rem; margin-right: -3rem; }
	.historys.-old li.-h0 { height: auto; margin-bottom: 1.2rem; }
	.historys.-old .history_all .history { border-radius: 1rem; text-align: left; padding: 0 1.5rem; }
	.historys.-old .history_all .history p { text-align: left; }
	.historys.-new { margin-top: 6rem; }
	.historys.-new li { padding-bottom: 2rem; }
	.historys.-new li .y { text-align: left; padding-left: 1.5rem; }
	.historys.-new .history { border-radius: 1rem; background-color: #DBECE3; text-align: left; padding: 0 1.5rem; }
	.historys.-new .history p { text-align: left; }
	.historys-association { margin-top: 2rem; }
}

/* access_list ----------*/
.access_list { display: flex; flex-direction: column; margin-top: 12rem; gap: 5rem; }
.access_list > li { display: grid; grid-template-columns: 1fr 60%; gap: 3rem; }
.access_list > li .access_list-text {}
.access_list > li .access_list-text .h2 { font-size: 2.4rem; margin-bottom: 1em; }
.access_list > li.hokkaido .access_list-text .h2 * { color: #4291E5; border-color: #7EB4FF; }
.access_list > li.hokkaido .access_list-text .h2 *::before,
.access_list > li.hokkaido .access_list-text .h2 *::after { background-color: #7EB4FF; }
.access_list > li.touhoku .access_list-text .h2 * { color: #3D99C4; border-color: #92CAE5; }
.access_list > li.touhoku .access_list-text .h2 *::before,
.access_list > li.touhoku .access_list-text .h2 *::after { background-color: #92CAE5; }
.access_list > li.kanto .access_list-text .h2 * { color: #2CBD43; border-color: #6ED17E;  }
.access_list > li.kanto .access_list-text .h2 *::before,
.access_list > li.kanto .access_list-text .h2 *::after { background-color: #6ED17E; }
.access_list > li.chubu .access_list-text .h2 * { color: #ADCE22; border-color: #CCE566; }
.access_list > li.chubu .access_list-text .h2 *::before,
.access_list > li.chubu .access_list-text .h2 *::after { background-color: #CCE566; }
.access_list > li.kinki .access_list-text .h2 * { color: #E3AF12; border-color: #F6D83F; }
.access_list > li.kinki .access_list-text .h2 *::before,
.access_list > li.kinki .access_list-text .h2 *::after { background-color: #F6D83F; }
.access_list > li.kyusyu .access_list-text .h2 * { color: #A760BE; border-color: #C5A4CF; }
.access_list > li.kyusyu .access_list-text .h2 *::before,
.access_list > li.kyusyu .access_list-text .h2 *::after { background-color: #C5A4CF; }
.access_list > li .access_list-text p { font-size: 1.6rem; color: #000; }
.access_list > li .access_list-text ul { display: flex; flex-flow: wrap; gap: 1.6rem; margin-top: 2rem; }
.access_list > li .access_list-text ul li img { width: 8.5rem; aspect-ratio: 1; }
.access_list > li .access_list-map { text-align: right; }
.access_list > li .access_list-map iframe { width: 100% !important; }
.access_list > li .access_list-map a { margin-top: 1rem; display: inline-flex; color: #584343; font-size: 1.5rem; font-weight: 500; text-decoration: none; align-items: center; gap: 1.5rem; }
.access_list > li .access_list-map a .arrow { width: 2rem; aspect-ratio: 1; fill: #990003; }
@media screen and (max-width:1024px) { /* l */
	.access_list > li .access_list-text ul { gap: 1rem; }
	.access_list > li .access_list-text ul li img { width: 6rem; }
}
@media screen and (max-width:896px) { /* m */
	.access_list { margin-top: 6rem; }
	.access_list > li { grid-template-columns: 1fr; }
	.access_list > li .access_list-map iframe { height: 30rem; }
}


/* csr ----------*/
.csr-cap-wrap { padding-bottom: 0 !important; }
.csr-cap { position: relative; z-index: 10; max-width: 49rem; margin-left: 3rem; margin-top: -20rem !important; }
.csr-pgs { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 3.4rem; margin-top: 4rem; }
.csr-pgs img { border-radius: 2rem; }
.csr-texts a { color: #4291E5; }
@media screen and (max-width:896px) { /* m */
	.csr-cap-wrap { padding-bottom: 4rem !important; }
	.csr-cap { margin-left: 0; margin-top: 0 !important; }
	.csr-pgs { gap: 2rem; margin-top: 3rem; }
}
@media screen and (max-width:480px) { /* s */
	.csr-pgs { grid-template-columns: 1fr 1fr; gap: 1.4rem; margin-top: 2rem; }
	.csr-pgs img { border-radius: 1.5rem; }
}