@charset "utf-8";
/* CSS Document */


/*===================================
タブ切り替え
===================================*/

.tab_wrapper {
    display: flex;
    flex-wrap: wrap;
	width:100%;
    max-width: 1000px;
}

.tab_wrapper > label {
    flex: 1 1;
    order: -1;
    min-width: 70px;
    padding: .7em 1em .5em;
    background-color: #fff;
	border-bottom: 1px solid #ccc;
    color: #999;
    font-weight: 500;
    font-size: 1em;
    text-align: center;
    cursor: pointer;
}

.tab_wrapper > label:hover {
    opacity: 1;
}
.tab_wrapper > label:active {
    opacity: 1;
}

.tab_wrapper input {
    display: none;
}

.tab_wrapper > .tab_contents {
    display: none;
    width: 100%;
    padding: 2em 0;
    background-color: #fff;
	
	font-size: 0.9em;
	font-weight: 400;
	line-height: 1.7;
}

.tab_wrapper label:has(:checked) {
    border-bottom: 3px solid #000000;
    color: #000000;
}

.tab_wrapper label:has(:checked) + .tab_contents {
    display: block;
}

/*上部固定 SP*/
@media screen and (max-width:768px) {
	/*.tab_wrapper > label{
		position: sticky;
		top: 50px;
		z-index: 10;
	}*/
}

/*SP表示*/
@media screen and (max-width:769px) {
	.tab_wrapper > .tab_contents{
		padding: 2em 2vw;
	}
	
	/*▼背景色で囲う場合に使用SET▼*/
	/*.fs-l-productLayout__item--4{
		background: #eee;
		padding: 3em 2vw;
	}
	.tab_wrapper .js_item_tab_01{
		border-radius: 5px 0 0 0;
	}
	.tab_wrapper .js_item_tab_03{
		border-radius: 0 5px 0 0;
	}
	.tab_wrapper > .tab_contents{
		padding: 2em 2vw;
		border-radius: 0 0 5px 5px;
	}
	.tab_wrapper > label{
		padding: 1.5em 1em .5em;	
	}*/
}



/*===================================
中身
===================================*/

/*小さめテキスト*/
.itemtxt_comment{
	font-size: 0.9em;
	color:#666;
	margin-bottom:2em;
}


/*サイズの表*/
/*他EC（楽天）との互換性の関係でtableタグに装飾指定をしているためその上書きも含みます*/
.itemtxt_table_box_size {
   /* overflow-x:auto;*/
   /* display: block;*/
	width:100%;
	/*-webkit-overflow-scrolling: touch;*/
}
.itemtxt_table_box_size table{
	table-layout: fixed;/*横幅均等配分*/
	border-spacing: 0;
	width:auto;
	width:100%;
}
.itemtxt_table_box_size table th,
.itemtxt_table_box_size table td {
    /*white-space: nowrap;*/
	border: 1px solid #ccc;
	padding: 0.5em;
	text-align: center;
}
.itemtxt_table_box_size table th{
	color: #888;
	background-color: #f5f5f5;
	font-weight: 700;
}
.itemtxt_table_box_size table tr:first-child th{
	background-color: #ddd;
}
/*.itemtxt_table_box_size table tr th:first-child{
	width:100%;
	max-width:25%;
}*/

/*SP版スクロール見出し固定*/
@media screen and (max-width:769px) {
	.itemtxt_table_box_size table tr:first-child th{
		/* 横スクロール時に固定する */
		position: -webkit-sticky;
		position: sticky;
		top: 55px;
		/* ヘッダー行内の他のセルより手前に表示する */
		z-index: 10;
	}
}

/* スクロールバー全体を対象にする */
.itemtxt_table_box_size::-webkit-scrollbar {
    width: 10px; /* スクロールバーの幅 */
    height: 10px; /* スクロールバーの高さ */
}
/* スクロールバーの背景部分をカスタマイズ */
.itemtxt_table_box_size::-webkit-scrollbar-track {
    background: #f1f1f1; /* スクロールバーの背景色 */
    border-radius: 5px; /* 角丸にする */
}
/* スクロールバーの操作部分をカスタマイズ */
.itemtxt_table_box_size::-webkit-scrollbar-thumb {
    background: #888; /* スクロールバーの操作部分の背景色 */
    border-radius: 5px; /* 角丸にする */
}
/* スクロールバーの操作部分にホバーした時のスタイル */
.itemtxt_table_box_size::-webkit-scrollbar-thumb:hover {
    background: #555; /* ホバー時のスクロールバーの操作部分の背景色 */
}



/*詳細表*/
/*他EC（楽天）との互換性の関係でtableタグに装飾指定をしているためその上書きも含みます*/
.itemtxt_table_box{
	width:100%;
	background-color: #f5f5f5;
	border-radius: 5px;
	margin-top: 3em;
}
.itemtxt_table_box table{
	/*table設定打消し*/
	background-color: transparent;
	width:100%;

	padding:10px;
	border-spacing: 0;
}
.itemtxt_table_box table th,
.itemtxt_table_box table td {
	/*table設定打消し*/
	border: none;

	padding: 5px;
	text-align: left;
}
.itemtxt_table_box table th{
	/*table設定打消し*/
	background-color: transparent;
	
	font-weight: 600;
	padding-top:15px;
	padding-bottom:5px;
	font-size:0.9em;
	color: #aaa;
}
.itemtxt_table_box table tr:first-child th{
	padding-top:10px;
}
.itemtxt_table_box table td {
	border-bottom: 1px solid #ccc;
	padding-top:0;
	padding-bottom:15px;
}
.itemtxt_table_box table tr:last-child td{
	border:none;
}


/*説明文内のリンクの書式*/
.tab_contents a{
	text-decoration: underline;
}

/*ガイドリンクエリア（サイズ・詳細タブ下部）*/
.js_item_guidelink{
	display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
	
	width:100%;
	margin: 1em auto 0;
}
.js_item_guidelink_item:first-child::before{/*アイコン*/
	content: "";
	vertical-align: -0.25em;
	display: inline-block;
	width: 1.3em;
	height: 1.3em;
	background: url(https://shirai.itembox.design/item/common/itempage/img/icon_information.svg?timestamp=250507) no-repeat;
	background-size: contain;
	margin-right: 0.6em;
}
.js_item_guidelink_item:nth-child(n+2)::before{/*区切り線*/
	content: "|";
	margin: 0 0.5em; 
}

