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



/*/////////////////////////////////////////////////////////////////////////////

ベース

////////////////////////////////////////////////////////////////////////////*/
 img{
	vertical-align:top;
}


#article_wrap .pankuzu{
	padding-bottom:6px;
	width: 1260px;
	margin: 0 auto;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

*{
	box-sizing:border-box;
}


.leSpace01{
	letter-spacing:-0.1em;
	font-weight:bold;
}
.leSpace02{
	letter-spacing:-0.05em;
	font-weight:bold;
}


 .inner{
	width:980px;
	margin: 0 auto;
	text-align:left;

}


#article_wrap{
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	 padding: 0 0;
    width: 100%;
  /*  overflow: hidden;*/
	background: #FFF;
	text-align:center;
}


.h_pink{
	background:#db087a;
	color:#FFF;
	font-size:48px;
	line-height:1.2em;
	font-weight:bold;
	-moz-text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
	-webkit-text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
	-ms-text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}

.h_navy{
	background:#250a69;
	color:#FFF;
	margin-top:4px;
	font-size:40px;
	line-height:140px;
}

.h_lightGreen{
	background:#bfdbe4;
	color:#106884;
	margin-top:4px;
	font-size:40px;
	line-height:140px;
}



 .h_pink div.inner, .h_navy div.inner,.h_lightGreen div.inner{
	font-weight:bold;
	text-align:center;
}





/*/////////////////////////////////////////////////////////////////////////////

USP（トップとボトム両方）

////////////////////////////////////////////////////////////////////////////*/



#uspArea,#uspArea2{
	background: url(../../images/uvcream/bg_usp.jpg) center top no-repeat;
/*	padding-bottom:10px;*/
}


#uspArea h1,#uspArea2 .h1{
	width:980px;
	margin:0 auto;
	text-align:left;
	padding:27px 0 0 515px;
	height:791px;
}
#uspArea .inner,#uspArea2 .inner{
	position:relative;
}

#uspArea .inner .txtUpf,#uspArea2 .inner .txtUpf{
	position: absolute;
	top: 550px;
	left: 1px;
	z-index: 100;
}


.h_pink.usp2{
margin-bottom:10px;
}
.h_pink.usp2 .inner{
	font-size:55px;
	padding:44px 0;
}


/*/////////////////////////////////////////////////////////////////////////////

共通の購入エリア

////////////////////////////////////////////////////////////////////////////*/

#orderInfoArea,.orderInfoArea{
background:#090d7b;
padding-top:10px;
border-bottom:1px solid #090d7b;
}
.orderInfoArea.info02{
background:#dae4f0;
padding-top:10px;
border-bottom:1px solid #dae4f0;
}




.infoArea{
	width:910px;
	font-weight:bold;
	font-size:18px;
	line-height:1.4em;
	text-align:left;
	padding-left:20px;
	vertical-align:top;
	font-weight:bold;
	color:#FFF;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.orderInfoArea.info02 .infoArea{
	color:#070398;
}

.infoArea span{
	display:inline-block;
	font-weight:normal;
	color:#00046f;
	background:#c3e5ff;
	font-size:14px;
	line-height:1.4em;
	
	margin:10px 10px 6px 20px;
	padding:2px 6px;
}


.orderInfoArea.info02 .infoArea span{
	background:#110d9b;
	color:#FFF;
}


.orderArea{
		display:table;
	table-layout:fixed;
	margin:0 auto 10px;
	font-weight:bold;
	font-size:24px;
	line-height:1.4em;
	background:#FFF;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius:6px;
	border-collapse: separate;
	border-spacing: 20px 5px;
	
}

.orderArea li{
	display:table-cell;
	color:#ffffff;
}

.orderArea2{
	display:table;
	table-layout:fixed;
	margin:0 auto 10px;
	font-weight:bold;
	font-size:24px;
	line-height:1.4em;
	background:#FFF;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius:6px;
	border-collapse: separate;
	border-spacing: 12px 5px;
}

.orderArea2 > li{
	text-align:center;
}

.orderArea2 > li > ul{
		display:table;
	table-layout:fixed;
	margin:0 auto;
	padding:0;
	
}

.orderArea2 > li > ul > li{
	display:table-cell;
	color:#ffffff;
}




/*/////////////////////////////////////////////////////////////////////////////

それがスーパープラセンタ

////////////////////////////////////////////////////////////////////////////*/

#superPlaArea{
	background: url(../../images/uvcream/bg_superpla.jpg) center top no-repeat;
	min-height:880px;
	padding-top:85px;
}
#superPlaArea h2{
	text-align:center;
	margin-bottom:54px;
}
#superPlaArea h2 .h2_01{
	color:#008503;
	font-size:39px;
	line-height:1.2em;
	letter-spacing:-0.06em;
	font-weight:bold;
	display:block;
	margin:0 auto 138px;
}
#superPlaArea h2 .h2_02,#superPlaArea p.p2{
	font-size:36px;
	line-height:1.2em;
	color:#0619a3;
	font-weight:bold;
	display:block;
	margin:0 auto;
-moz-text-shadow:  -2px 0px 0 #d3f8ff,0px -2px 0 #d3f8ff,2px 0px 0 #d3f8ff,0px 2px 0 #d3f8ff,
             -2px 0px 20px rgba(129,203,255,0.5),0px -2px 20px rgba(129,203,255,0.5),2px 0px 20px rgba(129,203,255,0.5),0px 2px 20px rgba(129,203,255,0.5);
-webkit-text-shadow: -2px 0px 0 #d3f8ff,0px -2px 0 #d3f8ff,2px 0px 0 #d3f8ff,0px 2px 0 #d3f8ff,
             -2px 0px 20px rgba(129,203,255,0.5),0px -2px 20px rgba(129,203,255,0.5),2px 0px 20px rgba(129,203,255,0.5),0px 2px 20px rgba(129,203,255,0.5);
-ms-text-shadow: -2px 0px 0 #d3f8ff,0px -2px 0 #d3f8ff,2px 0px 0 #d3f8ff,0px 2px 0 #d3f8ff,
             -2px 0px 20px rgba(129,203,255,0.5),0px -2px 20px rgba(129,203,255,0.5),2px 0px 20px rgba(129,203,255,0.5),0px 2px 20px rgba(129,203,255,0.5);
text-shadow: -2px 0px 0 #d3f8ff,0px -2px 0 #d3f8ff,2px 0px 0 #d3f8ff,0px 2px 0 #d3f8ff,
             -2px 0px 20px rgba(129,203,255,0.5),0px -2px 20px rgba(129,203,255,0.5),2px 0px 20px rgba(129,203,255,0.5),0px 2px 20px rgba(129,203,255,0.5);

}



#superPlaArea p{
	font-size:18px;
	line-height:2em;
	color:#000;
	font-weight:bold;
	text-align:center;
}

#superPlaArea p.p2{
	text-align:center;
	padding-top:85px;
	margin-bottom:30px;
}


#superPlaArea p.btnArea{
	padding-top:68px;
}





/*/////////////////////////////////////////////////////////////////////////////

UVケア

////////////////////////////////////////////////////////////////////////////*/
.uvcareArea{
	background:url(../../images/uvcream/bg_uvcare.jpg) center top no-repeat;
	min-height:590px;
	text-align:center;
	padding-top:50px;
}
.uvcareArea .inner  p{
	text-align:center;
	font-size:18px;
	line-height:1.8em;
	font-weight:bold;
	margin-bottom:40px;
}


.nayamiBox{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background:url(../../images/uvcream/bg_nayami.png) center top no-repeat;
	width:894px;
	height:289px;
	padding:30px;
}
.uvcareArea .inner .nayamiBox p{
	color:#0b7699;
	font-size:22px;
	line-height:1.2em;
	margin-bottom:36px;
	-moz-text-shadow:-2px 0px 20px rgba(169,186,193,0.75),0px -2px 20px rgba(169,186,193,0.75),2px 0px 20px rgba(169,186,193,0.75),0px 2px 20px rgba(169,186,193,0.75);
	-webkit-text-shadow: -2px 0px 20px rgba(169,186,193,0.75),0px -2px 20px rgba(169,186,193,0.75),2px 0px 20px rgba(169,186,193,0.75),0px 2px 20px rgba(169,186,193,0.75);
	-ms-text-shadow:-2px 0px 20px rgba(169,186,193,0.75),0px -2px 20px rgba(169,186,193,0.75),2px 0px 20px rgba(169,186,193,0.75),0px 2px 20px rgba(169,186,193,0.75);
	text-shadow:-2px 0px 20px rgba(169,186,193,0.75),0px -2px 20px rgba(169,186,193,0.75),2px 0px 20px rgba(169,186,193,0.75),0px 2px 20px rgba(169,186,193,0.75);
}

.uvcareArea .inner .nayamiBox ul{
	display:table;
	table-layout:fixed;
	height:174px;
	width:100%;
}
.uvcareArea .inner .nayamiBox ul li{
	color:#176b87;
	font-size:22px;
	line-height:1.2em;
	display:table-cell;
	text-align:center;
	vertical-align:middle;
	font-weight:bold;
	-moz-text-shadow:-2px 0px 10px #ffffff,0px -2px 10px #ffffff,2px 0px 10px #ffffff,0px 2px 10px #ffffff;
	-webkit-text-shadow:-2px 0px 10px #ffffff,0px -2px 10px #ffffff,2px 0px 10px #ffffff,0px 2px 10px #ffffff;
	-ms-text-shadow:-2px 0px 10px #ffffff,0px -2px 10px #ffffff,2px 0px 10px #ffffff,0px 2px 10px #ffffff;
	text-shadow:-2px 0px 10px #ffffff,0px -2px 10px #ffffff,2px 0px 10px #ffffff,0px 2px 10px #ffffff;
	}
	
	
	


/*/////////////////////////////////////////////////////////////////////////////

「スーパ－プラセンタ」が守りながら紫外線カット

////////////////////////////////////////////////////////////////////////////*/




.itemArea.area01{
	background: url(../../images/uvcream/bg_item01.jpg) center top no-repeat;
	min-height:1305px;
	padding-top:40px;
}
.itemArea.area02{
	background: url(../../images/uvcream/bg_item02.jpg) center top no-repeat;
	min-height:2582px;
}


.itemArea > .inner{
	text-align:center;
}

.itemArea > .inner > p{
	text-align:center;
	font-size:18px;
	line-height:2em;
	font-weight:bold;
	margin-bottom:50px;
}
.itemArea > .inner > p > strong{
	font-weight:bold;
	background:#fff9b3;
}


.itemArea p.p01{
	margin:0 0 28px;
}


.itemArea p.p02{
	margin:0 0 30px;
}

.itemArea p.p02 span{
	color:#e4006b;
	font-weight:bold;
}

.itemArea p.p03{
	margin-bottom:24px;
}


.itemArea p.p04{
	margin:0 0 30px;
}



.itemArea p.p05{
	color:#f01099;
	font-size:55px;
	font-weight:bold;
	line-height:1em;
	display:inline-block;
	letter-spacing:-0.05em;
	text-align:center;
	background:url(../../images/base/bor_yellow33.gif) left bottom repeat-x;
	padding:0 10px 8px;
-moz-text-shadow:  -2px 0px 0 #f6f7f8,0px -2px 0 #f6f7f8,2px 0px 0 #f6f7f8,0px 2px 0 #f6f7f8;
-webkit-text-shadow: -2px 0px 0 #f6f7f8,0px -2px 0 #f6f7f8,2px 0px 0 #f6f7f8,0px 2px 0 #f6f7f8;
-ms-text-shadow: -2px 0px 0 #f6f7f8,0px -2px 0 #f6f7f8,2px 0px 0 #f6f7f8,0px 2px 0 #f6f7f8;
text-shadow: -2px 0px 0 #f6f7f8,0px -2px 0 #f6f7f8,2px 0px 0 #f6f7f8,0px 2px 0 #f6f7f8;
}



.itemArea p.pImg01{
	margin-bottom:40px;
}


.itemArea p.pImg03{
	margin-bottom:32px;
}







/*///////////　チェックタイトル　　/////////////////////////////////////*/


h4.checkTitle{
	text-align:left;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#93bbfe+0,e6ebff+100 */
	background: rgb(147,187,254); /* Old browsers */
	background: -moz-linear-gradient(left,  rgba(147,187,254,1) 0%, rgba(230,235,255,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(147,187,254,1) 0%,rgba(230,235,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(147,187,254,1) 0%,rgba(230,235,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#93bbfe', endColorstr='#e6ebff',GradientType=1 ); /* IE6-9 */
	margin-bottom:40px;
}
h4.checkTitle span{
	background:url(../../images/base/icon_check.png) 6px center no-repeat;
	font-size:36px;
	line-height:70px;
	color:#071aaa;
	padding-left:116px;
	font-weight:bold;
}



h4.checkTitle2{
	text-align:left;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ebf8ff+0,ebf8ff+100&1+0,0+100 */
background: -moz-linear-gradient(left,  rgba(235,248,255,1) 0%, rgba(235,248,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(235,248,255,1) 0%,rgba(235,248,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(235,248,255,1) 0%,rgba(235,248,255,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebf8ff', endColorstr='#00ebf8ff',GradientType=1 ); /* IE6-9 */


	margin-bottom:40px;
}
h4.checkTitle2 span{
	background:url(../../images/base/icon_check2.png) 6px center no-repeat;
	font-size:36px;
	line-height:70px;
	color:#071aaa;
	padding-left:116px;
	font-weight:bold;
}



/*///////////　使いやすさボックス　　/////////////////////////////////////*/

.dotBoxArea{
	margin:0 23px 300px;
}


.dotBox{
	padding:68px 44px 28px 40px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.dotBox h5{
	padding-left:64px;
	margin-bottom:40px;
	text-align:left;
	color:#e25454;
	font-weight:bold;
	font-size:22px;
	line-height:1.2em;
}

.dotBox p{
	font-size:16px;
	line-height:1.8em;
	text-align:left;
}

.dotBox.box01{
	float:left;
	width:450px;
	height:504px;
	background:url(../../images/uvcream/bg_dotBox01.png) left top no-repeat;
}

.dotBox.box01 .p01{
	margin-bottom:220px;
}
.dotBox.box01 .p02{
	text-align:center;
	color:#007600;
	font-size:14px;
	line-height:1.4em;
}


.dotBox.box02{
	float:right;
	width:450px;
	height:504px;
	background:url(../../images/uvcream/bg_dotBox02.png) left top no-repeat;
}

.dotBox.box03{
	float:left;
	width:450px;
	height:440px;
	background:url(../../images/uvcream/bg_dotBox03.png) left top no-repeat;
}

.dotBox.box04{
	float:right;
	width:450px;
	height:440px;
	background:url(../../images/uvcream/bg_dotBox04.png) left top no-repeat;
}





/*/////////////////////////////////////////////////////////////////////////////

スーパープラセンタとは

////////////////////////////////////////////////////////////////////////////*/


.h_pink.aboutSuperPla{
	padding-top:40px;
}
.h_pink.aboutSuperPla img{
	margin-top:16px;
}
.h_pink.aboutSuperPla .inner{
	padding-bottom:40px;
}
.aboutSuperPlaArea{
	background:url(../../images/base/superpla_bg.jpg) top center no-repeat;
	position:relative;
}
.aboutSuperPlaArea .inner{
	position:relative;
}

.aboutSuperPlaArea .btnArea{
	position:absolute;
	right:0;
	bottom:0;
	padding:0 26px 12px 0;
	
}

/*/////////////////////////////////////////////////////////////////////////////

安全性

////////////////////////////////////////////////////////////////////////////*/

.safetyTitle{
	background:#250a69;
}


/*/////////////////////////////////////////////////////////////////////////////

化粧品

////////////////////////////////////////////////////////////////////////////*/

.h_pink.iconItem{
	background:#db087a url(../../images/base/bg_bottom_cosme_bg60.gif) top repeat-x;
}
.h_pink.iconItem .inner{
	background:url(../../images/uvcream/bg_icon_uvcream.png) left bottom no-repeat;
	min-height:180px;
	padding:95px 0 40px 100px;
	font-size:40px;
	line-height:1.2em;
}


/*/////////////////////////////////////////////////////////////////////////////

レビュー

////////////////////////////////////////////////////////////////////////////*/


#reviewArea{
	background:#f3efe7;
	margin:10px 0;
}
#reviewArea h6{
	font-size:46px;
	line-height:120px;
	color:#291a4e;
	font-weight:bold;
	text-align:center;
}
#reviewArea p{
	text-align:right;
	margin-right:30px;
	font-size:12px;
	line-height:48px;
	color:#8a7b5c;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#reviewArea .reviewBox{
margin: 0 10px;
}

#reviewArea .reviewBox iframe{
	width:100%;
	height:450px;
	background:#FFF;
}


@media screen and (max-width:1279px)  {
#article_wrap .pankuzu{
	width:960px;
}
}
