/* left nav revised */
#subnav>nav>div { margin-top:20px; }
#subnav>nav>div:first-child { margin-top:0; }
#subnav>nav>div .arw { position:absolute; bottom:7px; left:47%; width:6%; padding-bottom:6%\9; height:0\9;}
*::-ms-backdrop, #subnav>nav>div .arw { padding-bottom:6%; height:0;}
#subnav>nav>div .arw svg { width:100%; position:relative; position:absolute\9; top:0; left:0; height:100%\9;}
*::-ms-backdrop, #subnav>nav>div .arw svg { position:absolute; height:100%;}
#subnav>nav>div svg rect,#subnav>nav>div.open svg:hover rect { fill:#999; }
#subnav>nav>div.open svg rect,#subnav>nav>div svg:hover rect { fill:#C31F26; }
#subnav>nav>nav { display:none; /*lv4*/}
#subnav>nav>div.open+nav { display:block; }
#subnav>nav>nav>a { font-size:100%; background:#f0f0f0; padding:15px; border-top:solid 1px #fff; }
#subnav>.grp { display:none; }

/* result headerfooter */
.bar { /*height:45px; line-height:45px; */ padding:0; text-align:right; z-index:50; }
.bar>span { /*position:absolute; top:0; left:15px;*/ 
            display:block; text-align:left; padding:15px; background:#f0f0f0; box-sizing:border-box;}
.bar>.right { padding:0; margin:0; position:absolute; right:0; bottom:-10px; transform:translateY(100%); }
#body.ie .bar>.right {  }
.bar>.right>div { padding-left:30px; height:45px; display:inline-block; line-height:45px;}
.bar>.right>div>span { display:inline-block; vertical-align:top;}
.bar>.right>div>strong { padding:0 15px; background:#c31f26; color:#fff !important; display:inline-block; margin-left:10px; font-size:25px; font-weight:200; position:relative; }
.bar>.right>div>strong.sort { width:140px; text-align:center; }
.bar strong>nav { position:absolute; left:0; width:100%; background:#c31f26; text-align:center; 
                z-index:20; display:none; }
.bar.top strong>nav { top:100%; }               
.bar.btm strong>nav { bottom:100%; }   
.notouch .bar strong:hover>nav, .notouch .bar strong>nav:hover,.touchdev .bar strong.open>nav { display:block; }
.bar strong>nav>a { display:block; border-bottom:solid 1px #333; line-height:1.2; }                
#inside.result #content .bar strong>nav>a { color:#fff; }
#inside.result #content .bar strong>nav>a:hover { color:#333; }
                     
nav.pg { margin:20px 0; width:50%; }                     
nav.pg img { height:25px; vertical-align:middle; border:none; }
nav.pg img.la { margin-right:25px; }
nav.pg img.ra { margin-right:15px; }
#inside #content nav.pg a.sel { color:#333; }

/* result listing */
#resultul>div { border-top:solid 1px #ccc; padding:20px 0 50px 150px; min-height:100px; }
#inside #content #resultul a { color:#333; }
#inside #content #resultul a:hover { color:#C31F26; }
#inside.result strong { font-weight:400; color:#C31F26;}
#inside.result strong em { font-weight:600 }
#resultul>div a.ico { position:absolute; top:20px; left:35px; width:80px; }
#resultul>div a.img { position:absolute; top:20px; left:0; width:137px; }
#resultul>div a>img { width:100%;}

#resultul div.typesize { margin-bottom:15px; }

.filter { padding: 20px 0;}
#body .filter a:hover { color:#333; }
.filter input { padding:10px; font-size:16px; font-weight:200; border:none; cursor:pointer; color: #ffffff; background-color: #c31f26; margin-bottom: 5px;}
#body.notouch .filter input:hover { color:#333; background:#dfdfdf; }

.forceshow {display: block !important;}

/* ==========================================================================
    Pad : Portrait
============================================================================= */
@media only screen and (min-width: 768px) and (max-width: 959px) and (orientation : portrait) {
 .bar>span { position:relative; display:block; text-align:left; left:0; padding-left:15px; }
 .bar { height:auto; }
 .bar>.right { position:relative; transform:translateY(0); }
 .bar>.right>div { padding-left:30px; padding-right:0; }
 .bar>.right>div:first-child { padding-left:15px; }
}

/* ==========================================================================
    Mobile
============================================================================= */
@media only screen and (max-width:767px) {                        
    #breadcrumb { margin-bottom:15px;}
    /* subnav */
    #subnav>select {margin-bottom:0;}
    #subnav>.grp { display:none; background:#e0e0e0; padding:10px; }
    #subnav>#selgrp { display:inline-block; margin-right:2%; width:48%; }
    #subnav>.grp.sel { display:block; }    
    
    /* bar & custom */
    .bar { text-align:left; height:auto; padding:10px 0 10px 0; line-height: 1.6; }
    .bar.btm { margin-bottom:15px; }
    .bar>span { position:relative; left:0;  }        
    .bar>.mob { position:absolute; top:0; right:15px; }
    .mopts { padding:10px 40% 0 0; }
    .mopts>div { position:absolute; top:10px; right:15px; }
    .mopts>div.npp { right:0;  }
    #topsort { position:absolute; top:2px; right:0; width:50%; text-align:right;}
    
    #resultul+.mopts { padding-bottom:10px; }
    /*result ul*/
    #resultul>div { padding:10px 0 20px 80px; }
    #resultul>div:first-child { border-top:none; }
    #resultul>div a.ico { position:absolute; top:15px; left:0px; width:60px; }
    #resultul>div a.img { position:absolute; top:15px; left:0; width:70px; }
	.filter { padding: 15px;}
}