@charset "utf-8";
/* CSS Document */
.spx{ display: block;}
.pcx{ display: none;}

/*セルフネイル講座*/

.lesson,.lesson p{ line-height: 1.5em !important;}
.lesson img{ width: 100%;}

.lesson .section{ overflow: hidden; margin-bottom: 2em; text-align: center;}
.lesson .cbx{  overflow: hidden; margin: 0 auto; text-align: center; width: 96%;}
.lesson .sps{ margin-bottom: 1em;}

.lesson .section p{ text-align: left;}

.lesson .read{ font-size: 110%; margin-bottom: 1em;}

.lesson p{ padding: 0;}

.lesson h3{ 
padding: 20px 0 0 30px; color: #FFF; font-size: 120%; height: 30px;
margin-bottom: 1em;
background-image:url(/page/images/lesson/lesson_ttl_bg.png);
background-repeat: no-repeat;
background-position: left;
background-size: 100%;
}

.lesson h3 span{ font-size: 90%;}

.lesson .box01,.lesson .box02,.lesson .box03,.lesson .box04{ overflow: hidden; margin-bottom: 3em;}

.lesson .box01 .fl{ width: 88%; padding: 1%; margin: 0 auto 2em auto;
background:url(/page/images/lesson/lesson_bg01.png) repeat;}
.lesson .box01 .fr{ width: 88%; padding: 1%; margin: 0 auto 0 auto;
background:url(/page/images/lesson/lesson_bg02.png) repeat;}

.lesson .box01 .bx{ background: #FFF; padding: 5%; font-size: 110%; line-height: 1.5em;}
.lesson .box01 .bx img{ margin-bottom: 1em;}
.lesson .box01 img,.lesson .box02 img{ width: 100%;}
.lesson b{ color: #f15757;}
.lesson .box01 h4{ color: #f15757; font-size: 110%; }
.lesson .box01 h4 span{ font-size: 80%; color: #9c9898;}

.lesson .box02 .fl{ width: 88%; font-size: 110%; line-height: 1.5em; margin: 0 auto 1.5em auto;}
.lesson .box02 .fr{ width: 88%;margin: 0 auto 1em;}


.lesson .box03{ background: #f3f8fa; padding: 4%;}
.lesson .box03 img{ width: 30%;}
.lesson .box03 .fr{ width: 96%; margin: 0 auto; text-align: left;}

.lesson .box03 .bx{ overflow: hidden; margin-bottom: 1em; font-size: 110%; text-align: center;}
.lesson .box03 h4,.lesson .section h4{ color: #39b3de; margin-bottom: 0.5em; }
.lesson .box03 h4{ text-align: center;font-size: 110%; }
.lesson .section h4{ margin-bottom: 0; text-align: left;font-size: 130%;}

.lesson .box04{width: 96% !important; margin: 0 auto 2em auto;}
.lesson .box04 table{border-left: 1px solid #39b3de; border-top: 1px solid #39b3de; width: 100% !important;
margin-bottom: 0.5em !important;}
.lesson .box04 th{ background-color: #aedbef; text-align: center;font-size: 110%;}
.lesson .box04 td{ text-align: center;}
.lesson .box04 td.bg{  background-color: #d6edf7; font-size: 110%; font-weight: bold;}

.lesson .box04 th,
.lesson .box04 td{ border-right: 1px solid #39b3de; border-left: 1px solid #39b3de;
padding: 0.7em; border-bottom: 1px solid #39b3de; vertical-align: middle;}

.lesson .btbx{ text-align: center; margin-bottom: 2em;}

.lesson .caution { text-align: left;}
.lesson .caution b{ display:block; text-align: center; padding: 0.5em; 
background-color: #fffcde; margin-bottom: 1em;}

.lesson .caution ul{ margin-bottom: 1em;}
.lesson .caution ul li{ list-style: disc; font-size: 90%; margin-left: 20px;}
.lesson .caution ul li.ttl{ color: #f15757;list-style: none; margin-left: 0; font-weight: bold;}

.hana4 b{color: #d62c2f;}
.hana4 .ttl{ background: #2c2c2c; color: #FFFFFF; text-align: center; padding: 10px;
font-size: 120%;}
.hana4 p{ display: block !important; margin-bottom: 3em !important;}

#fp_v2 .hana4 h1 {
    margin: 0 !important;
}
.hana4,.hana4 p { font-size: 100% !important;}
.hana4 .bxbrack{background: #333; padding: 1em; overflow: hidden;}
.hana4 .bxwhite{background: #fff; padding: 1.5em 1em 1em 1em; overflow: hidden;}
.hana4 .bxwhite p{ margin-bottom: 2em !important;}
.hana4 .bxwhite img{ margin-bottom: 1em;}
.hana4 .bxgray{ background: #f4f4f4; padding: 1.5em 1em; overflow: hidden; font-size: 120%;}
.hana4 .bxgray span{ display: inline; border-bottom: 1px solid #d62c2f;}

.hana4 video { width: 100%;}

/*はがれ知らずセット*/
#hagare #content1 {
	position: relative;
}

#hagare #price {
	position: relative;
	z-index: 100;
	text-align: center;
}
#hagare #price img {
	width: 90%;
}
#hagare #productimg {
	width: 100%;
	margin: 5% 0 30%;
}
#hagare #step1 {
	margin: 0 0 6%;
}
#hagare #step1 .stitle {
	position: absolute;
	z-index: 10;
	left: 0;
	top: 23%;
	width: 50%;
}
#hagare #step1 .sarrow {
	position: absolute;
	z-index: 10;
	left: 3%;
	top: 33%;
	width: 15%;
}
#hagare #step2 .stitle {
	position: absolute;
	z-index: 10;
	right: 0;
	top: 48%;
	width: 50%;
}
#hagare #step2 .sarrow {
	position: absolute;
	z-index: 10;
	right: 39%;
	top: 47%;
	width: 10%;
	-webkit-transform: rotate(160deg);
	transform: rotate(160deg);
}
/*
#hagare #content1 .stitle {
	clear: both;
	width: 94%;
	margin: 12% 3% 6%;
}
*/
#hagare #content1 .simg {
	float: right;
	width: 24.5%;
	margin-right: 3%;
}
#hagare #content1 .stxt {
	float: left;
	width: 66.5%;
	margin-left: 3%;
}
#hagare #content2 {
	clear: both;
	margin: 12% 0 0;
}
#hagare #content2 h2 img {
	width: 50%;
}
#hagare #content2 li {
	width: 97%;
	margin: 0 0 0 3%;
	list-style: none;
}
#hagare #content2 li img {
	width: 100%;
}
#hagare #content2 a {
	display: block;
	margin-bottom: 4%;

}

#hagare #content2 #other {	padding: 6% 3%;}
#hagare #content2 .sps{ padding-top: 10px;}
#hagare { clear: both; overflow:  hidden;}
.titlebar_g_o,#contents section.product_name{ display: none;}
#pi_std_price{ padding: 0 !important;     margin-top: 0 !important;}

/*新Basic*/
.basic .sec{ margin-bottom: 30px!important;}
.basic .sec.c{ text-align: center;}
	.basic .slide_item{ width: 96%; margin: 0 auto 30px auto;}
	.basic p.ttl{ background: #ffffff url(/page/images/basic/bg_ttl.png) repeat-x top;
	padding: 15px 0 10px 0; text-align: center; font-weight: bold; display: block !important; font-size: 120%;}
	.basic #detail{ background-color: #f4f4f4;}
	.basic #detail ul{ padding: 20px 20px 15px 20px;}
	.basic #detail li{ padding: 0 0 5px 0; font-size: 110%;}
	.basic #detail li img{ width: 15px; vertical-align: middle; margin-right: 5px;}
	.basic #detail li.s{ letter-spacing: -0.1em;}
.basic #detail li span{ color: #ce141f;}
	.basic #detail .bt{ width: 90%; margin: 0 auto 30px auto;}
	.basic #detail .box{ border-top: 10px solid #FFFFFF; border-bottom: 10px solid #FFFFFF;
	border-right: 5px solid #FFFFFF; border-left: 5px solid #FFFFFF;}
	.basic .bt_close,
	.modal-example-content .bt_close{ display: block; width: 90px!important; margin: 30px auto 30px auto;}
	.basic .design_b { background-color: #454442; width: 97.7%;
    margin: 0 0 30px 0 !important;
    padding: 0 0 20px 2.3%;}
	.basic .design_b a {
    width: 31% !important; margin: 0 2.3% 2% 0;}
	.basic .bnrbx{ background-color: #f4f4f4; padding: 25px 15px 15px 15px; margin-bottom: 30px;}
	.basic .bnrbx .swich01,
	.basic .bnrbx .swich02{ margin-bottom: 20px;}
	.basic .bnrbx .box{ background-color: #FFFFFF; margin-bottom: 30px; overflow: hidden;}
	.basic .redbox{    background-color: #FFFFFF !important; width: 90%; margin: 0 auto;}
	.basic #detail .box{ display: none;}
	.basic #detail .bt,.basic #detail .bt_close{ cursor: pointer;}
	.basic .bnrbx #box01{ padding: 0 15px 15px 15px;}
.basic .bnrbx #box01 h3{ margin-bottom: 10px;}
	.basic .bnrbx #box01 .pointCol2{ margin-bottom: 15px !important; font-size: 140%;}
.basic .bnrbx #box01 .point2{ font-size: 140%; margin-bottom: 20px;}
	.basic .bnrbx #box01 .point2 h4{ margin: 15px 0 0 0;}
	.basic .bnrbx #box01 .ttlPoint{ margin: 20px 0 30px;}
	.basic .bnrbx #box01,.basic .bnrbx #box02{ display: none;}
	.basic .bnrbx .ttlPoint {
    margin: 0 0 30px;}
	.basic .modal_parts_box {
    margin: 0 0 0 !important;}

/*basicクーポン*/
#coupon{
z-index: 1000000;
width: 90%;
padding: 5%;
position: fixed;
display: none;
top: 70px;
right: 0;
background: rgba(0,0,0,0.4);
}

.footbnr{ position: fixed; bottom: 0; left: 0; z-index: 9999999; 
	overflow: hidden;
	background-color: rgba(0,0,0,0.7);}
.footbnr img{ display:inline-block; float: left;}

#sps-to-cart{ display: none !important;}




.footkit,.footkit2{ text-align: center;position: fixed; bottom: 0; left: 0; z-index: 9999999;overflow: hidden;
display:none;}
.footkit .bnr{ background-color: rgba(255,255,255,1);clear: both; padding: 4px 0 0 0;
border-top: 2px solid #C7C7C7;}

.footkit .bnr.ch{ background:none; border:none; padding: 0;}

.footkit.bg .bnr{background-color: rgba(0,0,0,0.9);}

.footkit a{ display: inline-block; width: 32%!important; margin: 0 1px;}
.footkit .ttl{ width: 50%!important; margin-bottom: 3px;}
.footkit .close{ width: 10% !important; float: right;}

.footkit a img{width: 100%!important;}

.footkit .bnr.ch a{ width: 100%!important; margin: 0;}
	
	.footkit2 .bnr a{ width: 96%;}
	.footkit2 .bnr a img{ width: 100%;}
.footkit2 .close{ width: 10% !important;}
.footkit2 .bnr{ background-color: rgba(0,0,0,0.5);clear: both; padding: 4px 4px 4px 4px;}

#contents{    margin: 2px 5px 0 !important;}

/*セルフネイル*/
#selfnail img{ width: 100%;}
#selfnail{ font-size: 16px;
font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
	font-weight: 500; line-height: 1.8em;}

#selfnail p{ padding: 0 0 10px 0; line-height: 1.8em;}
#selfnail b{ color: #fd6666;}
#selfnail a{ text-decoration: underline; 
color: #b08c13;
font-size: 110%;
font-weight: bold;}

#selfnail .box01,#selfnail .box{ overflow:hidden;}

#selfnail .ttl{ text-align: center; margin: 20px 0 0 0;}
#selfnail .ttl img{ width: 100%;}

#selfnail .ttls{ background: url(../images/selfnail/ttls01_bg.png) repeat-x top; height: 40px;
text-align: center; padding: 10px 0 0 0;}
#selfnail .ttls img{ width:25%;}

#selfnail .read b{ font-size: 17px; margin: 0 20px 20px 10px ;font-weight:500;
padding: 0; display: block; line-height: 1.8em; }

#selfnail section h1{background: url(../images/selfnail/ttl_bgs.png) repeat-x top;
font-size: 22px; color: #fd6666; padding: 20px 0 20px 15px;  font-weight:600; line-height: 1.6em;}
#selfnail section h1 a{ font-size: 22px; color: #fd6666; }

#selfnail section{ margin: 0 auto 40px auto !important; overflow: hidden; width: 96%; }
#selfnail .box01{ border: 2px dotted #c1c0c0; padding: 28px; margin: 0 2% 0 2%;}
#selfnail .box01 img{ margin-bottom: 20px;}
#selfnail .box01 b{ background: url(../images/selfnail/illust01.png) no-repeat left top; font-weight:600;
	background-size: 22px 47px; margin: 0 0 20px 0; font-size: 18px;
padding: 10px 0 10px 30px; color:#fd6666; border-bottom: 1px solid #fd6666; text-align: left;}

#selfnail .box .bx{ margin: 0 0 2em 0;}

#selfnail .box02 img{ width: 100%; margin: 0 auto 10px auto; display: block;}
#selfnail .box02 p{ padding: 25px 30px; background-color: #f6f3e6;
	
     }

#selfnail .box02 .bx {
	display: block;
	position: relative;
	width: 100%; margin: 0 auto ;
}
#selfnail .box02 .bx:after {
	position: absolute;
	display: block;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/*background: #f6f3e6;*/
	box-shadow: 
	  inset 0 0 20px #ffffff /* 背景色と同じ色 */,
	  inset 0 0 20px #ffffff,
	  inset 0 0 20px #ffffff,
	  inset 0 0 20px #ffffff;
}

#selfnail .box{ background-color: #f7f6f4; padding-bottom: 20px;}

#selfnail .box img.fl{ margin: 0 0 10px 0; float: none;}
#selfnail .box img.fr{ margin: 0 0 10px 0;float: none;}
#selfnail .box p{ padding: 15px 20px 10px 20px;}
#selfnail .matome img{ display: block; margin: 0 auto 10px auto; width: 50%;}
#selfnail .matome .box03{ padding: 25px 30px 20px 30px; border: 1px dotted #cdbc79; width: 80%; margin: 0 auto;}
#selfnail .matome .box03 p{color: #7c6508; line-height: 1.8em; font-size: 16px;}
#selfnail .bnr{ width: 80%; display: block; text-align: center; margin: 0 auto 50px auto;}
#selfnail h2{ font-size: 100%; padding: 10px 15px; background: #e9e0c0;
 margin-bottom: 1em;}
#selfnail .box h2{ margin: 0;}
#selfnail ul.selflist li{ border-bottom: 1px dotted #cdbc79; margin-bottom: 0.5em;
padding: 0  0 10px 10px; font-size:80%; line-height: 1.4em;}
#selfnail ul.selflist li:before{
	content: "・";
	color: #b08c13;
}

#selfnail .box02 .bx b{ font-size: 100%; text-align: left; display: inline;
    margin: 0;}

.gwttl{ width: 96%; margin: 10px auto 10px auto;}
.basic h2.ttl {
    font-size: 160%;
    border-bottom: 10px solid #fbff00;
    margin-bottom: 30px;
}