@charset "utf-8";

/*=========================================*/
/* 商品情報検索サイトバナー */
/*=========================================*/


/*-- BANNER --*/

@media screen and (min-width:1281px){

#item_info_search_area{
	position:relative;
	margin:0px auto 0px auto;
	padding:0px 45px 0px 45px;
	max-width:1200px;
	overflow:hidden;
}

#item_info_search_bnr{
	position:relative;
	width:100%;
	background-color:rgba(0,170,235,1.0);
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	text-decoration:none;
	overflow:hidden;
	/* radius */
	-webkit-border-radius:15px;
	   -moz-border-radius:15px;
	        border-radius:15px;
}

.item_info_search_img{
	position:relative;
	width:66.66666%;
}

.item_info_search_img img{
	width:100%;
}

.item_info_search_text{
	position:relative;
	width:33.33333%;
}

.item_info_search_text_flame{
	padding:0px 25px 0px 25px;
}

.item_info_search_catch{
	padding:0px 0px 25px 0px;
	font-size:112.5%;
	line-height:175%;
	color:rgba(255,255,255,1.0);
	text-align:left;
}

#item_info_search_nav{
	position:relative;
	width:220px;
}

.item_info_search_nav_flame{
	position:relative;
	width:100%;
	border:1px solid rgba(255,255,255,1.0);
	box-sizing:border-box;
	transition:0.25s ease-out;
	text-align:right;
	overflow:hidden;
	cursor:pointer;
	/* radius */
	-webkit-border-radius:100px;
	   -moz-border-radius:100px;
	        border-radius:100px;
}

.item_info_search_nav_flame .text{
	float:left;
	position:relative;
	padding:0px 0px 0px 25px;
	font-size:100%;
	line-height:40px;
	letter-spacing:-0.01em;
	color:rgba(255,255,255,1.0);
	font-family:'Quicksand', sans-serif;
	transition:0.25s ease-out;
	z-index:1;
}

#item_info_search_bnr:hover .item_info_search_nav_flame .text{
	color:rgba(0,170,235,1.0);
}

.item_info_search_nav_flame .icon{
	position:relative;
	padding:16px 25px 16px 0px;
	font-size:0px;
	z-index:1;
}

.item_info_search_nav_flame .icon svg{
	width:6px;
	height:8px;
}

.item_info_search_nav_flame .icon path{
	fill:rgba(255,255,255,1.0);
	transition:0.25s ease-out;
}

#item_info_search_bnr:hover .item_info_search_nav_flame .icon path{
	fill:rgba(0,170,235,1.0);
}

.item_info_search_nav_flame::before{
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	width:100%;
	height:100%;
	content:'';
	transform-origin:right top;
	transform:scale(0, 1);
	transition:0.35s transform;
}

.item_info_search_nav_flame::before{
	background-color:rgba(255,255,255,1.0);
}

#item_info_search_bnr:hover .item_info_search_nav_flame::before{
	transform-origin:left top;
	transform:scale(1, 1);
}

}

@media screen and (max-width:1280px){

#item_info_search_area{
	position:relative;
	margin:0px auto 0px auto;
	padding:0px 25px 0px 25px;
	max-width:1200px;
	overflow:hidden;
}

#item_info_search_bnr{
	position:relative;
	width:100%;
	background-color:rgba(0,170,235,1.0);
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	text-decoration:none;
	overflow:hidden;
	/* radius */
	-webkit-border-radius:15px;
	   -moz-border-radius:15px;
	        border-radius:15px;
}

.item_info_search_img{
	position:relative;
	width:66.66666%;
}

.item_info_search_img img{
	width:100%;
}

.item_info_search_text{
	position:relative;
	width:33.33333%;
}

.item_info_search_text_flame{
	padding:0px 25px 0px 25px;
}

.item_info_search_catch{
	padding:0px 0px 20px 0px;
	font-size:100%;
	line-height:175%;
	color:rgba(255,255,255,1.0);
	text-align:left;
}

#item_info_search_nav{
	position:relative;
	width:200px;
}

.item_info_search_nav_flame{
	position:relative;
	width:100%;
	border:1px solid rgba(255,255,255,1.0);
	box-sizing:border-box;
	transition:0.25s ease-out;
	text-align:right;
	overflow:hidden;
	cursor:pointer;
	/* radius */
	-webkit-border-radius:100px;
	   -moz-border-radius:100px;
	        border-radius:100px;
}

.item_info_search_nav_flame .text{
	float:left;
	position:relative;
	padding:0px 0px 0px 25px;
	font-size:93.75%;
	line-height:40px;
	letter-spacing:-0.01em;
	color:rgba(255,255,255,1.0);
	font-family:'Quicksand', sans-serif;
	transition:0.25s ease-out;
	z-index:1;
}

#item_info_search_bnr:hover .item_info_search_nav_flame .text{
	color:rgba(0,170,235,1.0);
}

.item_info_search_nav_flame .icon{
	position:relative;
	padding:16px 25px 16px 0px;
	font-size:0px;
	z-index:1;
}

.item_info_search_nav_flame .icon svg{
	width:6px;
	height:8px;
}

.item_info_search_nav_flame .icon path{
	fill:rgba(255,255,255,1.0);
	transition:0.25s ease-out;
}

#item_info_search_bnr:hover .item_info_search_nav_flame .icon path{
	fill:rgba(0,170,235,1.0);
}

.item_info_search_nav_flame::before{
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	width:100%;
	height:100%;
	content:'';
	transform-origin:right top;
	transform:scale(0, 1);
	transition:0.35s transform;
}

.item_info_search_nav_flame::before{
	background-color:rgba(255,255,255,1.0);
}

#item_info_search_bnr:hover .item_info_search_nav_flame::before{
	transform-origin:left top;
	transform:scale(1, 1);
}

}

@media screen and (max-width:1100px){

#item_info_search_area{
	padding:0px 20px 0px 20px;
}

#item_info_search_bnr{
	/* radius */
	-webkit-border-radius:10px;
	   -moz-border-radius:10px;
	        border-radius:10px;
}

.item_info_search_text_flame{
	padding:0px 20px 0px 20px;
}

.item_info_search_catch{
	font-size:93.75%;
}

#item_info_search_nav{
	width:180px;
}

}

@media screen and (max-width:768px){

#item_info_search_area{
	padding:0px 15px 0px 15px;
}

.item_info_search_img{
	width:100%;
}

.item_info_search_text{
	width:100%;
}

.item_info_search_text_flame{
	padding:15px 25px 15px 25px;
}

.item_info_search_catch{
	padding:0px 0px 15px 0px;
	font-size:93.75%;
}

#item_info_search_nav{
	position:relative;
	margin:0px auto 0px auto;
	width:180px;
}

.item_info_search_nav_flame .text{
	font-size:93.75%;
	line-height:36px;
}

.item_info_search_nav_flame .icon{
	padding:14px 25px 14px 0px;
}

}

@media screen and (max-width:480px){

.item_info_search_catch{
	padding:0px 0px 10px 0px;
	font-size:87.5%;
}

.item_info_search_nav_flame .text{
	font-size:87.5%;
	line-height:32px;
}

.item_info_search_nav_flame .icon{
	padding:12px 25px 12px 0px;
}

}


/*-- PRODUCTS --*/

#top_page_products_area{
	border-top:none;
}

