@charset "utf-8";

/* -------------------------------------------------- */
/* PC*/
/* -------------------------------------------------- */
.serviceItem {
	padding-top: 80px;
	padding-bottom: 100px;
	border-top: 1px solid #DCDCDC;
}

.serviceItem:first-child {
	padding-top: 0;
	border-top: none;
}

.serviceItem:last-child {
	padding-bottom: 0;
}

.serviceItem > *:last-child,
.serviceItemCol > *:last-child {
	margin-bottom: 0;
}

.serviceItemHead {
	margin-bottom: 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.serviceItemTitle {
	margin-bottom: 0;
}

.serviceItemImg {
	margin-bottom: 30px;
}

.serviceItemText {
	margin-bottom: 50px;
	font-size: 1.7rem;
	line-height: calc(35 / 17);
}

.serviceItemLinkWrap {
	margin-bottom: 60px;
	display: grid;
	grid-template-columns: repeat(auto-fit, 190px);
	gap: 20px 60px;
	justify-content: center;
}

.serviceItemRow {
	display: flex;
	justify-content: space-between;
}

.serviceItemRow .serviceItemCol {
	width: 46%;
}

/* アプリの紹介 */
#introduce {
	padding: 70px 50px 70px 47%;
	position: relative;
	background-color: #EEEEEE;
}

#introduce::before {
	content: "";
	width: 47%;
	height: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	background: url(../../img/service/smartphone.png) no-repeat center bottom / contain;
}

#introduceHead {
	margin-bottom: 20px;
	display: flex;
	align-items: center;
	gap: 15px;
}

#introduceTitle {
	font-size: 3.2rem;
	font-weight: 500;
}

#introduceText {
	margin-bottom: 30px;
	font-size: 1.7rem;
	line-height: calc(35 / 17);
}

#introduceLinkWrap {
	display: flex;
	align-items: center;
	gap: 45px;
}

/* ------------------------------------ */
/* ホバーエフェクト */
/* ------------------------------------ */
@media screen and (min-width: 1025px) {
	.introduceLink a {
		transition: all 0.3s ease 0s;
	}

	.introduceLink a:hover {
		opacity: 0.7;
	}
}

/* -------------------------------------------------- */
/* PC(調整) */
/* -------------------------------------------------- */
@media screen and (min-width: 1025px) and (max-width: 1279px) {
	.serviceItemRow .serviceItemCol {
		width: 48%;
	}

	.serviceItemRow .serviceItemCol .headingMain {
		font-size: 3.6rem;
	}
}

/* -------------------------------------------------- */
/* TAB&SP */
/* -------------------------------------------------- */
@media screen and (max-width: 1024px) {
	.serviceItemLinkWrap {
		gap: 20px;
	}

	.serviceItemRow {
		flex-direction: column;
		gap: 60px;
	}

	.serviceItemRow .serviceItemCol {
		width: 100%;
	}
}


/* -------------------------------------------------- */
/* TAB(調整) */
/* -------------------------------------------------- */
@media screen and (min-width: 768px) and (max-width: 1024px) {

}

/* -------------------------------------------------- */
/* SP(調整) */
/* -------------------------------------------------- */
@media screen and (max-width: 767px) {
	.serviceItem {
		padding-top: 60px;
		padding-bottom: 60px;
	}

	.serviceItemHead {
		margin-bottom: 20px;
		gap: 20px;
	}

	.serviceItemTitle {
		flex-shrink: 0;
	}

	.serviceItemTitle .headingMain {
		font-size: 2.5rem;
	}

	.serviceItemLogo #edison-smart {
		width: 78px;
	}

	.serviceItemLogo #edison-bulb-led {
		width: 74px;
	}

	.serviceItemLogo #porka {
		width: 84px;
	}

	.serviceItemLogo #woomen {
		width: 64px;
	}

	.serviceItemLogo #presslim {
		width: 106px;
	}

	.serviceItemLogo #press-gear {
		width: 110px;
	}

	.serviceItemLogo #vivala {
		width: 102px;
	}

	.serviceItemImg {
		margin-bottom: 20px;
	}

	.serviceItemText {
		margin-bottom: 30px;
		font-size: 1.4rem;
	}

	.serviceItemLinkWrap {
		gap: 15px;
		grid-template-columns: auto;
		justify-content: normal;
	}

	.serviceItemLink .btn {
		width: 100%;
	}

	/* アプリの紹介 */
	#introduce {
		padding: 30px 20px 240px;
	}

	#introduce::before {
		width: 100%;
		height: 240px;
	}

	#introduceHead {
		margin-bottom: 10px;
	}

	#introduceTitle {
		font-size: 2.4rem;
		font-weight: 500;
	}

	#introduceAppIcon {
		width: 48px;
	}

	#introduceText {
		margin-bottom: 20px;
		font-size: 1.4rem;
	}

	#introduceLinkWrap {
		justify-content: center;
		gap: 20px;
	}
}