@charset "UTF-8";

/* =============================================================

    LINEUP PAGE CSS

============================================================= */


/*//////////////////////////////////////////////////

　　　　　　　　　　ALL SETTING

//////////////////////////////////////////////////*/



/*//////////////////////////////////////////////////

　　　　　　　　　　PC ONLY SETTING

//////////////////////////////////////////////////*/


@media (min-width: 769px) {

	#Contents {
		padding-bottom: 15rem;
	}

	.hdg-l1 {
		margin: 5rem 0 3rem;
		font-size: 2.2rem;
	}

	.section .list-product {
		display: flex;
		justify-content: center;
		width: 100% !important;
		max-width: 100%;
		gap: 2rem;
	}

	.section .list-product a:hover {
		text-decoration: none;
	}

	.lineup_section .list-product {
		gap: 2rem;
		margin-bottom: 2rem;
	}

	.lineup_section .list-product > li {
		width: 16rem !important;
		margin: 0 !important;
	}

	.lineup_section .list-product ul li {
		margin-bottom: .6rem;
		line-height: 1.3;
	}

	.lineup_section .list-product ul li span {
		display: inline-block;
		font-size: 0.9em;
	}

	.scene_section .list-product {
		margin: 0 !important;
	}

	.scene_section .list-product > li {
		padding: 0 !important;
	}

}



/*//////////////////////////////////////////////////

　　　　　　　　　　SP ONLY SETTING

//////////////////////////////////////////////////*/


@media (max-width: 768px) {

	#Contents {
		padding-bottom: calc(50 * (100vw / 375));
	}

	.hdg-l1 {
		margin: calc(50 * (100vw / 375)) 0 calc(30 * (100vw / 375));
		font-size: calc(20 * (100vw / 375));
	}

	.section {
		overflow: hidden;
	}

	.list-product > li .s_title {
		font-size: calc(16 * (100vw / 375));
	}

	.section .list-product {
		width: 95% !important;
		max-width: 95%;
    font-size: calc(12 * (100vw / 375));
	}

	.section .list-product img {
		max-width: 100%;
	}

	.section .list-product ul li span {
		display: inline-block;
		font-size: calc(11 * (100vw / 375));
	}

	.scene_section .list-product {
		gap: calc(15 * (100vw / 375));
	}

	.scene_section .list-product > li {
		width: calc(146 * (100vw / 375));
		padding: 0;
	}

  .scene_section .list-product > li a {
    border: 1px solid #000;
    display: inline-block;
    text-decoration: none;
    width: 100%;
    max-width: calc(210 * (100vw / 375));
    line-height: 1.4;
    color: inherit;
    font-size: calc(12 * (100vw / 375));
    padding: calc(10 * (100vw / 375)) calc(10 * (100vw / 375));
    text-align: center;
  }

}