@charset "UTF-8";

/* mainVisual
----------------------------------------------------------------------------------*/



#mainVisual {
 position: relative;
 height: 500px;
 margin: 0 auto 110px auto;
 width: 980px;
}

#mainVisual .btn {
 position: absolute;
 z-index: 2;
 left: 500px;
 top: 255px;
}

/* contentsLayout
----------------------------------------------------------------------------------*/



#contentsMain {
 height: auto;
 margin: 35px auto 50px auto;
 width: 910px;
}

#contentsMain .blk { width: 910px; }

#contentsMain .blk:after {
 content: "";
 display: block;
 clear: both;
}

/* newarrival
----------------------------------------------------------------------------------*/


#contentsMain .na {
 position: relative;
 height: 480px;
 width: 910px;
}

#slider { margin-bottom: 45px; }

#slider ul li {
 border: #B9D9EB 1px solid;
 line-height: 1;
 font-size:0;
 margin-right: 20px!important;
 padding: 4px;
}

#slider ul li a {
 background:#f1f7f9;
 display:block;
}

#controls .prevBtn {
 position: absolute;
 left: -30px;
 top: 130px;
 background: url(../img/icn_arr_left.png) left top no-repeat;
 display: block;
 height: 34px;
 overflow: hidden;
 text-indent: -9999px;
 width: 18px;
 z-index: 100;
}

#controls .nextBtn {
 position: absolute;
 right: -30px;
 top: 130px;
 background: url(../img/icn_arr_right.png) left top no-repeat;
 display: block;
 height: 34px;
 overflow: hidden;
 text-indent: -9999px;
 width: 18px;
 z-index: 100;
}

#controls a:hover.prevBtn {
 background: url(../img/icn_arr_left.png) left bottom no-repeat;
}

#controls a:hover.nextBtn {
 background: url(../img/icn_arr_right.png) left bottom no-repeat;
}


#controls a:active.prevBtn,
#controls a:active.nextBtn {
 top: 132px;
}

/* news
----------------------------------------------------------------------------------*/


#contentsMain .newsArea {
 float: left;
 width: 515px;
}

#contentsMain .newsArea .title {
 position: relative;
 margin-bottom: 20px;
}

#contentsMain .newsArea .title span {
 position: absolute;
 right: 20px;
 top: 5px;
}

#contentsMain .newsArea ul { width: 515px; }

#contentsMain .newsArea ul li {
 margin-bottom: 10px;
 width: 515px;
}

#contentsMain .newsArea ul li:after {
 content: "";
 display: block;
 clear: both;
}

#contentsMain .newsArea ul li a {
 display:block;
 height:80px;
 width: 515px;
}

#contentsMain .newsArea ul li p.pic {
 float: left;
 width: 80px;
}

#contentsMain .newsArea ul li p.txt {
 float: right;
 font-size:14px;
 line-height: 1.8;
 padding-top: 16px;
 width: 415px;
}

/* ranking
----------------------------------------------------------------------------------*/



#contentsMain .rankArea {
 float: right;
 width: 300px;
}

#contentsMain .rankArea .title { margin-bottom: 20px; }

#contentsMain .rankArea ul { width: 300px; }

#contentsMain .rankArea ul li {
 margin-bottom: 10px;
 width: 300px;
}

#contentsMain .rankArea ul li:after {
 content: "";
 display: block;
 clear: both;
}

#contentsMain .rankArea ul li.r01 { background: url(../img/icn_ranking_01.gif) 130px 5px no-repeat; }

#contentsMain .rankArea ul li.r02 { background: url(../img/icn_ranking_02.gif) 130px 5px no-repeat; }

#contentsMain .rankArea ul li.r03 { background: url(../img/icn_ranking_03.gif) 130px 5px no-repeat; }


#contentsMain .rankArea ul li a {
 display:block;
 height:110px;
 width: 300px;
}


#contentsMain .rankArea ul li p.pic {
 float: left;
 text-align: center;
 width: 120px;
}

#contentsMain .rankArea ul li p.txt {
 background: url(../img/icn_cart.gif) right bottom no-repeat;
 float: right;
 line-height: 1.8;
 padding-top: 50px;
 width: 170px;
}

/* blog
----------------------------------------------------------------------------------*/


html,
body { height: 100%; }

.hidden { overflow-x: hidden; }

#contents {
 margin: 0 auto;
 max-width: 980px!important;
}

#contentsMain .blog {
 background: #BAD8EA;
 margin: 0 -500% 80px;
 padding: 60px 500%;
}

#contentsMain .blog:after {
 content: "";
 display: block;
 clear: both;
}

#contentsMain .blogArea {
 float: left;
 width: 500px;
}

#contentsMain .blogArea .title {
 position: relative;
 margin-bottom: 40px;
 width: 500px;
}

#contentsMain .blogArea .title span {
 position: absolute;
 right: 0px;
 top: 0px;
}

#contentsMain .blogArea ul li {
 font-size: 14px;
 line-height: 1.8;
 margin-bottom: 20px;
}

#contentsMain .blogArea ul li:after {
 content: "";
 display: block;
 clear: both;
}

#contentsMain .blogArea ul li p.date {
 float: left;
 width: 85px;
}

#contentsMain .blogArea ul li p.txt {
 float: left;
 width: 415px;
}

#contentsMain .comArea {
 float: right;
 width: 350px;
}

#contentsMain .comArea ul.bnr1 {
 position: relative;
 left: 10px;
 margin-right: -30px;
 margin-bottom: 30px;
 width: 380px;
}

#contentsMain .comArea ul.bnr1:after {
 content: "";
 display: block;
 clear: both;
}

#contentsMain .comArea ul.bnr1 li {
 float: left;
 margin-right: 30px;
 width: 60px;
}

#contentsMain .comArea ul.bnr2 {
 margin-right: -30px;
 width: 380px;
}

#contentsMain .comArea ul.bnr2:after {
 content: "";
 display: block;
 clear: both;
}

#contentsMain .comArea ul.bnr2 li {
 float: left;
 margin-right: 10px;
 width: 170px;
}

/* bnrArea ----------------------------------------------------------------*/


#contentsMain .bnrArea {
 padding-bottom: 40px;
 width: 940px;
}

#contentsMain .bnrArea ul {
 margin-right: 20px;
 width: 960px;
}

#contentsMain .bnrArea ul:after {
 content: "";
 display: block;
 clear: both;
}

#contentsMain .bnrArea ul li {
 float: left;
 line-height: 1;
 margin: 0 20px 20px 0;
 width: 460px;
}