@charset 'utf-8';
/* CSS Document */
/* スライドショー */
#slide {
	width: 600px;
	height: 200px;
	margin: 0 auto;
	position: relative;
}
#slide img {
	position: absolute;
	left: 0;
	top: 0;
}

/* タイトル、テキスト */
h3.new {
 float: left;
 clear: left;
        width: 95%;
 font-size: 17px;
 font-weight: lighter !important;
 line-height: 1.4;
 margin-top: 24px;
 margin-bottom: 10px;
 margin-right: 15px;
 padding: 13px;
 display: block;
 color: #FFFFFF;
 background-color: #E3488A;
 border-radius: 5px;   /* CSS3草案 */
 -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */
 -moz-border-radius: 5px;
}
h4.new{color: #E3488A;
	font-size: 15px;
	line-height: 1.4em !important;
	margin: 2px 0px 8px !important;
	border-left: 2px solid #E3488A;
	padding-left: 8px;
	}
h5.new{
	color: #FC679E;
	font-size: 13px;
	line-height: 1.4em !important;
	margin: 2px 0px 2px !important;
	}
p.new {
	color: #606060;
	line-height: 1.7em !important;
	margin-bottom: 12px !important;
	font-size: 12px;
	clear: both;
}
p.new2 {
	color: #606060;
	line-height: 1.7em !important;
	margin-bottom: 12px !important;
	font-size: 12px;
}
.ttl-new{
	padding-top: 25px;
	width: 490px;
	margin: 0 auto;
	border-bottom: 1px solid #4C9BD0;
	padding-bottom: 0px;
	}
#tab_cont_wrap .ttl-new-h4 {
	 float:left;
	 margin-top: 5px;
	 }
#tab_cont_wrap .ttl-new ul {
	float: right;
	width: 181px;
}
#tab_cont_wrap .ttl-new ul li { float:left;}

/* シャドウ用ボックス */
.box_nule {
	height: 150px;
	margin: 5px 0px 18px 0px;
	float: left;
}
.box_nule2{
	width: 490px;
	height: 663px;
	margin: 0px 0px 30px 0px;
}

/* シャドウ */
.effect {
	position: relative;
	left: 9%;
}
.effect:before, .effect:after {
	z-index: -1;
	position: absolute;
	content: "";
	bottom: 15px;
	left: 10px;
	width: 50%;
	top: 80%;
	max-width: 490px;
	background: #999;
	-webkit-box-shadow: 0 15px 10px #999;
	-moz-box-shadow: 0 15px 10px #999;
	box-shadow: 0 15px 10px #999;
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	-ms-transform: rotate(-3deg);
	transform: rotate(-3deg);
}
.effect:after {
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-o-transform: rotate(3deg);
	-ms-transform: rotate(3deg);
	transform: rotate(3deg);
	right: 10px;
	left: auto;
}

.effect2 {
	position: relative;
}
.effect2:before, .effect2:after {
	z-index: -1;
	position: absolute;
	content: "";
	bottom: 15px;
	left: 10px;
	width: 50%;
	top: 80%;
	max-width: 490px;
	background: #999;
	-webkit-box-shadow: 0 15px 10px #999;
	-moz-box-shadow: 0 15px 10px #999;
	box-shadow: 0 15px 10px #999;
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	-ms-transform: rotate(-3deg);
	transform: rotate(-3deg);
}
.effect2:after {
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-o-transform: rotate(3deg);
	-ms-transform: rotate(3deg);
	transform: rotate(3deg);
	right: 10px;
	left: auto;
}

/* リンクボタン */
.link2 a{
	float: left;
	clear: left;
	display: block;
	margin: 4px 0px 10px 0px;
	padding: 9px 10px 7px 20px;
	font-size: 93%;
	text-decoration: none;
	padding: 9px 10px 7px 16px;
	color: #E3488A !important;
	background-color: #FFFFFF !important;
	background-image: url(https://www.lovecosmetic.jp/shop/images/item/94980_link_arrow.png);
	background-position: 8px 50%;
	background-repeat: no-repeat;
	border: 1px solid #E3488A;
	-moz-box-shadow: 3px 3px #E3488A;    /* firefox　*/
	-webkit-box-shadow: 3px 3px #E3488A;  /* safari、chorme */
	border-radius: 4px;   /* CSS3草案 */  
    -webkit-border-radius: 4px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 4px; 
}
.link2 a:hover{
	color: #FFFFFF !important;
	background-color: #E3488A !important;
	background-image: url(https://www.lovecosmetic.jp/shop/images/item/94980_link_arrow2.png);
	background-position: 8px 50%;
	background-repeat: no-repeat;
	text-decoration: none !important;
}

/* 体験コメント */
.experience{
	padding: 15px 10px 0px 10px;
	border: 1px solid #FFD0D0;
	background-color: #FFF7F7;
	margin-bottom: 8px;
	clear: both;
	}
.experience img{
	float: left;
	padding-bottom: 0px;
	margin-bottom: 10px;
}
.experience p.text{
	color: #606060;
	line-height: 1.7em !important;
	margin-top: 0px !important;
	margin-bottom: 13px !important;
	font-size: 12px;
	float: right; 
	width : 400px;
	}
.experience p.tit{
	color: #E3488A;
	font-size: 15px;
	line-height: 1.4em !important;
	margin: 2px 0px 5px !important;
	border-left: 2px solid #E3488A;
	width : 400px;
	padding-left: 8px;
	float: right;
}

/* 成分の豆知識 */
.component{
	padding: 15px 12px 0px;
	background-image: url(https://www.lovecosmetic.jp/shop/images/common/pepar.png);
	background-color: #FFFAFC;
	margin-bottom: 8px;
	clear: both;
	}
.component img{
	float: left;
	padding-bottom: 0px;
	margin-bottom: 10px;
}
.component p.tit{
	color: #8B4D26;
	font-size: 14px;
	line-height: 1.4em !important;
	margin: 0px 0px 5px !important;
	border-left: 2px solid #8B4D26;
	width : 400px;
	padding-left: 6px;
	float: right;
}
.component p.text{
	color: #444444;
	line-height: 1.4em !important;
	margin-top: 0px !important;
	font-size: 12px;
	width : 400px;
	float: right;
	}

/* お客様の声 */
.voice{
	padding: 10px 0px 0px;
	margin-bottom: 8px;
	clear: both;
	}
.voice p.tit{
	color: #E3488A;
	font-size: 15px;
	line-height: 1.4em !important;
	margin: 2px 0px 8px !important;
	border-left: 2px solid #E3488A;
	padding-left: 8px;
	}
.voice p{
	color: #606060;
	line-height: 1.7em !important;
	margin-top: 0px !important;
	margin-bottom: 10px !important;
	font-size: 12px;
	}
p.kome{
	margin: 8px 0px 0px 0px;
	color: #F84A5D;
}

/* ご利用方法 */
.douga {
	 float:right;
	width: auto;
	padding: 0 0 5px 5px;
 }
 
/* ラブテクニック囲い */
.frame{
	padding: 15px 10px 0px 10px;
	border: 1px solid #FFE0EC;
	background-color: #FFFAFC;
	margin-bottom: 8px;
	clear: both;
	}
/* レイアウト調整用 */
.clearfix:after{
	content: "";
	clear: both;
	display: block;
}
/* マージン調整用 */
.mb10{ margin-bottom: 10px;}
.mb20{ margin-bottom: 20px;}
.mt20{ margin-top: 20px;}

/* ポイント文字 */
span.marker {
	color: #FC679E;
      }
	  
 .usetit {
	color: #E3488A;
	font-weight: bold;
}


/*/////////////////////////////////////////////////////////////////////////////////////////////////
商品スライド用ビューワ ここから
/////////////////////////////////////////////////////////////////////////////////////////////////*/

/* 既存のPOPUP崩れを修正 */
#comic_popup_viewer .view_check_btn {
  position: absolute;
  top: 20px;
  right: 20px;
}
#comic_popup_viewer .back_btn_01 {
  position: absolute;
  top: 50%;
  left: 20px;
  margin-top: -30px;
}
#comic_popup_viewer .fwd_btn_01 {
  position: absolute;
  top: 50%;
  right: 20px;
  margin-top: -30px;
}
#comic_popup {
  float: none !important;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto !important;
}
/* 既存のPOPUP崩れを修正 */


.comic_area {
  height: 486px;
  width: 486px;
  margin: 0 auto;
  background: #FFF;
  border: 1px solid #666;
  overflow: hidden;
}
.comic_area .viewer {
  width:9999px;
  cursor:pointer;
}
.comic_area .viewer img {
  float:left;
  padding:3px;
}

.viewer_btns {
  width:100%;
  margin:20px 0 30px;
  text-align:center;
}
.viewer_btns a {
	display:inline-block !important;
  height:34px;
	font-size:14px;
  color:#F04370 !important;
  line-height:34px;
	
	border: #F04370 1px solid;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
.viewer_btns a:hover {
  background-color:#F04370 !important;
  color:#FFF !important;
  text-decoration:none !important;
}
.viewer_btns a.off { color:inherit !important; border-color:#777777 !important;}
.viewer_btns a.off:hover { background-color:inherit !important;}

.viewer_btns .page_l { padding:0 20px 0 10px; margin-right:20px;}
.viewer_btns .page_r { padding:0 10px 0 20px; margin-left:20px;}


.popup_viewer {
  display:none;
  width: 680px;
  height: 600px;
  background-color:#fff;
  position:fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  margin:auto;
  z-index:200;
}
.popup_viewer .comic_area {
  border:none;
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  margin:auto;
}
.popup_viewer .viewer {
  cursor:default;
}


.popup_viewer .popup_l {
  width:60px;
  height:60px;
  position:absolute;
  top:0;
  left:20px;
  bottom:0;
  margin:auto;
}
.popup_viewer .popup_r {
  width:60px;
  height:60px;
  position:absolute;
  top:0;
  right:20px;
  bottom:0;
  margin:auto;
}
.popup_viewer .popup_close {
  width:40px;
  height:40px;
  position:absolute;
  top:20px;
  right:20px;
}
.popup_viewer .over:hover {
	filter:alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7;
}

.popup_back {
  display:none;
  width: 100%;
  height: 100%;
  position:fixed;
  top:0;
  left:0;
  background-color: rgba(0,0,0,0.5);
  z-index:100;
}


/*/////////////////////////////////////////////////////////////////////////////////////////////////
商品スライド用ビューワ ここまで
/////////////////////////////////////////////////////////////////////////////////////////////////*/

.h3red2 {
    text-align: left;
    font-size: 12px;
    font-weight: bold;
    color: #ffffff;
    background: #CC0066;
    margin: 0 0 0 0;
    padding: 5px 0 5px 5px;
}

.waku_nw4 {
	width: 478px;
	margin: 0 0 15px 0;
	padding: 10px 5px 0 5px;
	border: 1px solid #CC0066;
	background-color:#FFFFFF;
}