@charset "utf-8";

/*
カワイイをつくる.com
Copyright (C) KAO Corporation. All Rights Reserved.
*/

/* //////////////////////////////////////////////////
[essential.css]
////////////////////////////////////////////////// */

/* --------------------------------------------------
	@: 0. Import CSS
-------------------------------------------------- */
@import url(/kawatsuku/css/base.css);
@import url(/kawatsuku/css/base.module.css);

/* --------------------------------------------------
	@: 1. Essectial Top
-------------------------------------------------- */

/* @: common
----------------------------------- */
#essentialTop #header {
	margin-bottom: 0;
}

#essentialTop #navLocal {
	padding-top: 20px;
	margin-bottom: 10px;
}

/* @: background
----------------------------------- */
#essentialTop #container {
	background: url(/kawatsuku/img/essential/top/bg.png) repeat-x;
}

#essentialTop #content {
}

/* @: blockMain
----------------------------------- */
.essentialTop .blockMain {
	width: 950px;
	clear: both;
	margin: 0 0 20px 0;
}

.essentialTop .blockMain .unitLeft {
	width: 510px;
	float: left;
}

.essentialTop .blockMain .unitLeft .unitTxt {
	height: 160px;
	background: url(/kawatsuku/img/essential/top/img_title.png) no-repeat;
	text-align: center;
}

.essentialTop .blockMain .unitLeft .unitTxt p.txt {
	padding: 100px 0 0 0;
	font-weight: bold;
}

.essentialTop .blockMain .unitLeft .unitLineup {
	margin-top: 12px;
}

.essentialTop .blockMain .unitCuticle {
	width: 440px;
	float: right;
}



/* @: blockIndex
----------------------------------- */

/* --- @: blockIndex --- */
.essentialTop .blockIndex {
	overflow: hidden;
	width: 880px;
	margin: 0 auto -30px;
}
.essentialTop .blockIndex .groupIndex,
.essentialTop .blockIndex .groupSub {
	padding-bottom: 30px;
}
.essentialTop .blockIndex .unit {
	float: left;
	width: 400px;
	padding: 0 20px;
}
.essentialTop .blockIndex h2 {
	margin-bottom: 10px;
}

/* --- @: blockSub --- */
.essentialTop .blockIndex .groupSub .unit h2 {
	float: left;
	margin: 0 20px 0 0;
	display: inline;
}

.essentialTop .blockIndex .groupSub .unit h3 {
	font-weight: bold;
	font-size: 108%;
	line-height: 130%;
}




/* --------------------------------------------------
	@: 1. essentialProductsTop
-------------------------------------------------- */
.hrB {
	padding: 5px 0;
}

.essentialProductsTop .blockIndex {
	position: relative;
	/*height: 790px;*/
}
/*
.essentialProductsTop .blockIndex .unit { position: absolute; }
.essentialProductsTop .blockIndex .unit1 { top: 213px; left: 0; }
.essentialProductsTop .blockIndex .unit2 { top: 121px; left: 492px; }
.essentialProductsTop .blockIndex .unit3 { top: 451px; left: 455px; }
*/

.essentialProductsTop .blockIndex .unit1 {
	float: left;
	width: 435px;
	margin-right: 45px;
}

.unit3 .img {
	float: left;
}

.unit3 h2 {
	margin-bottom: 10px;
}

.unit3 .block {
	width: 450px;	
	float: right;
	margin-top: 50px;
	text-align: center;
}

.unit3 .check {
	margin-top: 10px;
}

.essentialProductsTop .blockIndex .unit .img {
	margin-bottom: 10px;
}
.essentialProductsTop .blockIndex .unit h2,
.essentialProductsTop .blockIndex .unit .check {
	text-align: center;
}

/* --------------------------------------------------
	@: 2. essentialProductsLineup
-------------------------------------------------- */

/* @: blockSummary
----------------------------------- */
.essentialProductsLineup .blockSummary {
	position: relative;
	*zoom: 1;
}
.essentialProductsLineup .blockSummary .img {
	padding-bottom: 15px;
}
.essentialProductsLineup .blockSummary .figure {
	position: absolute;
	width: 320px;
	height: 215px;
	right: 60px;
	bottom: 50px;
}

/* @: blockIndex
----------------------------------- */
.essentialProductsLineup .blockIndex {
	overflow: hidden;
	margin: -30px 0;
	background: url(/kawatsuku/img/essential/products/common/bg_hr_col2_row2.png) no-repeat 50% 50%;
}
.essentialProductsLineup .blockIndex .unit {
	float: left;
	width: 475px;
	padding: 30px 0;
	text-align: center;
}
.essentialProductsLineup .blockIndex h2 {
	margin-bottom: 10px;
}
.essentialProductsLineup .blockIndex .listItems li {
	display: inline;
}

/* --------------------------------------------------
	@: 3. essentialProductsTreatmentTop
-------------------------------------------------- */

/* @: blockSummary
----------------------------------- */
.essentialProductsTreatmentTop .blockSummary {
	float: left;
	width: 450px;
	padding-top: 10px;
	background: url(/kawatsuku/img/common/bg_line_col2_01.png) repeat-y 100% 0;
}
.essentialProductsTreatmentTop .blockSummary .img {
	margin-bottom: 10px;
}
.essentialProductsTreatmentTop .blockSummary h2 {
	margin-bottom: 10px;
}

/* @: blockIndex
----------------------------------- */

/* --- @: blockIndex --- */
.essentialProductsTreatmentTop .blockIndex .unit {
	text-align: center;
}
.essentialProductsTreatmentTop .blockIndex .img {
	margin-bottom: 20px;
}
.essentialProductsTreatmentTop .blockIndex h2 {
	margin-bottom: 20px;
}
.essentialProductsTreatmentTop .blockIndex .txt {
	margin-bottom: 10px;
}

/* --- @: blockIndexSub --- */
.essentialProductsTreatmentTop .blockIndexSub {
	width: 500px;
	float: right;
	text-align: center;
}
.essentialProductsTreatmentTop .blockIndexSub h2 {
	margin: 35px 0 55px;
}
.essentialProductsTreatmentTop .blockIndexSub .listItems li {
	display: inline;
}

/* @: listActionBtnLineC
----------------------------------- */
.listActionBtnLineC {
	margin-left: 30px;
}

.listActionBtnLineC li {
	margin-right: 30px;
}



/* @: Renewal style
------------------------------------ */
.ttlProduct {
  margin-bottom: 22px;
}
.blockLineup {}

.unitLineupA {
  float: left;
  width: 50%;
  text-align: center;
}
.separateUnit {
  background: url(/kawatsuku/img/common/bg_line_col2_01.png) right top repeat-y;
}
.unitLineupB {
  position: relative;
  float: left;
  width: 33%;
  padding: 66px 0 110px;
  text-align: center;
}
.unitLineupC {
  position: relative;
  float: left;
  width: 50%;
  padding: 60px 0 86px;
  margin-top: 10px;
  text-align: center;
}

.headerLineup {
  margin-bottom: 25px;
  text-align: center;
}
.ttlLineupA {
	margin-bottom: 10px;
}

.ttlLineupB {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.itemProductA {
  margin-bottom: 26px;
}
  .itemProductA p ,
  .itemProductB p {
    display: inline-block;
    /display: inline;
    /zoom: 1;
  }
  #sc1 .itemProductA {
    padding-right: 30px;
    background: url(/kawatsuku/img/essential/products/top/bg_product_01.png) 0 64px no-repeat;
  }
  #sc2 .itemProductA {
    padding-left: 19px;
    background: url(/kawatsuku/img/essential/products/top/bg_product_02.png) 100% 64px no-repeat;
  }
  #st4 .itemProductA {
    height: 166px;
    padding-top: 20px;
  }
.itemProductB {
  height: 160px;
}

.itemCaptionA {}
  .itemCaptionA h4 {
    margin-bottom: 10px;
  }
  .btnDetail {
    margin-top: 5px;
    margin-bottom: 5px;
  }
 
.itemCaptionB {
  position: absolute;
  left: 0;
  width: 100%;
}

.twaterPrd {position: relative;}
.twaterPrd .newIconT {
position: absolute;
left: -45px;
top: 26px;}

.ttlProduct {margin: 20px 0px;}
.lineupTitle {margin-top: 30px;}