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

/*-----------------------------------------------
 index
-----------------------------------------------*/

/*---------- 種類別おすすめ ----------*/
/*蓋付き*/
#lid .itemHead .textBox:after{
	background-image: url(../../../../_images/category/tumbler/stainless-tumbler/lid_tit_img.webp);
}
/*蓋なし*/
#notlid .itemHead .textBox:after{
	background-image: url(../../../../_images/category/tumbler/stainless-tumbler/notlid_tit_img.webp);
}


/*---------- 容量別おすすめ ----------*/
/*コンパクトサイズ*/
#capacity-small .itemHead .textBox:after{
	background-image: url(../../../../_images/category/tumbler/stainless-tumbler/capacity-small_tit_img.webp);
}
/*スタンダードサイズ*/
#capacity-medium .itemHead .textBox:after{
	background-image: url(../../../../_images/category/tumbler/stainless-tumbler/capacity-medium_tit_img.webp);
}
/*大容量サイズ*/
#capacity-large .itemHead .textBox:after{
	background-image: url(../../../../_images/category/tumbler/stainless-tumbler/capacity-large_tit_img.webp);
}


/*----------二重構造----------*/
.stainless .doubleBox{
	margin-bottom: 50px;
}
.stainless .doubleBox .title{
	min-height: 160px;
	background: url(../../../../_images/category/tumbler/stainless-tumbler/double_structure_img.webp) no-repeat right bottom;
	margin-bottom: 20px;
	padding-right: 430px;
	border-bottom: 4px solid #2964ad;
}
.stainless .doubleBox .title h3{
	font-size: 32px;
	line-height: 1.5em;
	text-shadow: 1px 1px 2px #fff,-1px 1px 2px #fff,1px -1px 2px #fff,-1px -1px 2px #fff;
}
.stainless .doubleBox .title h3 span{
	display: block;
}
.stainless .doubleBox .title h3 .pink{
	color: #ff5d7c;
}
.stainless .doubleBox .title h3 .blue{
	color: #37489f;
}

.stainless .doubleBox dl{
	background: url(../../../../_images/category/tumbler/title_bg_dot.gif) repeat;
	border: 1px solid #2964ad;
	position: relative;
}
.stainless .doubleBox dl dt{
	width: 300px;
	padding: 10px 15px;
	background-color: #2964ad;
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
}
.stainless .doubleBox dl dd{
	background-image: url(../../../../_images/category/tumbler/stainless-tumbler/double_whats_img.gif);
	background-repeat: no-repeat;
	background-position: calc(100% - 30px) 50%;
	min-height: 180px;
	padding: 80px 220px 30px 30px;
}
.stainless .doubleBox dl dd p.red{
	font-size: 12px;
}

@media screen and ( max-width: 736px ){
	/*ステンレス-----------二重構造*/
	.stainless .doubleBox .title{
		background-size: 40% auto;
		min-height: auto;
		padding: 0 2.5%;
	}
	.stainless .doubleBox .title h3{
		font-size: 26px;
		line-height: 1.5em;
	}
	
	.stainless .doubleBox dl{
		margin: 0 2.5%;
	}
	.stainless .doubleBox dl dt img{
		width: auto;
	}
	.stainless .doubleBox dl dd{
		background-size: 130px auto;
		background-position: calc(100% - 20px) 50%;
		min-height: auto;
		padding: 70px 170px 20px 20px;
	}
}
@media screen and ( max-width: 480px ){
	.stainless .doubleBox dl dt{
		position: static;
	}
	.stainless .doubleBox dl dd{
		background-position: center 10px;
		padding: 200px 2% 10px;
	}
}


/*-----------------------------------------------
 stainless-large
-----------------------------------------------*/
.stainless-large .contentHead .h2Box h2:before{ background-image: url(../../../../_images/category/tumbler/stainless-tumbler/large/content_icon.webp);}
.stainless-large .contentHead .headText{ background-image: url(../../../../_images/category/tumbler/stainless-tumbler/large/main_img.webp);}


/*-----------------------------------------------
 stainless-medium
-----------------------------------------------*/
.stainless-medium .contentHead .h2Box h2:before{ background-image: url(../../../../_images/category/tumbler/stainless-tumbler/medium/content_icon.webp);}
.stainless-medium .contentHead .headText{ background-image: url(../../../../_images/category/tumbler/stainless-tumbler/medium/main_img.webp);}


/*-----------------------------------------------
 stainless-small
-----------------------------------------------*/
.stainless-small .contentHead .h2Box h2:before{ background-image: url(../../../../_images/category/tumbler/stainless-tumbler/small/content_icon.webp);}
.stainless-small .contentHead .headText{ background-image: url(../../../../_images/category/tumbler/stainless-tumbler/small/main_img.webp);}