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

/* =========================================================
　詳細検索
========================================================= */

/* ----- ポップアップ説明ボタン ----- */

td.search_guide span{
margin:0 4px 4px 0;
}

td.search_guide span a{
color:#666;
font-size: 11px;
text-decoration: none;
padding: 0 6px;
height: 16px;
line-height: 16px;
border: 1px solid #ccc;
background: #fafafa;
}

td.search_guide ul li a:hover{ color:#663399; text-decoration:underline;}

/* ----- ポップアップガイド ----- */

.popup_box{
display:none;
position:absolute;
width:340px;
color:#333;
border:1px solid #536280;
background:#fff;
filter:progid:DXImageTransform.microsoft.dropshadow(color=#999999,offx=3 offy=2,positive=1);
z-index:500;
}

.popup_title{
position:relative;
color:#fff;
font-weight:bold;
padding: 6px 10px;
background-color:#607194;
}

p.popup_close_button{
position:absolute;
top:6px;
right:6px;
width:13px;
height:13px;
z-index: 1000;
}

p.popup_close_button a{
display:block;
text-indent:-9999px;
width:13px;
height:13px;
font-size:12px;
cursor:pointer;
background:url("../images/web/home/icon_setting_shut.gif") left bottom no-repeat;
}

.popup_body{ padding:0 10px 10px;}

.popup_body strong{
display:block;
color:#333;
font-size:12px;
margin:10px 0 5px;
}

.popup_body p{
font-size:11px;
line-height:1.4;
margin:0 0 5px;
}
	
p.keyword_example{
line-height:1.5;
padding:5px 10px 10px;
margin:0;
background:#f2f2f2;
}



/* 左カラム設置-マイジャンルって何？-
--------------------------------------------------------- */
div.how_mygenre {
display: block;  
width: 148px;  
height: 72px;  
background: url(../images/web/home/bn_how_mygenre.png) no-repeat;  
/* margin: 5px auto; */
position: relative;
cursor: pointer;
}

p.my_genre_reg_btm.mt10 a {text-decoration: underline !important;}

div.mygenre_chara01.how {position:relative;width: 340px;/* margin: 0 auto; */}

p.borderbtm_dot {border-bottom: 1px #cccccc dotted; padding-top: 5px;}

.pb10 {padding-bottom: 10px !important;}

div.mygenre_chara01.how p.attn{top: 20px;left: 150px;}

div.mygenre_chara01.how a.popup_mygenre_regist {top: 50px;left: 130px;}

div.mygenre_chara01.how p.my_genre_reg_btm {position: absolute;top: 110px;left: 140px;}



/* ----- 検索条件table ----- */

table.noline_table{
table-layout:fixed;
border-collapse:separate;
width:753px;
font-size:12px;
margin-left:20px;
border-left:1px solid #536280;
border-right:1px solid #536280;
background:#fff;
}

table.border_ts{
border-color:#536280;
}

table.noline_table th,
table.noline_table td{
padding:5px 10px;
line-height:1.2;
}

table.noline_table tr.start th,
table.noline_table tr.start td{
padding-top:10px;
}

table.noline_table tr.end th,
table.noline_table tr.end td{
padding-bottom:10px;
}

table.noline_table th.left_search{
width:100px;
color:#fff;
font-size:12px;
font-weight:bold;
padding-right:0;
background:#607194;
}

table.noline_table th.left_search span{
font-size:11px;
font-weight:normal;
padding-left:3px;
}

table.noline_table td.search_guide{
width:220px;
color:#666;
line-height:1.5;
vertical-align:top;
background:#f0f2f7;
}

div.other_option ul.search_list_row li img{
vertical-align:middle;
}

table.noline_table input.search_detail_btn{
display:block;
text-indent:-9999px;
cursor:pointer;
width:50px;
height:20px;
float:left;
vertical-align:middle;
margin-left:7px;
border:0;
background:url(../images/web/home/btn_search.png) no-repeat left top;
}

table.open_table{
table-layout:fixed;
border-collapse:separate;
width:753px;
font-size:12px;
padding-bottom:3px;
margin-left:20px;
margin-bottom:15px;
border:1px solid #536280;
background:#f0f2f7;
}

table.open_table th{
color:#FFFFFF;
font-weight:bold;
vertical-align:top;
padding:7px 10px;
border-bottom:1px solid #536280;
background:#607194;
}

div.contain_check {
height:20px;
padding:10px 20px;
margin:-25px 0 30px 0; 
border-bottom:1px dotted #536280;
background:#fff;
}

div.other_option{
background:#fff;
padding:5px 15px;
}

div.other_option p{
float:left;
height:15px;
line-height:15px;
color:#536280;
padding-right:5px;
}

/* ----- ラジオボタン、チェックボックス ----- */

ul.search_list_row li{
float:left;
padding-right:15px;
}


/* ----- 検索結果 ----- */

div.search_condition_box{
position:relative;
border:1px solid #536280;
margin-bottom:20px;
}

table.search_condition{
width:100%;
border-collapse:separate;
}

table.search_condition th{
width:100px;
font-weight:bold;
color:#FFFFFF;
line-height:1.6;
background:#607194;
vertical-align:middle;
padding:7px 10px;
}

table.search_condition td{
position:relative;
line-height:1.4;
padding:7px 10px;
background:#fff;
background-color:transparent;
}

table.search_condition td form{padding:10px 0;}

table.search_condition td a.save_search_condition_button{
background:url(../images/web/home/btn_mygenre_02.png) no-repeat 0 0;
display:block;
width:100px;
height:0;
padding:17px 0 0 0;
overflow:hidden;
vertical-align:bottom;
margin-left:17px;
cursor:pointer;
}

table.search_condition td div.save_search_condition_button{
position: relative;
display: inline-block;
height: 15px;
line-height: 15px;
font-size: 10px;
background: #E6EAF2;
color: #4D628C;
border: solid 1px #536280;
padding-right: 5px;
border-radius: 3px;
vertical-align: top;
cursor:pointer;
*background:url(../images/web/home/btn_mygenre.png) no-repeat 0 0;
*padding:17px 0 0 0;
*height: 0;
*width: 100px;
*overflow: hidden;
*border: none;
}

table.search_condition td div.save_search_condition_button:before{
content: "+";
display: inline-block;
font-size: 12px;
height: 15px;
line-height: 15px;
text-align: center;
background: #536280;
vertical-align: top;
color:#fff;
width: 14px;
margin-right: 3px;
}

table.search_condition td.search_condition_2col{
vertical-align:bottom;
width:117px;
padding:0 10px 7px 0;
}

table.search_condition td ul.condition_list li{
display:inline;
padding-right:20px;
}

table.search_condition td ul.condition_list dl{
font-size:11px;
display:inline;
white-space:nowrap;
}

table.search_condition td ul.condition_list dt{
display:inline;
margin-right:5px;
color:#E58600;
}

table.search_condition td ul.condition_list dd{
color:#333;
display:inline;
}

table.search_condition td ul.condition_list dd.ave_eva{
color:#536280;
}

/* 検索結果にはシェアボタンがないので余白小さく */
div.base_title_br h1{
margin-right:0;
_margin-right:0;
}

/* 検索ワードは改行する可能性あり */
table.search_condition tr td p.to_search_details{
white-space:nowrap;
text-align:right;
}

p.to_search_details a{
color:#003399;
font-size:12px;
padding-left:13px;
background:url(../images/web/home/icon_more.png) left center no-repeat;
}

dd.ave_eva img{
vertical-align:top;
margin:0 3px;
}

div#search_result_list{
margin:10px 0;
}

span.open_list{
background:url(../images/web/home/icon_close.gif) no-repeat center left;
padding-left:17px;
}

/* ----- 画像表示 ----- */

ul#search_result_img_box{
position:relative;
clear:both;
border-top: solid 1px #ccc;
border-left: solid 1px #ccc;
}

li.search_result_img_box_inner{
float:left;
height:275px;
width:124px;
padding: 10px;
border-right: solid 1px #ccc;
border-bottom: solid 1px #ccc;
line-height:1.4;
position: relative;
}

dl.work_img_main{
line-height:1.2;
}

dl.work_img_main dd.search_title{
padding:5px 0 0;
line-height:1.3;
}

dl.work_img_main dd.search_circle{
font-size:11px;
}

dl.work_img_main dt.search_img{
display: block;
width: 100%;
height: 123px;
}

dl.work_img_main dt.search_img a{
display: block;
width: 100%;
height: 100%;
position: relative;
}

dl.work_img_main dt.search_img a img{
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
max-width: 100%;
max-height: 100%;
border: none;
-ms-interpolation-mode: bicubic;
}

dl.work_img_main dd.work_name{
padding:6px 0 0;
min-height:1.4em;
max-height:2.8em;
overflow: hidden;
line-height: 1.4em;
}

dl.work_img_main dd.maker_name{
padding-top:2px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
-webkit-text-overflow: ellipsis;
-o-text-overflow: ellipsis;
}

dl.work_img_main dd.work_price{
padding-bottom:4px;
line-height:1.2;
}

dl.work_img_main dd.worl_genre{
}

/* ----- もっと検索 ----- */

div.search_more{
width:200px;
float:right;
margin:10px 0;
border:1px solid #8f9fbf;
}

div.search_more p{
height:28px;
line-height:28px;
padding:0 10px 0 30px;
border-bottom:1px solid #8f9fbf;
background:url(../images/web/home/icon_genre.gif) 8px 6px no-repeat #f0f2f7;
}

div.search_more ul{
margin:8px 0 6px 17px;
}

div.search_more ul li{
height:22px;
line-height:22px;
padding-left:13px;
background:url(../images/web/home/icon_more.png) left center no-repeat;
}

div.search_more p.to_search_details{
width:auto;
position:static;
text-align:left;
padding-left:17px;
border-top:1px dotted #8f9fbf;
border-bottom:none;
background:none;
}

div.search_more p.to_search_details a{
color:#003399;
padding-left:13px;
background:url(../images/web/home/icon_more.png) left center no-repeat;
}

/* 検索結果が0件の場合 */

div.modify_white_box_main div.search_more{
width:auto;
float:none;
margin:10px 10px 0;
border:none;
}

div.modify_white_box_main div.search_more p{
padding:0 10px 0 30px;
border-bottom:none;
background:url(../images/web/home/icon_genre.gif) 8px 4px no-repeat #fff;
}

div.modify_white_box_main div.search_more p.to_search_details{
height:28px;
line-height:28px;
padding:0 10px 0 17px;
border-top:none;
border-bottom:none;
background-image:none;
}

div.modify_white_box_main p.to_search_details a{
color:#003399;
padding-left:13px;
background:url(../images/web/home/icon_more.png) left center no-repeat;
}


/* 検索のヒント */

div#search_hint{
width:785px;
padding:4px;
border:1px solid #b8c3d9;
background:#e6eaf2;
}

div#search_hint_inner{
padding:15px 30px;
background:#fff;
}

div#search_hint h2#search_hint_title{
font-size:16px;
font-weight:bold;
padding-bottom:5px;
margin:5px 0 15px;
border-bottom:1px solid #b8c3d9;
}

div#search_hint_inner p{
font-size:12px;
line-height:1.5;
margin:0 0 10px;
}

div#search_hint_inner ul{}

div#search_hint_inner ul li{
line-height:1.5;
padding-bottom:15px;
}

div#search_hint_inner li h4{
font-size:13px;
font-weight:bold;
padding:6px 0 4px 8px;
margin-bottom:10px;
border-left:6px solid #b8c3d9;
background:#f0f2f7;
}

div#search_hint_inner li p{
margin:0 15px 10px;
}

div#search_hint_inner li p.search_example{
width:513px;
padding:10px 0 10px 10px;
background-color:#f2f2f2;
}

div#search_hint_inner li p.search_example span{
display:block;
width:493px;
height:21px;
text-indent:-9999px;
}

div#search_hint_inner li p#hint_01 span{ background:url(../images/web/common/pic_search_hint.gif) left top no-repeat;}
div#search_hint_inner li p#hint_02 span{ background:url(../images/web/common/pic_search_hint.gif) left -42px no-repeat;}
div#search_hint_inner li p#hint_03 span{ background:url(../images/web/common/pic_search_hint.gif) left -63px no-repeat;}
div#search_hint_inner li p#hint_04 span{ background:url(../images/web/common/pic_search_hint.gif) left -84px no-repeat;}

div#search_hint_inner table{
width:695px;
font-size:12px;
line-height:1.5;
margin:5px 15px 10px;
}

div#search_hint_inner th,
div#search_hint_inner td{
border:1px solid #b8c3d9;
}

div#search_hint_inner th{
font-size:13px;
padding:5px 0 5px 10px;
background:#f0f2f7;
}

div#search_hint_inner td{
padding:5px 10px;
}

div#search_hint_inner td span{
color:#666;
font-size:11px;
padding-left:5px;
}

div#search_hint_footer{
padding-top:15px;
border-top:1px solid #b8c3d9;
}


/* ==================================================================================================================
　類似画像検索結果
================================================================================================================== */

/* 詳細検索での表示
--------------------------------------------------------- */

td p.similar_link{
padding-top:7px;
}

td p.similar_link a{
outline:none;
/position: relative;
}

td div.similar_list_box{
width:100%;
margin-bottom:10px;
padding-top:10px;
}

td div.similar_list_box ul{
border-top:1px solid #b8c3d9;
padding-top:10px;
padding-left:15px;
}

td div.similar_list_box ul li{
width:20%;
float:left;
/width:19%;
}

td div.similar_list_box ul li p{
padding-top:5px;
}

/* 類似画像検索結果
--------------------------------------------------------- */

div#search_result_similer_box{
margin-right:-15px;
}

ul.search_result_similer_box_inner li{
float:left;
margin:0 15px 0 0;
height:155px;
width:120px;
}

ul.search_result_similer_box_inner li p{
padding-top:5px;
}

div#similer_main_list{
margin-top:-15px;
}

div#similer_main_list div.white_15_box_end{
margin-top:0;
}

div#similer_main_list div.main_liquid_box_inner_2{
padding-top:15px;
border-top:none;
}

div#similer_main_list div.liquid_white_rb_p15{
padding-bottom:0;
}

.save_search_condition_button._popup_open_btn_mygenre_add,
.save_search_condition_button._popup_open_btn_mygenre_add.on {
background: url(../images/web/home/btn_mygenre_02.png) no-repeat 0 0;  
display: block;  
width: 100px;  
/* height: 20px; */  
padding: 17px 0 0 0;  
overflow: hidden;  
vertical-align: bottom;  
margin-left: 17px;  
cursor: pointer;
margin-top: 5px;
}


/* 独占先行
--------------------------------------------------------- */

span.search_link_brandnews{
display:inline-block;
margin-right:15px;
padding-top:3px;
}

span.search_link_brandnews a{
display:inline-block;
background:  url(../images/web/home/icon_more.png) no-repeat left center;
padding-left: 13px;
font-size:12px;
}


/* GW半額キャンペーン用
--------------------------------------------------------- */

input#search_text_mini {
margin: 0 5px 0 0;
font-size: 13px;
width: 80%;
border: 1px solid #666666;
background: #fff;
float: left;
padding: 2px 5px;
}

/* ボックス表示時にボタン
--------------------------------------------------------- */


dl.work_img_main dd.maker_name {
padding-top: 5px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
-webkit-text-overflow: ellipsis;
-o-text-overflow: ellipsis;
}

dl.work_img_main dt.search_img {
display: block;
width: 100%;
height: 123px;
padding-bottom: 5px;
border-bottom: dotted 1px #b8c3d9;
/* margin-bottom: 0; */
}

dl.work_img_main dt.search_img a {
display: block;
width: 100%;
height: 100%;
position: relative;
}

dl.work_img_main dt.search_img a img {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
max-width: 100%;
max-height: 100%;
border: none;
-ms-interpolation-mode: bicubic;
}


li.search_result_img_box_inner dl.work_img_main{line-height:1.2;}


li.search_result_img_box_inner dl dd.work_operation_btn{
position: absolute;
left: 0;
width: 100%;
bottom: 0;
opacity: 0;
filter: alpha( opacity=0 ); /*ie6,ie7*/
-ms-filter: "alpha( opacity=0 )"; /*ie8*/
background: #f0f2f7; /* サービスで差分 */
border-top: 1px dotted #b8c3d9; /* サービスで差分 */
}

li.search_result_img_box_inner:hover dl dd.work_operation_btn{
-webkit-transition: all 0.2s ease 0.5s;
-moz-transition: all 0.2s ease 0.5s;
-ms-transition: all 0.2s ease 0.5s;
-o-transition: all 0.2s ease 0.5s;
transition: all 0.2s ease 0.5s;
opacity: 1;
filter: alpha( opacity=100 ); /*ie6,ie7*/
-ms-filter: "alpha( opacity=100 )"; /*ie8*/
}

li.search_result_img_box_inner:hover dl dd.work_operation_btn div{
padding:0;
}

#search_result_img_box ul.table-ul{
overflow: hidden;
text-align: center;
padding: 5px 0 5px;
}

#search_result_img_box ul.table-ul li{
display: inline-block;
vertical-align: middle;
}

ul#search_result_img_box {
position: relative;
clear: both;
border-top: solid 1px #b8c3d9; /* サービスごとに差分必要 */
border-left: solid 1px #b8c3d9; /* サービスごとに差分必要 */
}


/* カート小、お気に入り小、非表示、持っています */


#search_result_img_box ul.table-ul li a.btn_cart,
#search_result_img_box ul.table-ul li a.btn_cart_in,
#search_result_img_box ul.table-ul li a.btn_favorite,
#search_result_img_box ul.table-ul li a.btn_favorite_in,
#search_result_img_box ul.table-ul li a.btn_dl{
display:inline-block;
width:61px;
overflow:hidden;
height:0;
padding-top: 20px;
line-height: 20px;
background:url(../images/web/home/btn_mini_cart_02.png) no-repeat;
}

#search_result_img_box ul.table-ul li a.btn_cart{ background-position:0 0;}
#search_result_img_box ul.table-ul li a.btn_cart:hover{background-position:0 -20px;}
#search_result_img_box ul.table-ul li a.btn_cart_in{background-position:0 -40px;}
#search_result_img_box ul.table-ul li a.btn_cart_in:hover{ background-position:0 -60px;}

#search_result_img_box ul.table-ul li a.btn_favorite{ background-position:0 -80px;}
#search_result_img_box ul.table-ul li a.btn_favorite:hover{background-position:0 -100px;}
#search_result_img_box ul.table-ul li a.btn_favorite_in{background-position:0 -120px;}
#search_result_img_box ul.table-ul li a.btn_favorite_in:hover{ background-position:0 -140px;}

#search_result_img_box ul.table-ul li a.btn_dl{background-position:0 -160px;}
#search_result_img_box ul.table-ul li a.btn_dl:hover{ background-position:0 -180px;}

/* 既に持っている場合 */
#search_result_img_box ul.table-ul li p.work_already{
position: absolute;
bottom: 27px;
left: 50%;
margin-left: -62px;
}

/* --- ボックス表示時にもDL数・評価数・レビュー数 --- */

dd.work_hyouka_1,
dd.work_hyouka_2,
dd.work_hyouka_3,
dd.work_hyouka_4,
dd.work_hyouka_5,
dd.work_review,
td.work_review{ width:30px; padding-left:0px; padding-top: 25px;}

dd.work_hyouka_1 div{ background:url(../images/web/home/icon_hyouka_01.png) left center no-repeat; height: 16px; padding-top: 5px; display: inline-block;}
dd.work_hyouka_2 div{ background:url(../images/web/home/icon_hyouka_02.png) left center no-repeat; height: 16px; padding-top: 5px; display: inline-block;}
dd.work_hyouka_3 div{ background:url(../images/web/home/icon_hyouka_03.png) left center no-repeat; height: 16px; padding-top: 5px; display: inline-block;}
dd.work_hyouka_4 div{ background:url(../images/web/home/icon_hyouka_04.png) left center no-repeat; height: 16px; padding-top: 5px; display: inline-block;}
dd.work_hyouka_5 div{ background:url(../images/web/home/icon_hyouka_05.png) left center no-repeat; height: 16px; padding-top: 5px; display: inline-block;}
dd.work_review div{ background:url(../images/web/home/icon_review.png) left center no-repeat; height: 16px; padding-top: 5px; display: inline-block;}

td.work_hyouka_1 div{ background:url(../images/web/home/icon_hyouka_01.png) left center no-repeat;}
td.work_hyouka_2 div{ background:url(../images/web/home/icon_hyouka_02.png) left center no-repeat;}
td.work_hyouka_3 div{ background:url(../images/web/home/icon_hyouka_03.png) left center no-repeat;}
td.work_hyouka_4 div{ background:url(../images/web/home/icon_hyouka_04.png) left center no-repeat;}
td.work_hyouka_5 div{ background:url(../images/web/home/icon_hyouka_05.png) left center no-repeat;}
td.work_review div{ background:url(../images/web/home/icon_review.png) left center no-repeat;}