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

body {
    background-image: url(/navi/kirei/images/campaignshops/background.jpg);
    background-position: center 610px;
    background-repeat: repeat-x;
}
div#body {
    position: relative;
    margin: 0 auto;
    padding: 0px 0px 0px;
    width: auto;
    text-align: left;
}
div#header {
    position: relative;
    z-index: 16;
    margin: 0 auto;
    width: auto;
    border-bottom: none;
    background: #FFF;
    text-align: left;
    zoom: 1;
}
div#header h1.logo, div#header p.logo {
    margin: 0 auto;
    padding: 20px 0px 15px;
    width: 960px;
}
div.sns {
    position: absolute;
    top: 75px;
    right: 40px;
    z-index: 100;
}
#ku_campaign {
    font:13px "メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3メイリオ", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

/* font:13px "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; */
    *font-size:small;
    *font:x-small;
}
#ku_campaign a {
    overflow: hidden;
    color: #95969a;
}
#ku_campaign a:hover {
    color: #555555;
    text-decoration: none;
}

#ku_campaign a:hover img.hoverImg{
    opacity:0.7;
    -ms-filter: "alpha( opacity=70 )";
    filter:alpha(opacity=70);
}
/*    wrapper
----------------------------------------------*/
#ku_campaign #wrapper {
    position: relative;
    margin-right: auto;
    margin-left: auto;
    width: 970px;
    height: auto;
    color: #665555;
}
/*    globalHeader
----------------------------------------------*/
#ku_campaign #globalHeader {
    margin-right: auto;
    margin-left: auto;
    width: 960px;
    height: 61px;
    background: #FFF;
}
#ku_campaign #globalHeader .logo {
    margin-left: 80px;
}
/*    headerNavigation
----------------------------------------------*/
#ku_campaign #sticky_item {
    z-index: 2010;
}
#ku_campaign #headerNavigation {
    position: relative;
    z-index:100;
    height: 48px;
}
#ku_campaign #headerNavigation .inner {
    position:relative;
    margin-right: auto;
    margin-left: auto;
    width: 960px;
    height: 48px;
}
#ku_campaign .fixed {
    position: fixed !important;
    top: 0px;
    left:50%;
    margin-left: -480px;
    width: 960px;
}


#ku_campaign #headerNavigation ul {
    position: absolute;
    top: 0px;
    left: 0px;
    background-color:#FFFFFF;
    height: 48px;
}
#ku_campaign #headerNavigation li {
    float: left;
}
#ku_campaign #headerNavigation .on a .hoverImg {
    opacity:0.7;
    -ms-filter: "alpha( opacity=70 )";
    filter:alpha(opacity=70);
}

#ku_campaign #headerNavigation .navi_01,
#ku_campaign #headerNavigation .navi_02,
#ku_campaign #headerNavigation .navi_03,
#ku_campaign #headerNavigation .navi_04,
#ku_campaign #headerNavigation .navi_01
{
    height: 48px;
    background-image: url(/navi/kirei/images/navi_line.png);
    background-position: right center;
    background-repeat: no-repeat;
}


#ku_campaign #headerNavigation .navi_01 {
    width: 168px;
}
#ku_campaign #headerNavigation .navi_02 {
    width: 168px;
}
#ku_campaign #headerNavigation .navi_03 {
    width: 211px;
}
#ku_campaign #headerNavigation .navi_04 {
    width: 167px;
}

#ku_campaign #contentsBlockWrap {
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 60px;
    width: 960px;
    height: auto;
    color: #665555;
}



/*-----------------------------------------------*/

/* Creamserumここから */

/*-----------------------------------------------*/

#section_01 {
    position: relative;
    margin-top: -4px;
}
#section_01 h2 {
    position: absolute;
    top: 26px;
    left: 23px;
    z-index: 2;
    overflow: hidden;
    width: 219px;
    height: 276px;
    background: url(/navi/kirei/images/creamserum/mv_title.png) no-repeat;
    text-indent: 100%;
    white-space: nowrap;
}
#section_01 .bg01 {
    position: relative;
    z-index: 1;
    margin: 0 auto;
    width: 966px;
    height: 558px;
    background: url(/navi/kirei/images/creamserum/mv_bg_shadow.png) no-repeat;
}
#switch {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    width: 960px;
    height: 552px;
    background: url(/navi/kirei/images/creamserum/mv_bg.jpg) no-repeat;
}
#btn01,
#btn04,
#btn06,
#btn08 {
    position: absolute;
    z-index: 10;
    cursor: pointer;
}
#btn02,
#btn03,
#btn05,
#btn07 {
    position: absolute;
    z-index: 0;
    cursor: pointer;
}
#btn01 img,
#btn04 img,
#btn06 img,
#btn08 img, 
#btn02 img,
#btn03 img,
#btn05 img,
#btn07 img {
    position: absolute;
    top: 0;
    left: 0;
}

#btn01 {
    top: 320px;
    left: 186px;
}
#btn02 {
    top: 116px;
    left: 272px;
}
#btn03 {
    top: 161px;
    left: 355px;
}
#btn04 {
    top: 330px;
    left: 371px;
}
#btn05 {
    top: 164px;
    left: 446px;
}
#btn06 {
    top: 311px;
    left: 501px;
}
#btn07 {
    top: 64px;
    left: 586px;
}
#btn08 {
    top: 320px;
    left: 665px;
}

#section_01 #slideBox {
    position: relative;
    z-index: 0;
    margin-top: -6px;
}
#section_01 #slideBox #slideClose {
    position: absolute;
    top: 23px;
    right: 17px;
    overflow: hidden;
    width: 32px;
    height: 32px;
    background: url(/navi/kirei/images/creamserum/detail/btn_slide_close.gif) no-repeat;
    text-indent: 100%;
    white-space: nowrap;
    cursor: pointer;
}

#section_01 #slideBox .boxMid {
/* height: 354px; */
    height: 380px;
}
.productBox {
    margin: 0 auto;
    padding-top: 29px;
    width: 956px;
}
.productImg {
    float: left;
    width: 320px;
}
.detailArea {
    float: left;
    width: 590px;
}

#section_01 #slideBox .productBox h3 {
    color: #CC9900;
    font-weight: normal;
    font-size: 26px;
}
#section_01 #slideBox .productBox p.name {
/* padding-top: 18px; */
    font-size: 16px;
}
.productBox p.nit {
    padding-top: 12px;
    padding-left: 2px;
}
.productBox p.description {
    padding-top: 14px;
    padding-left: 2px;
}
#slideBox ul.label {
    padding-top: 18px;
}
#slideBox ul.label li {
    float: left;
    margin-right: 5px;
    height: 24px;
}


#section_02 {
    padding-top: 36px;
    padding-bottom: 36px;
}
.boxTop,
.boxBottom {
    margin: 0 auto;
    width: 966px;
    height: 14px;
}
.boxTop {
    background: url(/navi/kirei/images/creamserum/content_bg_top.png) no-repeat;
}
.boxMid {
    margin-top: 0;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
    padding-top: 26px;
    padding-bottom: 30px;
    width: 966px;
    background: url(/navi/kirei/images/creamserum/content_bg_mid.png) repeat-y;
}
.boxBottom {
    background: url(/navi/kirei/images/creamserum/content_bg_bottom.png) no-repeat;
}

#section_02 h2.title {
    height: 32px;
    width: 100%;
    text-align: center;
/*
    overflow: hidden;
    background: url(/navi/kirei/images/creamserum/sect_02_title.gif) center top no-repeat;
    text-indent: 100%;
    white-space: nowrap;
*/
}

#section_02 p.head {
    padding-top: 26px;
    padding-bottom: 26px;
    text-align: center;
}
#section_02 .otherBtn {
    margin: 0 auto;
    width: 870px;
}

#tabBox {
    padding-bottom: 30px;
}
#tabNavi {
    margin: 0 auto;
    margin-bottom: -2px;
    width: 824px;
    height: 41px;
}
#tabNavi li {
    float: left;
    margin-right: 6px;
    width: 200px;
    cursor: pointer;
}
#tabNavi li.lastLi {
    margin-right: 0;
}
#tabContents {
    margin: 0 auto;
    width: 870px;
    height: 560px;
    background: url(../images/creamserum/inner_mid.gif) repeat-y;
}
#tabContents .tabcontentsTop {
    height: 10px;
    background: url(../images/creamserum/inner_top.gif) no-repeat;
}
#tabContents .tabcontentsBottom {
    height: 10px;
    background: url(../images/creamserum/inner_bottom.gif) no-repeat;
}

.catBox {
    overflow-x: hidden;
    overflow-y: scroll;
    height: 540px;
}
.catinBox {
    margin: 0 auto;
    padding-top: 20px;
    padding-bottom: 20px;
    width: 820px;
    border-bottom: 1px dotted #665555;
}
#tabBox .productImg {
    float: left;
    width: 240px;
    text-align: center;
}
#tabBox .detailArea {
    float: left;
    width: 578px;
}

#tabBox .catinBox h3 {
    color: #CC9900;
    font-weight: bold;
    font-size: 14px;
}
#tabBox .catinBox p.name {
    padding-top: 5px;
    color: #665555;
    font-weight: bold;
}
#tabBox .catinBox p.nit {
    padding-top: 6px;
    padding-left: 2px;
}
#tabBox .catinBox p.description {
    padding-top: 10px;
    padding-left: 2px;
}
#tabBox ul.label {
    padding-top: 18px;
}
#tabBox ul.label li {
    float: left;
    margin-right: 5px;
    height: 24px;
}

#tabBox p.attention {
    margin: 0 auto;
    padding-top: 10px;
    width: 870px;
    font-size: 11px;
}

.catWrap {
    margin: 0 auto;
    width: 850px;
}