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

/*

    basic stuff

*/

body.hot #main #content {
    display: block;
    float: none;
    width: 920px;
    margin: 0px auto;
    padding: 0;
}

/*

    main visual

*/

body.hot #main #content #mainvisual{
    position: relative;
    display: block;
    width: 920px;
    height: 560px;
    margin: 0;
    padding: 0;
    clear: both;
    border-top: 1px solid #333333;
}

body.hot #main #content .sweatparka{
    background: url(../img/hot/sweatparka/mv-bg.jpg) no-repeat top left;
}

body.hot #main #content .blouson{
    background: url(../img/hot/blouson/mv-bg.jpg) no-repeat top left;
}

body.hot #main #content #mainvisual > h2{
    position: absolute;
    display: block;
    width: 670px;
    height: 60px;
    top: 25px;
    left: 250px;
    background: none !important;
}

body.hot #main #content #mainvisual > ul{
    position: absolute;
    display: block;
    width: 670px;
    height: 420px;
    top: 135px;
    left: 20px;
    margin: 0;
    padding: 0;
}

body.hot #main #content #mainvisual > ul > li{
    position: relative;
    display: block;
    width: 670px;
    height: 130px;
    margin: 0px auto 10px auto;
    padding: 0;
}

body.hot #main #content #mainvisual > ul > li > a{
    position: absolute;
    display: block;
    width: 190px;
    height: 40px;
    top: 80px;
    left: 470px;
    margin: 0;
    padding: 0;
    z-index: 100;
}


/*

    pricing

*/

body.hot #main #content #pricing{
    width:920px;
    margin: 0;
    padding: 20px 0;
    border-top: 1px solid #333333;
}

body.hot #main #content #pricing > dl{
    position: relative;
    display: table;
    border-collapse: collapse;
    width: 862px;
    height: auto;
    border: 2px solid #E7E8EA;
    margin: 0px auto;
    padding: 0;
}

body.hot #main #content #pricing > dl > dt{
    position: relative;
    display: table-cell;
    width: 260px;
    vertical-align: middle;
    text-align: center;
}

body.hot #main #content #pricing > dl > dd{
    position: relative;
    display: table-cell;
    vertical-align: middle;
    padding: 20px 0px;
}

body.hot #main #content #pricing > dl > dd > p{
    color: #660000;
    margin: 0;
    padding: 0;
}

body.hot #main #content #pricing > dl > dd > p:before{
    content: "■";
}

body.hot #main #content #pricing > dl > dd > ul{
    padding: 1em;
}

body.hot #main #content #pricing > dl > dd > ul > li{
    color: #666666;
}

body.hot #main #content #pricing > dl > dd > ul > li:before{
    content: "●";
}

/*

    listing

*/

body.hot #main #content #listing > h3{
    position: relative;
    display: block;
    width: 920px;
    height: 90px;
    margin: 0;
    padding: 0;
    background: none !important;
    border-top: 1px solid #333333;
    border-bottom: none !important;
}


body.hot #main #content #listing > ul{
    position: relative;
    display: block;
    width: 870px;
    height: 490px;
    margin: 5px auto 25px auto;
    padding: 0;
    overflow: hidden;
}

body.hot #main #content #listing > ul > li{
    position: relative;
    display: block;
    width: 270px;
    height: 490px;
    margin: 0;
    padding: 0px 10px;
    float: left;
}

body.hot #main #content #listing > ul > li .catch{    position:absolute;    display:block;    top:0px;    left: 0px;    }
body.hot #main #content #listing > ul > li .image{    position:absolute;    display:block;    top:45px;    left: 0px;    }
body.hot #main #content #listing > ul > li .name{    position:absolute;    display:block;    top:265px;    left: 0px;    }
body.hot #main #content #listing > ul > li .price{    position:absolute;    display:block;    top:315px;    left: 0px;    }
body.hot #main #content #listing > ul > li .var{    position:absolute;    display:block;    top:384px;    left: 0px;    }
body.hot #main #content #listing > ul > li .btn{    position:absolute;    display:block;    top:450px;    left: 40px;    }

body.hot #main #content #listing .extlink{
    position: relative;
    display: block;
    width: 900px;
    height: 30px;
    margin: 0px auto 60px auto;
    padding: 0px 10px;
    background: url(../img/hot/sweatparka/link-bg.gif) repeat;
    font-size: 13px;
    line-height: 30px;
    color: #666666;
    text-align: right;
}

body.hot #main #content #listing .extlink > a{
    color: #0066cc;
    text-decoration: underline;
}


.sp {
    display: none;
}

/*スマホ
------------------------------*/

@media screen and (max-width: 750px) {

    .pc {
        display: none;
    }
    .sp {
        display: block;
    }

}