/* =============================================================
   商品一覧　.product_list
============================================================= */
/* 共通
-------------------------------------------*/
/* リスト
--------------------------------*/
/* ul */
.product_list ul {
	gap: 2.5rem 5%;
}
/* li */
.product_list li {
	flex-basis: calc((100% - 5%*2)/3);
}

/* リンク
--------------------------------*/
/* a img */
.product_list li a img {
	transition: all 0.3s; /* ゆっくり戻すため記述 */
	opacity: 1; /* ゆっくり戻すため記述 */
	filter: brightness(100%); /* ゆっくり戻すため記述 */
}
/* a img:hover */
.product_list li a:hover img {
	transition: all 0.3s;
	opacity: 0.8;
	filter: brightness(110%);
}
/* li a h6 */
.product_list li a h6 {
	line-height: 1.3;
	text-align: center;
	margin-top: 0.3rem;
}
/* h6:hover */
.product_list li a:hover h6 {
	text-decoration: underline;
}


/* =============================================================
   商品詳細　.product_detail
============================================================= */
/* 共通
-------------------------------------------*/
/* ブロック
--------------------------------*/
/* スクロール時の高さ調整 */
.header_scrolled.admin-bar .site-header + .page-header + .breadcrumb + .site-body {
	margin-top: 10rem;
}
/* sub_block */
.product_detail .detail_wrapper .sub_block + .sub_block {
	margin-top: 2.5rem;
}

/* 見出し・文章
--------------------------------*/
/* h3 */
.product_detail h3 {
	border-bottom: 0;
}

/* 商品内容 
--------------------------------*/
/* 共通 .detail_wrapper
---------------------*/
/* block_inner */
.product_detail .detail_wrapper .block_inner {
	gap: 1rem 4.1666%;
	align-items: flex-start;
}
/* 表示順 */
.product_detail .detail_wrapper .left.slider { order: 1; }
.product_detail .detail_wrapper .left.movie { order: 3; }
.product_detail .detail_wrapper .right { order: 2; }

/* 左（スライダー、動画） .left
---------------------*/
/* 枠 .left
------------*/
/* left */
.product_detail .detail_wrapper .left {
	width: calc((100% -  4.1666%)/2);
}
/* スライダー .slider
----------*/
/* swiper-container */
.product_detail .swiper-container {
	user-select: none;
}
/* サムネイル */
.product_detail .gallery-thumbs .swiper-wrapper {
	flex-flow: row wrap;
	justify-content: flex-start;
}
.product_detail .xo-slider-template-thumbnail .gallery-thumbs .swiper-slide {
	width: calc((100% - 8.5%) / 5 ) !important;
	margin-top: calc( 8.5% / 4 );
	margin-right: calc( 8.5% / 4 );
	border: 1px solid var(--color-border1);
}
.product_detail .xo-slider-template-thumbnail .gallery-thumbs .swiper-slide.swiper-slide-thumb-active {
	border: 2px solid var(--color-accent2);
}
.product_detail .xo-slider-template-thumbnail .gallery-thumbs .swiper-slide:nth-of-type(5n) {
	margin-right: 0;
}
/* 動画 .movie
----------*/
/* .movie */
.product_detail .detail_wrapper .left.movie { margin-top: 3rem; }
.product_detail.eco .detail_wrapper .left.movie { margin-top: -13rem; }
.product_detail.eco-black .detail_wrapper .left.movie { margin-top: -13rem; }
.product_detail.eco-zero .detail_wrapper .left.movie { margin-top: -30rem; }
.product_detail.ex .detail_wrapper .left.movie { margin-top: -13rem; }
.product_detail.whale .detail_wrapper .left.movie { margin-top: -20rem; }
.product_detail.okugai .detail_wrapper .left.movie { margin-top: -20rem; }
/* h3 + video */
.product_detail .detail_wrapper .left.movie h3 + .video {
	margin-top: 0.5rem;
}
/* h3 + video + h3 */
.product_detail .detail_wrapper .left.movie h3 + .video + h3 {
	margin-top: 2rem;
}

/* 右（詳細） .right
---------------------*/
/* 枠 .right
----------*/
/* right */
.product_detail .detail_wrapper .right {
	width: calc((100% -  4.1666%)/2);
}
/* アイコン
----------*/
/* ul.icon */
.product_detail .detail_wrapper .right ul.icon {
	justify-content: start;
	gap: 0.5rem;
}
/* li p */
.product_detail .detail_wrapper .right .icon li p {
	display: inline-block;
	color: #fff;
	font-weight: 900;
	background-color: var(--color-primary);
	border-radius: 20px;
	padding: 0.3rem 0.8rem;
}
/* アイコンの色 */
.product_detail .detail_wrapper .right .icon li:nth-of-type(1) p { background-color: var(--color-secondary); }
.product_detail .detail_wrapper .right .icon li:last-child p { color: #333; background-color: #ccc; }

/* 見出し・文章
----------*/
/* h2 */
.product_detail .detail_wrapper .right h2 {
	margin-top: 1.2rem;
}
/* h2 + p */
.product_detail .detail_wrapper .right h2 + p {
	margin-top: 0.8rem;
}
/* 商品スペック .spec
----------*/
/* h3 + table */
.detail_wrapper .right h3 + table {
	margin-top: 0.5rem;
}
/*  table th */
.detail_wrapper .right table th {
	width: 30%;
}
.detail_wrapper .right table td {
	width: calc(100% - 30%);
	font-size: 1rem;
}

/* 金額 .price
----------*/
/* td */
.detail_wrapper .right .price td {
	font-size: 1.1rem;
	font-weight: 700;
}
/* td span */
.detail_wrapper .right .price td span {
	font-size: 0.9rem;
}
/* td span.tax */
.detail_wrapper .right .price td span.tax {
	font-weight: 400;
}

/* テンプレートダウンロード.dl_btn　、お見積りはこちら .cmn_btn
----------*/
/* a.cmn_btn */
.detail_wrapper a.dl_btn,
.detail_wrapper a.cmn_btn {
	margin-top: 2rem;
}

/* 相互リンク .other_products
--------------------------------*/
/* 見出し・文章
---------------------*/
/* h3 */
.product_detail .other_products h3 {
	border-bottom: 1px dashed var(--color-border1); /* 上の打ち消し */
}
/* リスト
---------------------*/
/* ul */
.other_products ul {
	gap: 1rem 2.333%;
	margin-top: 1.5rem;
}
/* ul::after */
.other_products ul::after {
	content: "";
	display: block;
	width: calc((100% - 2.333%*2)/3);
}
/* li */
.other_products li {
	flex-basis: calc((100% - 2.333%*2)/3);
}
/* アンカー
---------------------*/
/* a */
.other_products li a,
.other_products li.current {
	position: relative;
	display: block;
	width: 100%;
	color: var(--color-primary);
	font-weight: 700;
	text-align: center;
	line-height: 1;
	transition: all 0.3s; /* ゆっくり戻すため記述 */
	background-color: var(--color-primary10);
	border: 1px solid var(--color-primary);
	border-radius: 3px;
	padding: 1rem;
	user-select: none;
}
/* a:hover */
.other_products li a:hover {
	transition: all 0.3s; /* ゆっくり戻すため記述 */
	background-color: var(--color-primary30);
}
/* a::after */
.other_products li a::after {
	position: absolute;
	content: url(https://rollupbanner.tenjikai-professional.com/wp/wp-content/uploads/cmn_btn_icon_arrow_blue.png);
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
}
/* a:hover */
.other_products li a span {
	margin-left: -1rem;
}
/* current */
.other_products li.current {
	background-color: transparent;
}

/* エコロールスクリーンバナーZERO　.eco-zelo
-------------------------------------------*/
/* 商品内容 
--------------------------------*/
/* 右（詳細） .right
---------------------*/
/* 商品スペック .spec
----------*/
/* td */
.eco-zero .detail_wrapper .right table tr td {
	width: calc((100% - 30%)/3);
	word-break: break-all;
}
.eco-zero .detail_wrapper .right .price table tr:nth-of-type(1) td {
	font-weight: 400;
}
.eco-zero .detail_wrapper .right .price table tr td span.tax {
	display: block;
	text-indent: -0.7em;
}

/* ロールスクリーンバナーEX　.ex
-------------------------------------------*/
/* 商品内容 
--------------------------------*/
/* 右（詳細） .right
---------------------*/
/* アイコン
----------*/
/* アイコンの色 */
.product_detail.ex .detail_wrapper .right .icon li:last-child p { color: #fff; background-color: var(--color-accent2); } /* 上の打ち消し */

/* ホエールロールスクリーンバナー　.whale
-------------------------------------------*/
/* 商品内容 
--------------------------------*/
/* 右（詳細） .right
---------------------*/
/* 商品スペック .spec
----------*/
/* td */
.whale .detail_wrapper .right table tr td {
	width: calc((100% - 30%)/2);
	word-break: break-all;
}

.whale .detail_wrapper .right .price table tr:nth-of-type(1) td {
	font-weight: 400;
}
.whale .detail_wrapper .right .price table tr td span.tax {
	display: block;
	text-indent: -0.7em;
}