@charset "utf-8";
/*--------------------------------------
	copyright : Lampros co.,Ltd.
--------------------------------------*/

@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(animate.css);
@import url(common_parts.css);
@import url(common.css);


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

/* mv ----------*/
#mv { position: relative; }
#mv:before, #mv:after { position: absolute; z-index: 9; content: ""; background-color: rgba(255, 255, 255, 0.2); }
#mv:before { bottom: 8rem; left: 0; width: 100%; height: 1px; }
#mv:after { top: 0; right: 8rem; width: 1px; height: 101%; }
#mv h2 { position: absolute; z-index: 10; bottom: 8rem; right: 8rem; }
#mv li { padding-top: 63%; background-repeat: no-repeat; background-size: cover; background-position: center; }
#mv .owl-dots { position: relative; z-index: 999; width: 100%; margin-top: -3rem; padding: 0 8rem; text-align: right; }
#mv .owl-dots .owl-dot { width: 1rem; height: 1rem; margin-left: 0.5rem; transition: all 0.3s ease-out; }
#mv .owl-dots .owl-dot span { display: inline-block; width: inherit; height: inherit; opacity: 0.5; background-color: #FFF; }
#mv .owl-dots .active { width: 4rem; }
#mv .owl-dots .active span { opacity: 1; background-color: #D59649; }
@media screen and (min-width:1921px) {
	#mv li { padding-top: 100vh; }
}
@media screen and (max-width:1224px) { /* iPad 横 l */
	#mv:before { bottom: 4rem; }
	#mv:after { right: 4rem; }
	#mv h2 { bottom: 4rem; right: 4rem; }
	#mv .owl-dots { margin-top: -3rem; padding: 0 4rem; }
}
@media screen and (max-width:968px) { /* iPad 縦 m */
	#mv h2 { max-width: 61vw; }
}
@media screen and (max-width:414px) { /* iPhone 縦 s */
	#mv li {  padding-top: 90%; }
}

/* information ----------*/
#information { background-color: #1C2C43; position: relative; z-index: 90; }
#information h2 { width: 16rem; color: #FFF; background-color: #D59649; text-align: center; line-height: 8rem; font-weight: bold; float: left; }
#information .nav { display: block; text-decoration: none; float: left; }
#information .nav i { width: 8rem; height: 8rem; color: #1C2C43; text-align: center; line-height: 8rem; font-size: 2rem; }
#information .pre { background-color: rgba(238, 238, 238, 0.95); }
#information .pre i { border-right: solid 1px #DDD; }
#information .nex { background-color: #EEE; }
#information ul { width: calc(100% - 32rem); height: 8rem; overflow: hidden; float: left; }
#information ul li { width: 100%; height: inherit; }
#information ul li a { display: flex; color: #FFF; text-decoration: none; }
#information ul li a span { line-height: 8rem; }
#information ul li a .d { padding: 0 4rem; opacity: 0.7; font-size: 1.4rem; }
#information ul li a .t { overflow: hidden; padding-right: 2rem; text-overflow: ellipsis; text-decoration: underline; font-size: 1.6rem; white-space: nowrap; }
@media screen and (max-width:1224px) { /* iPad 横 l */
	#information h2 { width: 10rem; }
	#information ul { width: calc(100% - 26rem); }
	#information ul li a .d { padding: 0 2rem; }
}
@media screen and (max-width:968px) { /* iPad 縦 m */
	#information h2 { width: 10rem; position: absolute; line-height: 4rem; top: -4rem; left: 0; }
	#information .nav i { width: 4rem; height: 4rem; line-height: 4rem; }
	#information ul { width: calc(100% - 8rem); height: 4rem; }
	#information ul li a span { line-height: 4rem; }
	#information ul li a .d { font-size: 1.2rem; }
	#information ul li a .t { font-size: 1.4rem; }
}

/* news ----------*/
#news { position: relative; }
#news h2 { padding: 8rem 8rem 2rem; border-bottom: solid 1px #EEE; color: rgba(28, 44, 67, 0.5); line-height: 1.4; font-weight: bold; font-size: 2rem; vertical-align: baseline; }
#news h2 span { margin-right: 2rem; color: #1C2C43; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-size: 5rem; vertical-align: baseline; }
#news .btw { padding: 0 8rem; border-top: solid 1px #EEE; }
#news .btw a { position: relative; display: block; width: 100%; padding: 2rem 2rem; color: #1C2B43; text-align: center; text-decoration: none; line-height: 1.2; font-size: 1.6rem; font-weight: bold; }
#news .btw a:before { position: absolute; z-index: 10; top: 0; left: 0; content: ""; width: 100%; height: 100%; border: solid 0 #1C2C43; transition: all 0.1s ease-out; }
#news .btw a:hover:before { border: solid 5px #1C2C43; } { display: block; width: 100%; padding: 5rem 2rem; color: #1C2B43; text-align: center; text-decoration: none; line-height: 1.2; font-size: 1.6rem; font-weight: bold; }
#news .btw a:hover { opacity: 1; background-color: #EEE; }
#news .btw a span {
	position: relative;
	display: inline-block;
}
@media screen and (max-width:1224px) { /* iPad 横 l */
	#news h2 { padding: 4rem 4rem 2rem; }
	#news .btw { padding: 0 4rem; }
	#news .btw a { padding: 3rem 2rem; }
}

/* about ----------*/
#about { background-color: #1C2C43; }
#about:before, #about:after, #about .in:before, #about .in:after { background-color: #324155 !important; }
#about .about {}
#about .about .pw { background-repeat: no-repeat; background-size: cover; background-position: center; }
#about .about .tw {}
#about .about .tw h2 { padding: 6rem 6rem 4rem; color: #FFF; line-height: 1.6; font-size: 3rem; }
#about .about .tw p { padding: 0 6rem 6rem; opacity: 0.8; color: #FFF; font-size: 1.6rem; }
#about .about .tw .btw { border-top: solid 1px #324155; }
#about .about .tw .btw a { display: block; width: 100%; padding: 0 1rem; color: #FFF; text-align: center; text-decoration: none; line-height: 1.2; font-size: 1.6rem; font-weight: bold; }
#about .about .tw .btw a span { position: relative; display: inline-block; padding: 2rem 0; }
#about .about .tw .btw a span:before { position: absolute; top: -1px; left: 0; content: ""; width: 100%; height: 2px; background-color: #D59649; }
#about .about .tw .btw .bt1 { border-right: solid 1px #324155; }
#about .btw a:hover { opacity: 1; background-color: #324155; }
@media screen and (max-width:1400px) { /*  xl */
	#about .about .pw { padding-top: 50%; }
}
@media screen and (max-width:1224px) { /* iPad 横 l */
	#about .about .tw h2 { padding: 3rem 3rem 2rem; }
	#about .about .tw p { padding: 0 3rem 3rem; }
}
@media screen and (max-width:736px) { /* iPhone 横 ms */
	#about .about .tw .btw .bt1 { border-right: none; border-bottom: solid 1px #324155; }
}

/* picup ----------*/
#picup {}
#picup .picup {}
#picup .picup li { position: relative; background-repeat: no-repeat; background-size: cover; background-position: center; }
#picup .picup li:before { position: absolute; content: ""; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); transition: all 0.3s ease-out; }
#picup .picup li:hover:before { opacity: 0.3;.. }
#picup .picup li a { position: relative; z-index: 1; display: block; padding: 19rem 1rem; color: #FFF; text-align: center; text-decoration: none; font-size: 2rem; font-weight: bold; }
#picup .picup li a:before { position: absolute; top: 0; left: 0; right: 0; content: ""; width: 3rem; height: 5px; margin: auto; background-color: #D59649; }
#picup .picup li a:hover { opacity: 1; }
@media screen and (max-width:1400px) { /*  xl */
	#picup .picup li a { padding: 12rem 1rem; }
}
@media screen and (max-width:736px) { /* iPhone 横 ms */
	#picup .picup li a { padding: 8rem 1rem; }
}

#allAbout_text_arrow {
	display: block;
	background-image: url("/wp/wp-content/themes/styles/_img/index/arrow_icon_large_w.svg");
	background-size: 100%;
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-ms-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property:    -moz-transform;
	-ms-transition-property:     -ms-transform;
	-o-transition-property:      -o-transform;
	transition-property:         transform;

}

#allAbout_more_link:hover #allAbout_text_arrow {
	-webkit-transform: translateX(10%);
	-moz-transform: translateX(10%);
	-ms-transform: translateX(10%);
	-o-transform: translateX(10%);
	transform: translateX(10%);
}
#cases_more_link:hover #cases_more_link_arrow {
	-webkit-transform: translateX(10%);
	-moz-transform: translateX(10%);
	-ms-transform: translateX(10%);
	-o-transform: translateX(10%);
	transform: translateX(10%);
}
#cases_more_link_arrow {
	display: block;
	background-image: url("/wp/wp-content/themes/styles/_img/index/arrow_icon_large.svg");
	background-size: 100%;
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-ms-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property:    -moz-transform;
	-ms-transition-property:     -ms-transform;
	-o-transition-property:      -o-transform;
	transition-property:         transform;
}
@media screen and (min-width: 769px) {
	#allAbout_text_arrow {
		width: clamp(0px, 2.777777777777778vw, 40px);
		height: clamp(0px, 2.777777777777778vw, 40px);
	}
	#cases_more_link_arrow {
		width: clamp(0px, 2.777777777777778vw, 40px);
		height: clamp(0px, 2.777777777777778vw, 40px);
	}
}
@media screen and (max-width: 768px) {
	#allAbout_text_arrow {
		width: clamp(0px, 8vw, 30px);
		height: clamp(0px, 8vw, 30px);
	}
	#cases_more_link_arrow {
		width: clamp(0px, 8vw, 30px);
		height: clamp(0px, 8vw, 30px);
	}
}