@charset "utf-8";

body.compare .breadcrumb { margin-bottom: 10px; }
body.compare #main { position: relative; }
body.co_rimpare #mainInner { min-width: 960px; width: 90%; }
@media screen and (max-width:960px) { body.compare #mainInner { min-width: 600px; } }

body.compare #sideL { width: 216px; display: inline; float: left; margin-right: -216px; background: #fff; position: relative; }
body.compare #cont { width: 100%; float: right; margin-bottom: 70px; }
body.compare #gnav.notTrans.active { z-index: 306; background:#fff; }

.titType01 { width: 960px; margin: 0 auto; }
.coverL { position:absolute; width:50px; height:102%; left:-35px; top:-2%; background:url(/compare/images/bg_left.png) right; z-index:30; pointer-events:none; }
.coverR { position:absolute; width:30px; height:102%; right:0; top:-2%; background:url(/compare/images/bg_right.png) left; z-index:30; pointer-events:none; }
.coverR2 { position:absolute; height:100%; left:100%; top:0; background:url(/compare/images/bg_right.png) left; z-index:30; pointer-events:none; }

#sideL .itemBox { margin-bottom:28px; }
.emptyBox { display:none; position:fixed; top:0; width:216px; background:url(/compare/images/bg_left.png) right; z-index:305; }
#sideL .allDel{ position: absolute;top: 5px;right: 117px; cursor: pointer; z-index: 2;padding-right: 27px;font-size: 127%;}
#sideL .allDel span{ width: 14px;height: 14px; background: url(/compare/images/close_btn.png) left top no-repeat;text-indent: -9999px; display: block;position: absolute;bottom: 5px;right: 0;}
#sideL .allDel:hover{ color: #ff0000;}
#sideL .allDel:hover span{background-position: left bottom;}
.fixed .emptyBox { display:block; top: 33px;}
#sideL .emptyBox .allDel{top: 37px;}
.andMore { text-align: right; position: relative; z-index: 50; margin: 0 30px 15px 0; }
.andMore a { display: inline-block; position:relative; line-height: 1.34; font-size: 105.7%; padding-left: 1.5em; }
.andMore a:before { content:""; display: block; width:10px; height:16px; position:absolute; left:0; top:0px; background: url(/common/images/arrow_right.png) no-repeat left top; }
.andMore a:hover:before { background-position:left bottom; }
img.icon02 { width: 16px; }
img.iconClassVideo { width: 24px; }
img.iconClass10 { width: 58px;}
p.spText img { display: inline; margin: 5px 10px;}
/* =========================================================
fieldList
========================================================= */
.fieldList ul { position: relative; z-index: 300;}
.fieldList ul li { font-size: 157.1%; padding: 20px 0 19px; line-height: 150%; }
.fieldList ul li sup { font-size: 10px; }


/* =========================================================
itemListWrap
========================================================= */
.itemListWrap { position: relative; margin-left:216px; }
.itemListWrap .itemBoxListWrap { margin-top:-20px; }
.itemListWrap .itemBoxList { padding-top: 13px; }
.fixed .itemListWrap .itemBoxList { position:fixed; top:24px; padding-top:13px; z-index: 20; background:url(/compare/images/bg_bottom.png) bottom; }
.itemListWrap .itemList { max-width:100%; position: relative; }
.itemListWrap .slides { width:10000px; }
.itemListWrap .slides>li { width: 235px !important; display: inline; float: left; margin-right: 4px; position: relative; }
.itemListWrap .slides li.last { margin-right: 0; }
.itemListWrap .slides li>div { word-wrap:break-word; overflow-wrap:break-word; padding: 28px 16px 19px; }
.itemListWrap .slides li .itemBox { background: #fff; width: 235px; padding: 0; text-align: center; margin-bottom: 29px; box-shadow:-5px -3px 29px rgba(0,0,0,0.2); }
.itemListWrap .slides li .itemBox .itemboxWrap { padding: 11px 0 10px 0px; position: relative; }
.itemListWrap .slides li .itemBox .close { position: absolute; right: 13px; top: 10px; cursor: pointer; display: none; width: 14px; height: 14px; background: url(/compare/images/close_btn.png) left top no-repeat; }
.itemListWrap .slides li .itemBox:hover .close { display: block; z-index: 50; }
.itemListWrap .slides li .itemBox .close:hover { background-position: left bottom; }

.itemListWrap .slides li .itemBox .itemImg { display: table-cell; width: 229px; height: 75px; vertical-align: middle; text-align: center; margin-bottom: 8px; padding: 0 0 0 8px;}
.itemListWrap .slides li .itemBox .itemImg img { display: inline; margin: 0 auto; max-width: 56px; max-height: 75px;}
.itemListWrap .slides li .itemBox .itemName { font-size: 114.2%; margin-top: 5px;}
.itemListWrap .slides li .itemBox .itemName .series { font-size: 75%; display: block; line-height: 150%; }
.itemListWrap .slides li .itemBox .itemName sup {}
.itemListWrap .slides li .itemCategory { }
.itemListWrap .slides li .itemStorage { font-size: 171.4%; padding-top: 30px; }
.itemListWrap .slides li .itemCapacity {}
.itemListWrap .slides li .itemStandard {}
.itemListWrap .slides li .itemSpeed .icon_01 { padding-right: 1.5em; background: url(/compare/images/icon_01.png) right center no-repeat; }
.itemListWrap .slides li .itemSend {}
.itemListWrap .slides li .itemVoltage {}
.itemListWrap .slides li .itemBase {}
.itemListWrap .slides li .itemSize {}
.itemListWrap .slides li .itemMass {}
.itemListWrap .slides li .itemNotes {}
.itemListWrap .slides li .itemNotes sup { font-size: 10px; }
.itemListWrap .slides li .itemNfc {}
.itemListWrap .slides li .itemFrequency {}
.itemListWrap .slides li .itemSphone img { width:auto; }
.itemListWrap .slides li .itemSphone .icon_color img { display: inline; margin-right: 11px; vertical-align: baseline; }
.itemListWrap .slides li .itemSphone sup {}
.itemListWrap .slides li .itemSphone .product_package_image_wrap {  margin-bottom: 10px; }
.itemListWrap .slides li .empty { text-align: center; }
.itemList .itemSphone a { text-decoration: underline; }


/* notProductTxt */
.notProductTxt {padding:192px 0 121px; }
.notProductTxt p { font-size:16px; text-align: center; line-height:170%; margin-top: 28px; }
.notProductTxt p:first-child { margin-top:0; }
.notProductTxt p a { text-decoration:underline; }
.notProductTxt p span.mark { display:inline-block; width:20px; margin: 0 4px 0 9px; }
.notProductTxt p span.mark img { width:100%; }
.notProductTxt p a:hover { text-decoration:none; }




/*
 * changePos
 */
.itemBox {
position: relative;
}
.itemBox a {
display: block;
}
/*
.itemBox .arrow {
content: '';
cursor: pointer;
display: none;
height: 44px;
position: absolute;
width: 44px;
z-index: 10;
}
.itemBox .arrow.prev {
left: -24px; bottom: -12px;
}
.itemBox .arrow.next {
right: -24px; bottom: -12px;
}
*/
.itemBox .arrow {
content: '';
cursor: pointer;
display: none;
height: 34px;
position: absolute;
width: 34px;
z-index: 10;
}
.itemBox .arrow.prev {
left: -19px; bottom: -6px;
}
.itemBox .arrow.next {
right: -19px; bottom: -6px;
}

.itemBox:hover .arrow {
display: block;
}
.slides .item:first-child .itemBox .arrow.prev {
height: 0;
width: 0;
}
.slides .item:last-child .itemBox .arrow.next {
height: 0;
width: 0;
}



@media all and (-ms-high-contrast:none){
/* IE10以éÑí */
.itemListWrap .slides li>div { padding: 30px 16px 20px; }
}

.deleteBox { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 200px; height: 117px; background: url(../images/delete_bg.png) 0 0 repeat; color: #fff; }
.deleteBox .boxInner { padding: 19px 5px 11px; text-align: center; }
.deleteBox .boxInner .txt { margin-bottom: 12px; }
.deleteBox .boxInner .selectTxt p { font-size: 128.5%; }
.deleteBox .boxInner .selectTxt p .yes { margin-right: 26px; }
.deleteBox .boxInner .selectTxt p .no {}
.deleteBox .boxInner .selectTxt p span { cursor: pointer; }
.deleteBox .boxInner .selectTxt p span:hover { color: #ff0000; }

#noticeList { clear: both; margin: 0 auto; }
#noticeList ul.indentList.type20>li { padding-left:1.8em; margin-bottom:13px; }
#noticeList ul.indentList.type20>li.last { margin-bottom:8px;}
#noticeList ul.indentList.type12>li { padding-left: 1.2em; }

@media screen and (max-width:667px){
body.compare #mainInner { width: 85% !important; margin-left: 6.25%; min-width:0; }
body.compare #sideL { width: 20%; display: inline; float: left; margin-right: -37%; background:transparent; position: relative; z-index: 100; margin: -20px -20% 0 0; }
body.compare #cont { width: 100%; float: right; margin-bottom: 35px;}
img.icon02 { width: 12px; }
img.iconClass10 { width: 40px;}
img.iconClassVideo { width: 16px; }
p.spText img { display: inline; margin: 2px 5px;}
.titMain { margin-bottom: 11px; }
.coverR { right:-2px; }

#sideL .itemBox { margin-bottom: 37px;}
.fixed #sideL .itemBox { visibility:hidden; }
.fixed .emptyBox { width: 17%; top: 0; }

#sideL .allDel { font-size: 83%; padding: 0 0 0 0; top: 0; width: 76%; left: 0; z-index: 999; }
#sideL .allDel span{width: 18%;height: 0;background-size: 100% 200%;padding-top: 18%;bottom: 4px;right: -4px;}
#sideL .emptyBox .allDel{top: 18px;}
.andMore { margin-right: -2%; letter-spacing: -0.2px;margin-bottom: 22px;}
.andMore a { padding-left:12px; font-size: 90.9%; }
.andMore a:before { width:5px; height:8px; top:2px; -webkit-background-size: 5px auto; background-size: 5px auto; }
body.android .andMore a:before { top: 1px; }
body.iphone .andMore a:before {}

#goTop { z-index:60;}

/* =========================================================
fieldList
========================================================= */
.fieldList ul li { font-size: 100%; padding: 0 0 32px; line-height: 1.45; }
.fieldList ul li sup { font-size: 9px; }

/* =========================================================
itemListWrap
========================================================= */
.itemListWrap { position: relative; margin: 0 0 0 20%; }
.itemListWrap .itemList { width: 100%; position: relative; overflow:hidden; }
.itemListWrap .itemList:nth-child(2){padding-top: 29px;}
.itemListWrap .itemBoxList {padding-top: 0; box-shadow: -5px -3px 29px rgba(0,0,0,0.2); }
.itemListWrap .slides li { width: 100px !important; margin-right: 0; font-size: 9px; line-height: 140%;}
.itemListWrap .slides li>div { line-height: 140%; padding: 2px 6px 30px; }
.itemListWrap .slides li .itemBox { width: 100px;margin-bottom: 0;}
.itemListWrap .slides li .itemBox .close { right: 10px; top: 8px; width: 10px; height: 10px; background: url(/compare/images/close_btn.png) left top no-repeat; -webkit-background-size: cover; background-size: cover; }
.itemListWrap .slides li .itemBox .itemboxWrap { padding: 11px 5px 10px; }
.itemListWrap .slides li .itemBox .itemImg { width: 171px; height: 68px; margin-bottom: 8px; }
.itemListWrap .slides li .itemBox .itemImg img { display: inline; width: 51px; height: auto; }
.itemListWrap .slides li .itemBox .itemName { font-size: 10px; line-height: 1.45; }
.itemListWrap .slides li .itemBox .itemName .series { font-size: 9px; display: block; line-height: 150%; }
.itemListWrap .slides li .itemStorage { font-size: 121.1%; padding-top: 0px; line-height: 100%; }
.itemListWrap .slides li .itemSpeed .icon_01 { padding-right: 2em; background: url(/compare/images/icon_01.png) right center no-repeat; }
.itemListWrap .slides li .itemSend { line-height: 150%; }
.itemListWrap .slides li .itemVoltage { line-height: 140%; }
.itemListWrap .slides li .itemBase { line-height: 180%; letter-spacing: 0.3px; }
.itemListWrap .slides li .itemSize { line-height: 180%; }
.itemListWrap .slides li .itemNotes sup { font-size: 9px; }
.itemListWrap .slides li .itemSphone .icon_color img { margin-right: 5px; vertical-align: bottom; }
.fixed .itemListWrap .itemBoxList{ position: fixed; top: 0;}
.itemList .itemSphone .indentList li{ width: 90px !important; margin-bottom: 6px; }
.deleteBox { width: 100px; height: 189px; }
.deleteBox .boxInner { padding: 66px 5px; text-align: center; }
.deleteBox .boxInner .txt { margin-bottom: 12px; }
.deleteBox .boxInner .selectTxt p { font-size: 85.7%; }
.deleteBox .boxInner .selectTxt p .yes,
.deleteBox .boxInner .selectTxt p .no { font-size: 100%; }
.deleteBox .boxInner .selectTxt p span { cursor: pointer; }
.deleteBox .boxInner .selectTxt p span:hover { color: #ff0000; }

#noticeList { width: 93.75%;  margin: 0; }
ul.indentList li { line-height: 140%; }
/* notProductTxt */
.notProductTxt { width:93.75%; padding:100px 0; margin:0 auto; }
.notProductTxt p { font-size:14px; }
.notProductTxt p span.mark { width:15px; }





/*
 * changePos
 */
.itemBox .arrow {
content: '';
cursor: pointer;
display: none;
height: 34px;
position: absolute;
width: 34px;
z-index: 10;
}
.itemBox .arrow.prev {
left: -18px; bottom: -6px;
}
.itemBox .arrow.next {
right: -18px; bottom: -6px;
}
}