@charset "utf-8";

/* ============================================= main_visual */
.products_list .main_visual {
	background: url(../imgs/products/atlas/main_visual.jpg) no-repeat center center / cover;
}

.main_visual .text {
	max-width: 736px;
}

/* ------------------------------------- for sp */
@media ( max-width : 767px ) {
	.products_list .main_visual {
		background: url(../imgs/products/atlas/main_visual_sp.jpg) no-repeat center top / cover;
	}
}

.heading_02 {
	margin-bottom:18px;
}

.pc-text-col2 {
	gap: 32px;
	margin: 18px 0 0;
}
.pc-text-col2 .text {
	width: calc(100% - 320px);
}
.pc-text-col2 .image {
	width: 288px;
}


/* ------------------------------------- for sp */
@media ( max-width : 767px ) {
	.pc-text-col2 .text,
	.pc-text-col2 .image {
		width: 100%;
	}

	.pc-text-col2 p {
		font-size: 1.44rem;
	}
}


/* ============================================= dd ul dd table  */
.about_dl dd ul {
	margin:2rem;
}
dl.blue_line dd table {
	width:auto;
}
dl.blue_line dd table th {
	font-weight:400;
	vertical-align:top;
	width:5.5em;
	text-align:left;
}


/* ============================================= inner_links  */
/* ------------------------------------- for sp */
@media ( max-width : 940px ) {
	.inner_links {
		display: grid;
		justify-content: center;
	}
	.inner_links li {
		margin:1rem 0;
		text-align: left;
		width: fit-content;
	}
}


/* ============================================= related_ul */
.related_ul .related_li {
	aspect-ratio: 10 / 9 !important;
	background-size:cover;
}
/* ------------------------------------- responsive */
@media screen and (min-width:931px) and ( max-width:1200px) {
	.related_ul .related_li {
		aspect-ratio: 4 / 3 !important;
		background-size:cover;
	}
}
@media screen and (min-width:768px) and ( max-width:930px) {
	.related_ul .related_li {
		aspect-ratio: 5 / 4 !important;
		background-size:cover;
	}
}

/* ------------------------------------- for sp */
@media ( max-width : 767px ) {
	.related_ul .related_li {
		aspect-ratio: 8/ 9 !important;
		background-size:cover;
	}
}


/* ============================================= page application */
.appli_box {
	display:flex;
	justify-content:space-between;
}
.appli_box .photo_text {
	width:45%;
}
.appli_box .photo {
	width:50%;
}
.appli_box .photo_text ul {
	display:flex;
	justify-content:space-between;
	margin:0;
}
.appli_box .photo_text ul li {
	width:48%;
}
.appli_box .photo_text p {
	margin-top:10px;
	font-size:1.4rem;
}
.appli_box .photo.on_text {
	position:relative;
}
.appli_box .photo.on_text span {
	position:absolute;
	top:1.5rem;
	left:2rem;
	color:var(--color-white);
	font-size:1.2rem;
	line-height:1.85;
}

.photo_ul {
	display:flex;
	flex-wrap:wrap;
	gap:2rem 0;
}
.photo_ul .photo_li {
	width:31%;
	margin-right:3.5%;
}
.photo_ul .photo_li:nth-child(3n) {
	margin-right:0;
}
.photo_ul .photo_li ul {
	display:flex;
	justify-content:space-between;
}
.photo_ul .photo_li ul li {
	width:48%;
}
.photo_ul .photo_li ul li img {
	width:100%;
	height:auto;
}

/* ------------------------------------- for sp */
@media ( max-width : 767px ) {
	.appli_box {
		flex-direction:column;
	}
	.appli_box .photo_text {
		width:100%;
	}
	.appli_box .photo {
		width:100%;
		margin-top:2rem;
	}
	.appli_box .photo.on_text {
		position:relative;
	}
	.appli_box .photo.on_text span {
		position:absolute;
		top:1.5rem;
		left:2rem;
		color:var(--color-white);
		font-size:1.2rem;
		line-height:1.85;
	}
	.photo_ul {
		display:flex;
		flex-wrap:wrap;
		flex-direction:column;
		gap:2rem 0;
	}
	.photo_ul .photo_li {
		width:100%;
		margin-right:0%;
	}
	.photo_ul .photo_li ul {
		display:flex;
		justify-content:space-between;
	}
	.photo_ul .photo_li ul li {
		width:48%;
	}
}


/* ============================================= spec page */
.product_common_visual.thumb .text h2 {
	text-align:left;
	font-weight:700;
	line-height:1.4;
	color:var(--color-main);
	font-size:3rem;
}

/* ------------------------------------- for sp */
@media ( max-width : 767px ) {
	.product_common_visual .text h2 {
		text-align:left;
		font-size:2.5rem;
		color:var(--color-main);
	}
}


/* ============================================= application coming soon */
.comingsoon {
	text-align:center;
	font-size:2.4rem;
	padding-top:50px;
	font-weight:500;
}