﻿
/*!
 * ZOZOTOWN
 * http://zozo.jp/
 *
 * 2016.10.27: こだわり条件選択パネルのスタイル修正
 * 2016.10.25: こだわり条件のナビパネル内のスタイルを調整
 * 2016.10.14: 身長の絞込みスタイルの追加
 * 2016.09.28: モーダル閉じるアイコンのスタイルを修正
 * 2016.09.28: インプットのスタイルを修正
 * 2016.09.28: v16
 * 2016.07.28: 「こだわりサイズ」ラベルの位置修正
 */



/* --------------------------------
	override
-------------------------------- */

.formItem [class*="arw_"]:after { right:-10px;}*
#formDisp .decorateForm label span.radio:after { margin:0 6px 0 0; }
#gFooter #gPageTop.topPage { background:#fff; }


/* --------------------------------
	こだわり検索
-------------------------------- */

.detailSearch #pageTitle { border-bottom:none; padding:16px 0; }
.detailSearch #pageTitle h1 { font-size:19px; text-align:center; }
.detailSearch .formItem { background:#fff; }
.detailSearch #feelingSearch { padding:25px 16px 15px 16px; }
.detailSearch #feelingSearch p { display:inline-block; vertical-align:middle; }
.detailSearch #feelingSearch p:first-child { margin:0 5px 0 0; }
.detailSearch #feelingSearch input { width:192px; }
.detailSearch #feelingSearch .btnBlueM { width:84px; }
.detailSearch #dispCtrl { display:none; }
.detailSearch .formItem { border-top:1px solid #f3f3f3; border-bottom:none; }
.detailSearch #formSearch.hide { display:block; }

.detailSearch .searchAccInner { height:0; overflow:hidden; }
.detailSearch .searchAccInner.open { height:auto; overflow:auto; }
.detailSearch .searchTrigger { padding:16px 16px 14px; text-align:center; font-size:14px; border-bottom:1px solid #dcdcdc; border-top:1px solid #dcdcdc; }

/*#frmShopTag,
#frmBrandTag { padding:18px 16px 17px; }*/
#frmShopTag #s_title p { word-break:break-all; padding:0 0 5px 0; }
#frmShopTag #s_title p:last-child { padding:0; }


/* --------------------------------
	フォーム連動アラート
-------------------------------- */

.formItem select.err,
.formItem input.err { background:#feedf7; color:#5a5a5a!important; border-color:#E83656; }
.formItem .error { padding:0 0 10px 0; color:#ee0000; }
.formItem .errTxt { position:absolute; display:none; padding:5px 8px 4px 8px; max-width:80%; height:auto!important; border:#e83656 solid 1px!important; border-radius:3px; background:#ffffff; color:#e83656; font-size:10px; }
.formItem .errTxt:after { position:absolute; bottom:-5px; left:10px; border-top:6px solid #FFF; border-right:3px solid transparent; border-left:3px solid transparent; content:''; }
.formItem .errTxt:before { position:absolute; bottom:-7px; left:10px; border-top:6px solid #e83656; border-right:3px solid transparent; border-left:3px solid transparent; content:''; }

.errMsg { font-size:14px; }
.errMsg p.drtErr { padding:0 10px 5px 10px; }
.errMsg p.drtErr:last-child { padding-bottom:10px; }


/* --------------------------------
	こだわり検索 moveボタン
-------------------------------- */

.detailSearch #moveCtrlBtn { display:none; }
.detailSearch #searchBtnWrap.fixed { position:fixed; height:90px; width:100%; z-index:997; bottom:0px; display:block; border-top:1px solid #dcdcdc; }
.detailSearch #searchBtnWrap .btnBg { height:90px;  z-index:998; left:0; top:0; position:absolute; width:100%; background:#fff;  }
.detailSearch #searchBtnWrap .frmBtnArea { position:relative; background:none; }



/* --------------------------------
	さらに絞り込む
-------------------------------- */

/*絞込みフォーム 共通*/
.formItem { /*background:#fafafa; border-bottom:1px solid #f3f3f3;*/ }
.formItem dl { display:table; width:100%; padding:12px 10px 12px; border-bottom:1px solid #f3f3f3; box-sizing:border-box; }
.formItem dl.displayTypeText { padding-top:16px; padding-bottom:16px; }
.formItem dl.bg { background:#f0f0f0; }
.formItem dl dt { display:table-cell; width:41%; font-size:14px; vertical-align:middle; }
.formItem dl dt span.info { color:#888888; display:block; margin:-3px 0 0 0; font-size:10px; }
.formItem dl dd { display:table-cell;  font-size:14px; }
.formItem dl dd a { color:#3c3c3c; }

.formItem .pricep,
.formItem .pricep { font-size:14px; padding:0 0 0 3px; }
.formItem .arw_bl_01 { display:block; padding:5px 0; }
.formItem .frmBtnArea { padding:16px 0; }
.formItem .btn { padding:0 16px; }

.formItem input[type="number"] { width:58px; }

@media (min-width:374px) {
	.formItem input[type="number"] { width:75px; }
}

@media (min-width:413px) {
	.formItem input[type="number"] { width:85px; }
}

.seachForm .ttl{ font-size: 16px; padding: 16px 12px 8px; }
.seachForm { border-bottom:1px solid #e9e9e9; }

/*表示切替新デザイン*/
#formDispLink{}
#formDispLink li{ float:left; width:50%; border-top:solid 1px #f3f3f3; box-sizing:border-box; -webkit-box-sizing:border-box; }
#formDispLink li:nth-child(even){ border-right:none; border-left:solid 1px #f3f3f3; }
#formDispLink li a{ display:block; padding:20px 12px 19px; font-size:14px; }
#formDispLink li .selected{ color:#666666; background:#f8f8f8; }

/*表示切替*/
#formDisp {}
#formDisp .ico_viewGrid:before { vertical-align:-8px; }
#formDisp .ico_viewList:before { vertical-align:-8px; }

#formDisp .formItem { padding:10px 16px 16px; }
#formDisp .formItem dl { border-bottom:none; padding:0 0 14px; }
#formDisp .formItem dl dt { width:81px; vertical-align:sub; }
#formDisp .formItem dl dd { width:auto; }
#formDisp .formItem #frmDispChange dd p { float:left }
#formDisp .formItem #frmDispChange dd label:first-child { margin:0 6px 0 0; }
#formDisp .formItem #frmDispChange dd p span {vertical-align:-3px; }
#formDisp .formItem .frmBtnArea { padding:0; }
#formDisp .formItem .frmBtnArea .btnBlueM { padding:11px 0; }

/*検索絞込*/
#formSearch { position:relative; }
#formSearch .ttl{ display:none; }
#formSearch .formItem dl dd p { width:90%; overflow:hidden; text-overflow:ellipsis;  line-height:1.1;/*font-family:helvetica;*/ }
#ss_title,
#fb_title,
#b_title,
#fs_title,
#uc_title { line-height:1.4; }
#ss_select a,
#uc_select a{ padding:0; }

/*.formItem 個別スタイル*/
.formItem dl#frmDispChange { padding:0 0 10px; }
.formItem dl#frmDispChange dt { width:78px; }
.formItem dl#frmDispOrder { padding:0 0 16px; }

#frmDispOrder { background:#fff; }
#frmDispOrder > ul { margin-top:-1px; }

.formItem #DispSubSearch { display:none; }
.formItem #DispSubSearch dl dd,
.formItem #DispUsedCondition dl dd,
.formItem #fshopTag dt,
.formItem #fbrandTag dt,
.formItem #sizeSearch dt { line-height:1.4; vertical-align:middle; }
.formItem #fshopTag dt span,
.formItem #fbrandTag dt span { display:inline-block; }
.formItem #fshopTag dd,
.formItem #fbrandTag dd { vertical-align:middle; }
.formItem #frmShopTag dt,
.formItem #DispUsedCondition dt,
.formItem #DispSubSearch dt{ vertical-align:top; }


/*サイズ絞込み展開*/

.formItem #category-cell { background:#f8f8f8; }
.formItem #DispSubCate { background:#f8f8f8; }
.formItem #sizeSearch { display:none; background:#f8f8f8; width:100%; height:auto; }
.formItem #sizeSearch > dl { /*padding:12px 0 12px 10px;*/ }
.formItem #sizeSearch dt { vertical-align:top; }
.formItem #sizeSearch dd {  }
.formItem #sizeSearch .content { vertical-align:middle;}
.formItem #sizeSearch dl#sizeInput { display:table; border-bottom:none; padding:0; }
.formItem #sizeSearch dl#sizeInput dt:first-child { margin:0; }
.formItem #sizeSearch dl#sizeInput dt { display:block; margin:5px 0 0 0; color:#888888; font-size:12px; }
.formItem #sizeSearch dl#sizeInput dd { display:block; padding:3px 0 10px 0; border-bottom:1px solid #f3f3f3; width:150%; }
.formItem #sizeSearch dl#sizeInput dd span { font-size:12px; margin:0; }
.formItem #sizeSearch dl#sizeInput dd:last-child { border-bottom:none; padding-bottom:0; }
.formItem #sizeSearch dl#sizeInput dd input{  margin:0 5px 0 0; }
.formItem #sizeSearch p.disabledMsg { font-size:12px; color:#808080; width:auto; padding:18px 0 18px 0; }
.android.legacy .formItem #sizeSearch p.disabledMsg { margin:0 16px 0 0; }


/*身長の絞込み*/
#frmheightSearch .formControl { margin:0 2px 0 0; }
#frmheightSearch .formControl:first-child + .formControlLabel { margin-right:2px; }
#frmheightSearch .formControlLabel { font-size:12px; margin:0; }


/*ボタン二個並び*/
/*.btnDbl { text-align:center; width:100%; padding:20px 0; }
.btnDbl p:first-child { padding:0 8px 0 0; }
.btnDbl .btnWrap { display:inline-block; vertical-align:middle; border:none; }
.btnDbl .btnBlueM { width:181px; padding:10px 0 10px; font-size:16px; border:1px solid #2490d0; }*/


/* --------------------------------
	スライドパネル
-------------------------------- */
.panelContent { padding-bottom:80px; }

/* カテゴリ */
.panelContent #categorySelect{ margin-top:0; }
.panelContent #categorySelect .indexTable{ margin-top:0; }
.panelContent #categorySelect .indexTable .indexList .accordionItem:first-child::before{ border-top:none; }

/* こだわり条件 */
.panelContent #tagList { margin-top:-1px; }
.panelContent #tagList li label{ padding:12px 15px 13px 5px; display:block; }
.panelContent #tagList li .txt{ vertical-align: 2px; }
.panelContent #tagList .titGrayBelt{  }

/* ショップ一覧 */
.panelContent #shopList #selectRemove{ float:right; }


/* こだわり条件 */
#DispUsedConditionlist { margin-top:-1px; }
.panelContent #usedcondlist .gridContainer{ position:fixed; bottom:0; width:100%; margin:0; padding:0 10px; z-index:100; background:#ffffff; }
.panelContent #usedcondlist li label{ padding:12px 15px 13px 8px; display:block; }
.panelContent #usedcondlist li .txt{ vertical-align: 2px; }


/* --------------------------------
	オーバーレイ
-------------------------------- */
.popWin .popHeader h2 { float:none; text-align:center; font-size:19px; padding:15px 0; }
.popWin .popHeader .close { position:absolute; top:-12px; right:-12px; float:none; padding:0; width:26px; height:26px; border-radius:50%; cursor:pointer; z-index:1; background:#f3f3f3; }
.popWin .ico_close:after { position:absolute; top:4px; right:0; left:3px; bottom:0; margin:auto; width:24px; height:24px; vertical-align:middle; font-size:20px; color:#888888; }

.ol_content { padding:0 16px 40px 16px; }

/*検索条件保存*/
/*.popWin .popHeader h2 { padding:12px 0 10px 16px; }
.popWin .popHeader .close { padding:8px 8px 0 0; }*/
#searchOverlay .popWin .popHeader h2 { padding:35px 0 0 16px; }
#searchOverlay .popBody { border-top:none; padding:0 16px 18px; }
#searchOverlay .popBody .txt { font-size:14px; color:#808080; padding:0 0 10px 0; }
#searchOverlay .popBody input { border:1px solid #d2d2d2; color:#808080; font-size:10px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }
#searchOverlay .popBody .add_Btn { margin:18px 0 0 0; }

/*こだわり条件*/
#DispSubSearchlist #menu_list.searchlist ul.linkList label { display:block }
#DispSubSearchlist #menu_list.searchlist ul.linkList li { padding:6px 12px 8px; }
#DispSubSearchlist #menu_list.searchlist ul.linkList li.titGrayBelt { border-bottom:none; padding:4px 16px 3px; }
#DispSubSearchlist #menu_list.searchlist ul.linkList li span.txt { font-size:16px; }
#DispSubSearchlist #menu_list.searchlist .navAction { padding:10px 0; margin:0; }

/*USEDコンディション*/
#DispUsedConditionlist #menu_list.searchlist ul.linkList label { display:block }
#DispUsedConditionlist #menu_list.searchlist ul.linkList li { padding:6px 12px 8px; }
#DispUsedConditionlist #menu_list.searchlist ul.linkList li.titGrayBelt { border-bottom:none; padding:4px 16px 3px; }
#DispUsedConditionlist #menu_list.searchlist ul.linkList li span.txt { font-size:16px; }
#DispUsedConditionlist #menu_list.searchlist .navAction { padding:10px 0; margin:0; }

/*ショップ一覧*/
#DispShoplist .slideDown {  margin-bottom:20px; border-top:1px solid #f3f3f3;}
#DispShoplist .slideDown .slideBtn{ box-shadow:none; }




/* --------------------------------
	オーバーレイ 共通 こだわり検索 shoplist_temp,bandlist_temp
-------------------------------- */

/*ページタイトル*/
.searchPopList .popHeader .count { font-size:12px; color:#808080; display:block; margin:-3px 0 0 30px; }
.searchPopList .linkList { border-top:none; border-bottom:none; }
.searchPopList #nohit { padding:15px 16px; border-top:1px solid #dfdfdf; }
/*.searchPopList .titGrayBelt { padding:2px 16px; line-height:20px; }*/
.searchPopList .btnWrap { padding:15px 0; border-top:1px solid #dfdfdf; }

#selectedShopList h3#selectedShop a { float:right; }
#selectedShopList .slidedownW .container { height:190px; }

.slidedownW #slideBtnWS { position:absolute; bottom:0px; left:0; z-index:1; width:100%; height:40px; background:#fff; -webkit-box-shadow:1px -1px 20px 0px rgba(255,255,255,1); box-shadow: 0px -5px 20px 0px rgba(255,255,255,1); }
.slidedownW.open #slideBtnWS { -webkit-box-shadow:none; box-shadow:none; }
.slidedownW #slideBtnWS a { display:block; padding:10px 0 10px 0;  }
.slidedownW #slideBtnWS a:after { top:20px; right:45%; }
.searchPopList #slideBtnWS { text-align:center; }
.searchPopList #slideBtnWS span { margin:0 28px 5px 0; }
.searchPopList #slideBtnWS a { color:#808080; }
.searchPopList #slideBtnWS [class*="arw_bl"]::after { color: #808080; }
.searchPopList .hide { display:none; }



/*-------------------------------------
	クイックサーチ
-------------------------------------*/

#freeWordSearch { padding:14px 16px 16px 16px; }
#freeWordSearch input { width:100%; }
#quick .ico_search { display:block; position:relative; }
#quick .ico_search:before { font-size:20px; left:15px; margin-top:-10px; position:absolute; top:50%; }
.android.legacy #quick .ico_search:before { top:50%; left:13px; }
#quick .ico_search input[type="search"] { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; height:38px; padding:11px 8px 5px 2px; text-indent:27px; width:100%; }
#quick span.focus input[type="search"] { text-indent:0; }
.android.modern.safari #quick .ico_search:before { vertical-align:5px; }
.android.modern.safari #quick input[type="search"] { height:40px; padding:0 0 0px 30px; line-height:0; }
.android.modern.safari #quick span.focus input[type="search"] { padding-left:10px; }


/*タイプ選択*/
.searchPopList #selectType { padding:14px 16px 4px 16px; border-top:1px #DCDCDC solid; }
.searchPopList #selectType dl { display:table; width:100%; padding:0 0 10px 0;}
.searchPopList #selectType dt { display:table-cell; width:59px; vertical-align:middle; }
.searchPopList #selectType dd { display:table-cell; }
.searchPopList #selectType dd select { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; padding:0 0 0 8px; width:100%; font-weight:normal;}
.searchPopList #selectType #freeWordSearch { margin:5px 0 0 0; }


/*-------------------------------------
	該当キーワードなし
-------------------------------------*/

#noData p { font-size:14px; padding:15px 16px; }



/* --------------------------------
	ページャ override
-------------------------------- */

.searchPopList #pagerBottom { border-top:1px solid #dcdcdc; }

.searchPopList #pagerBottom .pager { border-bottom:none;  }
.searchPopList #pagerBottom .wrap { display:table; width:100%; height:100%; box-sizing:border-box; -webkit-box-sizing:border-box; }

.searchPopList #pagerBottom .wrap > .prev,
.searchPopList #pagerBottom .wrap > .next { display:table-cell; width:50%; border:none; }

.searchPopList #pagerBottom .wrap > .prev > a,
.searchPopList #pagerBottom .wrap > .next > a { margin:0; padding:26px 0 27px; }

.searchPopList #pagerBottom .wrap > .prev > a.arw_prev:before { left:5px; }

.searchPopList #pagerBottom .wrap > .prev > a > span { vertical-align:middle; display:block; position:absolute; left:40px; top:50%; margin-top:-6px; }
.searchPopList #pagerBottom .wrap > .next > a > span { vertical-align:middle; display:block; position:absolute; right:40px; top:50%; margin-top:-6px; }
