@charset "utf-8";
/* -----------------------------------------------------------
    .strength-area
-------------------------------------------------------------- */
.strength-area {
	margin: 30px auto 0;
}

.strength-area .cmn-sec-ttl {
	margin: 0 0 10px 0;
}

.strength-area .strength-box {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	gap: 40px;
}

.strength-area .strength-box.strength02,
.strength-area .strength-box.strength04 {
	flex-direction: row-reverse;
}

.strength-area .strength-img {
	position: relative;
	width: 525px;
	height: 480px;
	margin: 0;
}

.strength-area .strength-img img {
	position: absolute;
	height: 100%;
}

.strength-area .strength02 .strength-img img,
.strength-area .strength04 .strength-img img {
	left: auto;
}

.strength-area .strength-deswrap {
	width: 50%;
	padding: 0 20px 0 0;
}

.strength-area .strength-box::before {
	content: "";
	display: block;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	position: absolute;
	z-index: -1;
}

.strength-area .strength01::before {
	background-image: url("../img/about-strength-img01-bg.png");
	width: 258px;
	height: 254px;
	top: 40px;
	right: 100px;
}

.strength-area .strength02::before {
	background-image: url("../img/about-strength-img02-bg.png");
	width: 259px;
	height: 258px;
	top: 40px;
	left: 350px;
}

.strength-area .strength03::before {
	background-image: url("../img/about-strength-img03-bg.png");
	width: 260px;
	height: 229px;
	top: 40px;
	right: 80px;
}

.strength-area .strength04::before {
	background-image: url("../img/about-strength-img04-bg.png");
	width: 199px;
	height: 198px;
	top: 65px;
	left: 380px;
}

@media screen and (max-width: 768px) {
	.strength-area {
		margin: 30px 20px 0;
	}

	.strength-area .cmn-sec-ttl {
		margin: 0 0 10px 0;
	}

	.strength-area .strength-box {
		display: block;
		margin: 25px 0 0 0;
	}

	.strength-area .strength-img {
		position: static;
		width: 80vw;
		height: auto;
		padding: 0 0 15px 0;
	}

	.strength-area .strength-img img {
		position: static;
		height: auto;
	}

	.strength-area .strength-deswrap {
		width: 100%;
		padding: 0;
	}
	
	.strength-area .strength-deswrap .cmn-boxttl {
		margin-bottom: 15px;
		text-align: center;
	}
	
	.strength-area .strength-deswrap .cmn-boxttl .num {
		margin: 0 auto 5px
	}

	.strength-area .strength01::before {
		width: 40vw;
		height: 40vw;
		top: 50vw;
		right: 0;
	}

	.strength-area .strength02::before {
		width: 37vw;
		height: 37vw;
		top: 65vw;
		left: auto;
		right: -10px;
	}

	.strength-area .strength03::before {
		width: 40vw;
		height: 37vw;
		top: 65vw;
		right: -10px;
	}

	.strength-area .strength04::before {
		width: 35vw;
		height: 35vw;
		top: 65vw;
		left: auto;
		right: -10px;
	}
}

/* -----------------------------------------------------------
    .service-area
-------------------------------------------------------------- */
.service-area {
	background: #f0f0ef;
	padding: 50px 0 45px;
	margin: 50px 0 0;
}

.service-area .cmn-sec-ttl {
	margin: 0 0 40px 0;
}

.service-area .sechead-txt {
	margin: 30px 0 0;
	line-height: 2.3;
	letter-spacing: .09em;
	text-align: center;
}

@media screen and (max-width: 768px) {

	.service-area {
		padding: 30px 0 0;
		margin: 30px 0 0;
	}

	.service-area .cmn-sec-ttl {
		margin: 0 0 20px 0;
	}

	.service-area .sechead-txt {
		font-size: 1.6rem;
		line-height: 2.2;
		text-align: left;
	}

}


/* -----------------------------------------------------------
    service-nav
-------------------------------------------------------------- */
.service-area .service-nav {
	margin: 45px 0 0 0;
}

.service-area .service-nav .service-list {
	display: flex;
	justify-content: space-between;
}

.service-area .service-nav .service-list li {
	width: 380px;
}

.service-area .service-nav .service-list a {
	background: #fff;
	display: block;
	padding: 5px 15px 40px;
	position: relative;
	height: 450px;
}

.service-area .service-nav .service-list a::after {
	content: "\f063";
	display: inline-block;
	color: #fff;
	font-weight: 600;
	font-family: "Font Awesome 5 Free";
	font-size: 2rem;
	position: absolute;
	bottom: 5px;
	left: 50%;
	animation: fuwafuwa 1.5s infinite;
}


.service-area .service-nav .service-list .nav01 a::after {
	color: var(--service1);
}

.service-area .service-nav .service-list .nav02 a::after {
	color: var(--service2);
}

.service-area .service-nav .service-list .nav03 a::after {
	color: var(--service3);
}

.service-area .service-nav .from-box {
	background-color: #fff;
	height: 280px;
}

.service-area .service-nav .cmn-txt {
	font-size: 2.0rem;
	letter-spacing: 0.05em;
	text-align: center;
	margin: 0 0 5px 0;
}

.service-area .service-nav .nav01 .cmn-txt,
.service-area .service-nav .nav01 .nav-ttl {
	color: var(--service1);
}

.service-area .service-nav .nav02 .cmn-txt,
.service-area .service-nav .nav02 .nav-ttl
{
	color: var(--service2);
}

.service-area .service-nav .nav03 .cmn-txt,
.service-area .service-nav .nav03 .nav-ttl {
	color: var(--service3);
}

.service-area .service-nav .voice-img {
	text-align: center;
}

.service-area .service-nav .voice-img img {
	aspect-ratio: 340/260;
	object-fit: cover;
	height: 100%;
	width: 100%;
}

.service-area .service-nav .nav-ttl {
	font-size: 1.7rem;
	letter-spacing: 0.07em;
	text-align: center;
	line-height: 1.3;
	margin: 40px 0 0 0;
}

.service-area .service-nav .nav-ttl span {
	font-size: 2.5rem;
	font-weight: 700;
	line-height: 2;
}

@media screen and (max-width: 768px) {

	.service-area .service-nav {
		margin: 30px 0 0 0;
	}

	.service-area .service-nav .service-list {
		display: flex;
		justify-content: space-between;
		flex-direction: column;
	}

	.service-area .service-nav .service-list li {
		width: 100%;
		margin: 0 0 20px 0;
	}

	.service-area .service-nav .service-list a {
		height: auto;
		padding: 0 0 30px;
	}

	.service-area .service-nav .service-list a::after {
		font-size: 2.1rem;
		bottom: 5px;
	}

	.service-area .service-nav .service-list .from-box {
		background-color: #fff;
		padding: 0;
		height: auto;
	}
	
	.service-area .service-nav .service-list .from-box img {
		width: 80%;
	}

	.service-area .service-nav .service-list .cmn-txt {
		font-size: 1.4rem;
		margin: 0 0 5px 0;
		line-height: 1;
		padding: 5px 5px 7px;
		letter-spacing: .1em;
	}
	
	.service-area .service-nav .nav01 .cmn-txt {
		background: var(--service1);
		color: #fff;
	}
	
	.service-area .service-nav .nav02 .cmn-txt {
		background: var(--service2);
		color: #fff;
	}
	
	.service-area .service-nav .nav03 .cmn-txt {
		background: var(--service3);
		color: #fff;
	}

	.service-area .service-nav .nav-ttl {
		font-size: 1.5rem;
		margin: 13px 0 0 0;
		line-height: 1.3;
	}

	.service-area .service-nav .nav-ttl span {
		font-size: 2.3rem;
		line-height: 1.7;
	}

	.service-area .service-nav .nav02 .nav-ttl,
	.service-area .service-nav .nav03 .nav-ttl {
		font-size: 1.5rem;
	}
}



/* -----------------------------------------------------------
    service-box  共通
-------------------------------------------------------------- */
.service-box {
	background-color: #fff;
	padding: 30px 40px;
	margin: 40px 0 0 0;
}

.service-box .cmn-boxttl {
	align-items: center;
	display: flex;
	justify-content: center;
}

.service-box .cmn-boxttl .num {
	background: var(--service1);
	margin: 0;
}

.service-box .cmn-catch {
	font-size: 3.5rem;
	font-weight: bold;
	letter-spacing: 0.05em;
	margin: 0 0 0 20px;
	line-height: 1.54;
	color: var(--service1);
}

.service-box .catch-wrap {
	display: inherit;
	position: relative;
	margin: 25px 0 35px;
}

.service-box .catch-wrap .txt-wrap {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 550px;
	height: 365px;
	position: absolute;
	left: 550px;
	top: 0px;
	margin: 0 0 0 30px;
	align-items: flex-start;
}

.service-box .catch-wrap .service-catch {
	color: var(--service1);
	font-size: 3rem;
	letter-spacing: .07em;
	line-height: 1.5;
	margin: 0 0 20px 0;
}

.service-box .catch-wrap .txt-wrap .txt {
	line-height: 2.5;
}


@media screen and (max-width: 768px) {
	
	.service-box {
		padding: 0;
		margin: 50px 0 0 0;
	}
	
	.service-box .cmn-boxttl {
		text-align: center;
	}

	.service-box .cmn-catch {
		font-size: 2.4rem;
		margin: -4px 0 0 12px;
		line-height: 1.5;
	}

	.service-box .catch-wrap {
		position: relative;
		margin: 15px 0 25px;
	}

	.service-box .catch-wrap .txt-wrap {
		display: block;
		width: 100%;
		height: auto;
		position: static;
		margin: 15px 0 0 0;
		padding: 0 20px;
	}

	.service-box .catch-wrap .service-catch {
		font-size: 2rem;
		line-height: 1.5;
		margin: 0 0 15px 0;
		text-align: center;
	}

	.service-box .catch-wrap .txt-wrap .txt {
		line-height: 2.2;
	}

	
	
}



/* -----------------------------------------------------------
    service-box > point-box   共通
-------------------------------------------------------------- */
.service-box .point-box {
	padding: 35px 40px;
	margin: 0 0 30px;
	background: #e5ecf4;
}

.service-box .point-box-catch {
	font-size: 2.5rem;
	letter-spacing: .07em;
	line-height: 1;
	color: var(--service1);
	text-align: center;
}

.service-box .cmn-ttldeco span::before{
	background:  var(--service1);
}

.service-box .point {
	padding: 25px 40px 40px;
	background-color: #fff;
}

.service-box .point-ttl {
	font-size: 2.2rem;
	letter-spacing: .09em;
	color: var(--service1);
	text-align: center;
	position: relative;
	margin: 34px 0 8px 0;
	line-height: 1.3;
}

.service-box .point-ttl::before {
	content: "";
	width: 34px;
	height: 32px;
	background-image: url("../img/about-service-point-icon.png");
	position: absolute;
	top: -34px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

.service-box .point-img {
	text-align: center;
	height: 220px;
}

.service-box .point-txt p {
	line-height: 2.2;
}

.service-box .point-txt p:not(:first-of-type) {
	margin: 5px 0 0 0;
}

@media screen and (max-width: 768px) {
	
	.service-box .point-box {
		background: #e5ecf4;
		padding: 15px;
		margin: 0;
	}
	
	.service-box .point-box-catch {
		font-size: 2rem;
		line-height: 1.3;
	}
	
	.service-box .point-ttl {
		font-size: 1.8rem;
		margin: 30px 0 10px 0;
	}

	.service-box .point-ttl::before {
		width: 30px;
		height: 29px;
		background-image: url("../img/about-service-point-icon.png");
		background-size: cover;
		top: -34px;
	}

	.service-box .point-img {
		text-align: center;
		margin: 0 0 10px 0;
		height: 180px;
	}

	.service-box .point-box .txt {
		line-height: 2.2;
		font-size: 1.6rem;
		text-align: left;
	}

	.service-box .point-box .txt span.br-txt {
		margin: 10px 0 0 0;
	}
	
}



/* -----------------------------------------------------------
    service-banner  共通
-------------------------------------------------------------- */
/* service-banner */
.service-area .service-banner {
	display: flex;
	flex-direction: row-reverse;
	height: 275px;
	width: 100%;
}

.service-area .service-banner:hover {
	opacity: .7;
}

.service-area .service-banner .sp-slide ul {
	display: flex;
	height: 275px;
}

.service-area .service-banner .sp-slide ul.sp-display {
	display: none;
}

.service-area .service-banner .sp-slide img {
	width: 100%;
	height: 100%;
}

.service-area .service-banner .service-cmn-btn {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	flex-shrink: 0;
	width: 375px;
	padding: 45px 5px 25px 45px;
	position: relative;
}

.service-area .service-banner .service-cmn-btn::before {
	content: "";
	width: 42px;
	height: 9px;
	background-image: url("../img/cmn-more-arrow.png");
	background-repeat: no-repeat;
	background-size: contain;
	position: absolute;
	right: 38px;
	bottom: 30px;
	transition: ease 0.5s;
}

.service-area .service-banner:hover .service-cmn-btn::before {
	right: 30px;
}

.service-area .service-banner .service-cmn-btn .en {
	font-family: 'Poppins', sans-serif;
	font-size: 1.6rem;
	line-height: 1;
	letter-spacing: 0.05em;
	padding: 0 0 15px 0;
}

.service-area .service-banner .service-cmn-btn .ja {
	color: #fff;
	font-size: 1.8rem;
	line-height: 1;
	letter-spacing: 0.03em;
}

.service-area .service-banner .service-cmn-btn .ja span {
	font-size: 3.5rem;
	line-height: 1.7;
	letter-spacing: .07em;
	margin: 5px 0 0 0;
	display: block;
}

.service-area .service-banner .btn-txt {
	font-size: 1.9rem;
	color: #fff;
	line-height: 1;
	background-color: #a49475;
	padding: 6px 10px 10px;
	margin: 15px 0 0 0;
	width: fit-content;
}

@media screen and (max-width: 768px) {

	.service-area .service-banner {
		display: block;
		height: auto;
		width: 100%;
		overflow: hidden;
	}

	.service-area .service-banner .sp-slide {
		display: flex;
		animation: about-slide 10s infinite linear .4s both;
	}

	.service-area .service-banner .sp-slide ul {
		display: flex;
		max-width: unset;
		flex-shrink: 0;
		height: auto;
	}

	.service-area .service-banner .sp-slide ul.sp-display {
		display: flex;
	}

	.service-area .service-banner .sp-slide img {
		object-fit: cover;
		height: 100%;
		width: 100%;
	}
	
	.service-area .service-banner .sp-slide li {
		width: 150px;
		height: 175px;
		flex-shrink: 0;
	}

	.service-area .service-banner .service-cmn-btn {
		width: 100%;
		padding: 20px 15px 40px;
		text-align: center;
	}

	.service-area .service-banner .service-cmn-btn::before {
		width: 41px;
		height: 7px;
		right: auto;
		bottom: 15px;
		left: 50%;
		-webkit-transform : translateX(-50%);
		transform : translateX(-50%);
	}

	.service-area .service-banner:hover .service-cmn-btn::before {
		right: 15px;
	}

	.service-area .service-banner .service-cmn-btn .en {
		font-size: 1.5rem;
		padding: 0;
		text-align: center;
	}

	.service-area .service-banner .service-cmn-btn .ja {
		font-size: 1.6rem;
		text-align: center;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.service-area .service-banner .service-cmn-btn .ja span {
		font-size: 2.4rem;
		line-height: 1.7;
		margin: 0 0 0 10px;
	}

	.service-area .service-banner .btn-txt {
		font-size: 1.7rem;
		padding: 6px 15px 8px;
		margin: 10px 0 0 0;
		display: inline-block;
		letter-spacing: .05em;
	}

}



/* -----------------------------------------------------------
    service-box01～03
-------------------------------------------------------------- */
/*     service-box01                                */
.service-box01 .point-wrap {
	display: flex;
	justify-content: space-between;
	padding: 0;
	margin: 30px 0 0;
}

.service-box01 .point {
	padding: 10px 20px 20px;
	width: 505px;
}

.service-box01 .point-box .point:nth-child(2) .point-ttl {
	padding: 17px 0;
	margin: 34px 0 6px 0;
}

.service-box01 .point-img img {
	max-height: 100%;
	max-width: 100%;
}

.service-box01 .service-cmn-btn {
	background-color: #3b5a82;
}

.service-box01 .service-cmn-btn .en {
	color: #93adce;
}

/*     service-box02                                */
.service-box02 .cmn-boxttl .num {
	background-color: var(--service2);
}

.service-box02 .cmn-boxttl .cmn-catch {
	color: var(--service2);
}

.service-box02 .catch-wrap .service-catch {
	color: var(--service2);
}

.service-box02 .point {
	margin: 30px 0 0;
}

.service-box02 .point-box {
	background-color: #e7f3ef;
}

.service-box02 .point-box .point-box-catch {
	color: var(--service2);
}

.service-box02 .cmn-ttldeco span::before,
.service-box02 .cmn-ttldeco span::after {
	background-color: var(--service2);
}

.service-box02 .point-ttl {
	color: var(--service2);
	margin: 40px 0;
}

.service-box02 .point-ttl::before {
	background-image: url("../img/about-service-point-icon02.png");
	top: -40px;
}

.service-box02 .point-img {
	display: flex;
	justify-content: space-between;
	margin: 0 0 25px 0;
}

.service-box02 .point-img li {
	position: relative;
}

.service-box02 .point-img img {
	max-width: 100%;
	max-height: 100%;
}

.service-box02 .point-img li::after {
	content: "";
	display: block;
	width: 30px;
	height: 32px;
	background: url("../img/about-service-green-arrow.png") no-repeat center /cover;
	position: absolute;
	right: -30px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 1;
}

.service-box02 .point-img li:nth-child(3)::after {
	display: none;
}

.service-box02 .service-cmn-btn {
	background: #65b9aa;
}

.service-box02 .service-cmn-btn .en {
	color: #d4f6ec;
}

.service-box02 .service-banner .btn-txt {
	background: #CDBD6C;
}

.service-box02 .service02-bnr {
	width: calc( 100% - 375px );
}

.service-box02 .service-banner img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/*     service-box03                                */
.service-box03 .cmn-boxttl .num {
	background-color: var(--service3);
}

.service-box03 .cmn-catch {
	color: var(--service3);
}

.service-box03 .catch-wrap .service-catch {
	color: var(--service3);
}

.service-box03 .point {
	margin: 30px 0 0;
}

.service-box03 .point-box {
	background: #e0eff2;
}

.service-box03 .point-box-catch {
	color: var(--service3);
}

.service-box03 .cmn-ttldeco span::before,
.service-box03 .cmn-ttldeco span::after {
	background-color: var(--service3);
}

.service-box03 .point-ttl {
	color: var(--service3);
	margin: 35px 0 20px;
}

.service-box03 .point-ttl::before {
	background-image: url("../img/about-service-point-icon03.png");
	top: -40px;
}

.service-box03 .service-cmn-btn {
	background: #5fafbb;
}

.service-box03 .service-cmn-btn .en {
	color: #bbe5eb;
}

.service-box03 .service-cmn-btn .ja {
	font-size: 1.8rem;
}

.service-box03 .point-img {
	margin-bottom: 20px;
	height: 240px;
}

.service-box03 .point-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.service-box03 .service03-bnr {
	width: calc( 100% - 375px );
}

.service-box03 .service03-bnr img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.service-box03 .service-banner .btn-txt {
	background: #89837E;
}

@media screen and (max-width: 768px) {

	/*.nav01.service-box*/
	.service-box01 {
		padding: 25px 0 0 0;
		margin: 10px 0 0 0;
	}
	
	.service-box01 .point-wrap {
		flex-direction: column;
		margin: 20px 0 0;
	}

	.service-box01 .point {
		padding: 15px 12px 20px!important;
		width: 100%;
		margin: 0 0 20px 0;
	}

	.service-box01 .point-box .point:nth-child(2) {
		margin: 0;
	}

	.service-box01 .point-box .point:nth-child(2) .point-ttl {
		padding: 0;
		margin: 30px 0 10px 0;
	}
	
	.service-box01 .service-banner {
		background: #0148a2;
	}

	/*     service-box02                                */
	.service-box02 .point-box {
		background: #e7f3ef;
	}
	
	.service-box02 .point {
		padding: 15px 10px;
		margin: 15px 0 0;
	}
	
	.service-box02 .point-ttl {
		margin: 30px 0 10px;
	}

	.service-box02 .point-ttl::before {
		top: -30px;
	}

	.service-box02 .point-img {
		display: block;
		position: relative;
		width: 100%;
		height: 196px;
		overflow: hidden;
		margin: 0 0 10px 0;
	}

	.service-box02 .point-img li {
		position: absolute;
		width: 100%;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		opacity: 0;
		animation: slideshow 6s linear infinite;
		height: 100%;
	}

	.service-box02 .point-img li:nth-child(2) {
		animation-delay: 2s;
	}

	.service-box02 .point-img li:last-child {
		animation-delay: 4s;
	}

	.service-box02 .point-img li::after {
		display: none;
	}
	
	.service-box02 .point-img img {
		aspect-ratio: auto;
		object-fit: unset;
		width: auto;
	}
	
	.service-box02 .service02-bnr {
		width: 100%;
	}

	/*     service-box03                                */
	.service-box03 .point-ttl {
		margin: 30px 0 10px;
	}

	.service-box03 .point-ttl::before {
		top: -30px;
	}

	.service-box03 .point-img {
		overflow: hidden;
		height: 28vw;
		width: auto;
		display: flex;
		justify-content: flex-end;
	}

	.service-box03 .point-box img {
		width: auto;
		max-width: inherit;
		height: 100%;
	}
	
	.service-box03 .point-box .point {
		padding: 15px 10px 20px;
		margin: 20px 0 0;
	}

	.service-box03 .service-banner .service-cmn-btn .ja {
		font-size: 1.6rem;
		display: block;
		margin: 10px 0 0;
	}
	
	.service-box03 .service03-bnr {
		width: 100%;
	}

}





/* -----------------------------------------------------------
    .rooftop-area
-------------------------------------------------------------- */
.rooftop-area {
	padding: 140px 0 20px 0;
	position: relative;
}

.rooftop-area .sp-slide {
	max-width: 1350px;
	height: 488px;
	position: absolute;
	top: 50px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: -1;
	width: 100%;
}

.rooftop-area .sp-slide ul {
	position: relative;
	width: 100%;
	height: 100%;
}

.rooftop-area .sp-slide li {
	position: absolute;
}

.rooftop-area .sp-slide ul li:first-child {
	top: -10px;
	left: 120px;
	height: 180px;
	width: 290px;
}

.rooftop-area .sp-slide ul li:nth-child(2) {
	bottom: 60px;
	left: 30px;
	height: 180px;
	width: 270px;
}

.rooftop-area .sp-slide ul li:nth-child(3) {
	top: 0;
	right: 160px;
	height: 200px;
	width: 230px;
}

.rooftop-area .sp-slide ul li:nth-child(4) {
	bottom: 45px;
	right: 40px;
	height: 200px;
	width: 270px;
}

.rooftop-area .sp-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rooftop-area .sub-catch {
	margin: 50px auto 30px;
	font-size: 3.2rem;
	letter-spacing: 0.08em;
	line-height: 1.7;
	text-align: center;
	color: var(--main);
}

.rooftop-area .txt {
	text-align: center;
}

.rooftop-area .cube-slider {
	margin: 50px 0 60px;
}

.rooftop-area .swiper-pagination-bullet {
	display: none;
}

.rooftop-area .swiper-button-next,
.rooftop-area .swiper-button-prev {
	display: none;
}

.rooftop-area .swiper-cube .swiper-cube-shadow::before {
	display: none;
}

.rooftop-area .cmn-btn {
	margin: 0 auto;
}

@media screen and (max-width: 768px) {

	.rooftop-area {
		margin: 30px 0 0;
		padding: 0;
		position: static;
		width: 100%;
	}

	.rooftop-area .sp-slide {
		position: static;
		transform: none;
		display: flex;
		height: auto;
		margin: 0 0 30px 0;
		animation: about-slide 20s infinite linear .4s both;
		width: auto;
	}

	.rooftop-area .sp-slide ul {
		position: static;
		display: flex;
		height: auto;
		flex-shrink: 0;
		width: auto;
	}

	.rooftop-area .sp-slide li{
		flex-shrink: 0;
		position: static;
		width: 150px!important;
		height:145px!important;
	}

	.rooftop-area .sub-catch {
		margin: 30px 0;
		font-size: 1.9rem;
		text-align: left;
		letter-spacing: .05em;
	}

	.rooftop-area .txt {
		text-align: left;
	}

	.rooftop-area .cube-slider {
		margin: 30px 0 30px 0;
	}

	.rooftop-area .cmn-btn {
		margin: 0 auto;
	}
}