@charset "utf-8";
/*--------------------------------------
	copyright : yuyu design.
--------------------------------------*/

@import url(normalize.css);
@import url(../_plugin/fontawesome/css/all.min.css);
@import url(../_plugin/aos/aos.css);
@import url(../_plugin/OwlCarousel/assets/owl.carousel.min.css); @import url(../_plugin/OwlCarousel/assets/owl.theme.default.css);
/*@import url(../_plugin/lightGallery/css/lightgallery.min.css);*/
/*@import url(../_plugin/Remodal/remodal.css); @import url(../_plugin/Remodal/remodal-default-theme.css);*/
@import url(common_parts.css);
@import url(common.css);


/*
 index
==============================*/

/* contents-wrap ----------*/
#contents-wrap { padding-top: 4rem; }
.h2 object { -webkit-transform-origin: left bottom; transform-origin: left top;  }
@media screen and (max-width:1024px) { /* iPad 横 l */
	#contents-wrap { padding-top: 9rem; }
}
@media screen and (max-width:720px) {
	.h2 object { -webkit-transform: scale(0.85,0.85); transform: scale(0.85,0.85); }
}
@media screen and (max-width:560px) {
	.h2 object { -webkit-transform: scale(0.75,0.75); transform: scale(0.75,0.75); }
}

/* mv ----------*/
#mv { position: relative; padding-top: 3%; pointer-events: none; }
#mv::after { position: absolute; z-index: 1; bottom: 0; left: 0; content: ""; width: 100%; height: 80%; background-color: #EAE4E4; }
#mv .video_wrap { position: relative; z-index: 2; width: 70vw; transition: clip-path 1s cubic-bezier(0.5, 1, 0.89, 1); aspect-ratio: 16 / 9; clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0 100%); }
#mv.active .video_wrap { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0 100%); }
#mv video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
@media screen and (max-width:1024px) { /* iPad 横 l */
	#mv .video_wrap { width: 90vw; }
}

/* taglist ----------*/
#taglist { padding-top: 14rem !important; }
#taglist .h2 object { margin-left: -2rem; }
#taglist .articlelist { margin-top: 6rem; }
#taglist .btw { margin-top: 5rem; text-align: center; }
@media screen and (max-width:1024px) { /* iPad 横 l */
	#taglist { padding-top: 10vw !important; }
}

/* our_business ----------*/
#our_business { overflow: hidden; }
#our_business h3.org { text-align: center; font-size: 3.6rem; color: #534E4E; font-weight: 400; margin-bottom: 7rem; line-height: 3; }
#our_business h3.org .obj { display: inline-block; position: relative; }
#our_business h3.org .obj .t { position: relative; z-index: 2; }
#our_business h3.org .obj object { position: absolute; z-index: 1; left: 0; right: 0; margin: auto; }
#our_business h3.org .obj1 object { bottom: 10%; }
#our_business h3.org .obj2 object { bottom: -15%; -webkit-transform: scale(1.1,1.1); transform: scale(1.1,1.1); }
#our_business .wrap {}
#our_business .wrap .pw { position: relative; display: block; }
#our_business .wrap .pw img { position: relative; z-index: 1; }
#our_business .wrap .pw object { position: absolute; z-index: 2; }
#our_business .wrap1 { display: flex; }
#our_business .wrap1 .sub_wrap1 { width: 62.5%; }
#our_business .wrap1 .sub_wrap1 .pw { width: 85%; margin-left: -30rem; }
#our_business .wrap1 .sub_wrap1 .pw object { left: 90%; }
#our_business .wrap1 .sub_wrap1 p { margin-top: 5rem; padding-left: 10rem; line-height: 2.25; }
#our_business .wrap1 .sub_wrap2 { width: 35%; margin-left: auto; }
#our_business .wrap1 .sub_wrap2 .pw { padding-top: 18rem; }
#our_business .wrap1 .sub_wrap2 .pw object { top: 88%; right: -8rem; }
#our_business .btw { margin-top: 4rem; text-align: center; }
@media screen and (max-width:1024px) { /* iPad 横 l */
	#our_business .wrap1 .sub_wrap1 .pw { margin-left: -2rem; }
	#our_business .wrap1 .sub_wrap1 .pw object { left: 80%; }
}
@media screen and (max-width:896px) { /* iPhone 横 m */
	#our_business .wrap1 { display: block; }
	#our_business .wrap1 .sub_wrap1 { width: 100%; }
	#our_business .wrap1 .sub_wrap1 p { margin-top: 3rem; padding-left: 4rem; }
	#our_business .wrap1 .sub_wrap1 .pw object { width: 60%; }
	#our_business .wrap1 .sub_wrap2 { width: 80%; }
	#our_business .wrap1 .sub_wrap2 .pw { padding-top: 4rem; }
	#our_business .wrap1 .sub_wrap2 .pw object { width: 60%; top: 70%; right: -8rem; }

}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#our_business h3.org { font-size: 6vw; }
}

/* solution ----------*/
#solution {}
#solution .h2 object { margin-top: -5.5rem; margin-left: -3rem; }
#solution .solution_list { margin-top: 6rem; }
#solution .solution_list li { margin-top: 0; transition: all 0.6s ease 0.3s; }
#solution .solution_list.inview .sl1 { margin-top: -5rem; }
#solution .solution_list.inview .sl2 { margin-top: 5rem; }
#solution .solution_list.inview .sl3 { margin-top: -3rem; }
#solution .solution_list .pw { display: block; box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16); }
#solution .solution_list .tw { display: block; margin-top: 3rem; }
#solution .solution_list .tw .h { display: block; font-size: 2.6rem; font-weight: bold; }
#solution .solution_list .tw .t { display: block; margin-top: 2rem; }
#solution .solution_list .tw .btw { display: block; margin-top: 3rem; text-align: right; }
@media screen and (max-width:720px) {
	#solution .h2 object { margin-top: -5rem; margin-left: -2rem; }
}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#solution .solution_list { width: 80%; margin: auto; }
	#solution .solution_list[class*="row-3-4rem"] > * { padding-left: 0; }
	#solution .solution_list.inview .sl1 { margin-top: 0; }
	#solution .solution_list.inview .sl2 { margin-top: 0; }
	#solution .solution_list.inview .sl3 { margin-top: 0; }
}

/* archive ----------*/
#archive { padding-top: 0 !important; }
#archive .h2 object { margin-left: -2rem; }
#archive .archive_links {}
#archive .archive_links li {}
#archive .archive_links li a { display: block; padding: 7.5rem 2rem 4rem; color: #FFF; text-decoration: none; background-repeat: no-repeat; background-position: center; background-size: cover; }
#archive .archive_links li span { display: block; text-align: center; }
#archive .archive_links li .h { font-size: 3rem; font-weight: bold; }
#archive .archive_links li .t { max-width: 32rem; margin: auto; margin-top: 1rem; }
#archive .archive_links li .more { position: relative; padding: 3rem 0 3rem; font-size: 2rem; }
#archive .archive_links li .more:after { position: absolute; top: 0; bottom: 0; left: 0; right: 0; content: ""; display: block; width: 8rem; height: 8rem; margin: auto; border-radius: 8rem; border: solid 1px #FFF; }

/* new_post ----------*/
#new_post { overflow: hidden; }
#new_post .owl-carousel .owl-stage-outer { overflow: inherit; }
#new_post .owl-nav { position: absolute; top: -10rem; right: 0; }
#new_post .owl-nav .disabled { opacity: 0.3; }
#new_post .owl-nav button {}
#new_post .owl-nav button:hover { cursor: pointer; }
#new_post .owl-nav .owl-next { margin-left: 10rem; }
#new_post .btw { display: block; margin-top: 5rem; text-align: right; }
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#new_post .owl-nav .owl-next { margin-left: 5rem; }
}


/* pickup ----------*/
#pickup {}
#pickup .btw { display: block; margin-top: 6rem; text-align: center; }

/* recruit_contact ----------*/
#recruit_contact {}
#recruit_contact .h2 { position: relative; display: block; margin-bottom: 9rem; }
#recruit_contact .h2 span { display: block; text-align: center; }
#recruit_contact .h2 .e { margin-right: 0; }
#recruit_contact .h2 .j { margin-top: 2rem; }
#recruit_contact .h2 object { position: absolute; left: 0; right: 0; margin: auto; top: -5.5rem; -webkit-transform-origin: center center; transform-origin: center center; }
#recruit_contact .recruit_contact_links {}
#recruit_contact .recruit_contact_links li {}
#recruit_contact .recruit_contact_links li a { display: block; padding: 7.5rem 2rem 4rem; color: #FFF; text-decoration: none; background-repeat: no-repeat; background-position: center; background-size: cover; }
#recruit_contact .recruit_contact_links li span { display: block; text-align: center; }
#recruit_contact .recruit_contact_links li .h { font-size: 3rem; font-weight: bold; }
#recruit_contact .recruit_contact_links li .t { max-width: 32rem; margin: auto; margin-top: 1rem; }
#recruit_contact .recruit_contact_links li .more { position: relative; padding: 3rem 0 3rem; font-size: 2rem; }
#recruit_contact .recruit_contact_links li .more:after { position: absolute; top: 0; bottom: 0; left: 0; right: 0; content: ""; display: block; width: 8rem; height: 8rem; margin: auto; border-radius: 8rem; border: solid 1px #FFF; }
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#recruit_contact .h2 object {  top: -4rem; -webkit-transform: scale(1,1); transform: scale(1,1); }
}