
.wrapper { margin: 0 auto; width: 100%; color: #222; font-family: Helvetica, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3"; letter-spacing: 0.125em; line-height: 1.8em; /*-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased;*/ }
/*.wrapper p.lead { font-size: 12px; font-family:  "Hiragino Mincho ProN", "ヒラギノ明朝 ProN W3"; letter-spacing: 2.5px; line-height: 2.4; margin: 0 auto 13.5%; margin-left: -4.4%; text-align: center; }
.wrapper p.lead span { display: inline-block; padding-bottom: 10px }*/


.container { margin: 0 auto; padding: 75px 0 0; width: 100% }
.container .main { margin: 0 auto 115px; width: 940px; overflow: hidden }
.container .main .visual { margin: 0 auto 60px }
.container .main .visual img { width: 940px; height: auto }
.container .main h1.title { font-size: 16px; font-weight: bold; line-height: 1.8em; margin: 0 auto 85px; text-align: center }
.container .main .point { font-size: 16px; font-weight: bold; margin: 0 auto 32px; text-align: center }
.container .main .point span { background: linear-gradient(transparent 62%,#e1efd8 0%); display: inline-block; padding: 0 10px; }
.container .main ul { display: table; margin: 0 auto; text-align: left; }
.container .main ul li { font-size: 16px; position: relative; margin: 0 0 10px; padding-left: 30px; }
.container .main ul li:before { content: url(/user_data/packages/default/images/duvettouchbra/check.svg); position: absolute; top: -2px; left: 0; width: 21px; height: auto; }
.main {
	opacity: 0;
	-webkit-animation: fadein-main 2.5s ease 0.5s 1 forwards;
	animation: fadein-main 2.5s ease 0.5s 1 forwards;
}
@-webkit-keyframes fadein-main {
	100% { opacity: 1 }
}
@keyframes fadein-main {
	100% { opacity: 1 }
}


.container h2 { margin: 0 auto 20px; text-align: center; }
.container h2:after { content: ""; width: 60px; height: 1px; background-color: #222; display: block; margin: 19px auto 24px; }
.container h3 { font-size: 16px; font-weight: bold; margin: 0 auto 20px; text-align: center; }
.container .rate { margin: 0 }
.container .rate img { width: 140px; height: auto }
.container .rate-text { margin: 0; font-size: 12px; letter-spacing: 0.05em; }
.container .review-text { margin: 0; font-size: 12px; letter-spacing: 0.05em; line-height: 1.95em; }
.container .more { margin: 0; font-size: 13px; letter-spacing: 0.05em; }
.container .more a { color: #222; text-decoration: none; }
.container .more a:hover { color: #222; text-decoration: underline; }
.container ul.bra { margin: 0 auto 30px; text-align: center; }
.container ul.link { margin: 0 auto; text-align: center; }
.container ul.link li { font-size: 15px; margin-bottom: 10px; letter-spacing: 0.05em; }
.container ul.link li a { color: #222; text-decoration: underline; }
.container ul.link li a:hover { color: #222; text-decoration: none; }

.container p.btn { margin: 0 auto 150px; text-align: center; }
.container p.btn a { background: transparent; color: #111; border:1px solid #111; text-align: center; display: inline-block; font-size: 13px; letter-spacing: 1px; padding: 12px; text-decoration: none; position: relative; width: 300px; box-sizing: border-box; transition: all .6s ease; }
.container p.btn a:hover { background: #111; color: #fff; cursor: pointer; text-decoration: none; }




/* ephemere */
.column01 { position: relative; width: 1086px; height: 658px; margin: 0 auto 190px; }
.column01 .visual01 { position: absolute; top: 14px; left: 0; }
.column01 .visual01 img { width: 450px; height: auto; }
.column01 .inner { position: absolute; top: 0; left: 506px; width: 580px; height: 658px; }
.column01 .inner .rate { position: absolute; top: 482px; left: 50px; }
.column01 .inner .rate-text { position: absolute; top: 522px; left: 50px; }
.column01 .inner .more { position: absolute; bottom: 0; left: 50px; }
.column01 .inner .review-text { position: absolute; top: 482px; right: 0; }
.column01 .inner h2 img { width: 123px; height: auto; }
.column01 .inner ul.bra img { width: 122px; height: auto; }



/* eyelash mood */
.column02 { position: relative; width: 1086px; height: 920px; margin: 0 auto 85px; }
.column02 .visual01 { position: absolute; top: 0; right: 77px; z-index: 0; }
.column02 .visual01 img { width: 450px; height: auto; }
.column02 .visual02 { background: #fff; position: absolute; bottom: 0; right: 20px; z-index: 1; }
.column02 .visual02 img { width: 358px; height: auto; }
.column02 .inner { position: absolute; top: 0; left: 0; width: 508px; height: 724px; padding-top: 68px; box-sizing: border-box; }
.column02 .inner .rate { position: absolute; top: 582px; left: 0; }
.column02 .inner .rate-text { position: absolute; top: 622px; left: 0; }
.column02 .inner .more { position: absolute; bottom: 0; left: 0; }
.column02 .inner .review-text { position: absolute; top: 582px; right: 0; }
.column02 .inner h2 img { width: 170px; height: auto; }
.column02 .inner ul.bra img { width: 144px; height: auto; }



/* twinkle rosie */
.column03 { position: relative; width: 1086px; height: 678px; margin: 0 auto 190px; }
.column03 .visual01 { position: absolute; top: 0; left: 0; }
.column03 .visual01 img { width: 450px; height: auto; }
.column03 .inner { position: absolute; top: 12px; left: 506px; width: 580px; height: 666px; }
.column03 .inner .rate { position: absolute; top: 500px; left: 75px; }
.column03 .inner .rate-text { position: absolute; top: 540px; left: 75px; }
.column03 .inner .more { position: absolute; bottom: 0; left: 75px; }
.column03 .inner .review-text { position: absolute; top: 500px; right: 0; }
.column03 .inner h2 img { width: 156px; height: auto; }
.column03 .inner ul.bra img { width: 124px; height: auto; }
.container .column03 h2:after { margin: 24px auto 24px; }



/* lady gauzy */
.column04 { position: relative; width: 1086px; height: 853px; margin: 0 auto 235px; }
.column04 .visual01 { background: #fff; position: absolute; top: 0; right: 6px; z-index: 1; }
.column04 .visual01 img { width: 368px; height: auto; }
.column04 .visual02 { position: absolute; bottom: 0; right: 88px; z-index: 0; }
.column04 .visual02 img { width: 450px; height: auto; }
.column04 .inner { position: absolute; top: 148px; left: 0; width: 486px; height: 705px; box-sizing: border-box; }
.column04 .inner .rate { position: absolute; top: 518px; left: 0; }
.column04 .inner .rate-text { position: absolute; top: 558px; left: 0; }
.column04 .inner .more { position: absolute; bottom: 0; left: 0; }
.column04 .inner .review-text { position: absolute; top: 518px; right: 0; }
.column04 .inner h2 img { width: 130px; height: auto; }
.column04 .inner ul.bra img { width: 148px; height: auto; }



/* sincere */
.column05 { position: relative; width: 1086px; height: 678px; margin: 0 auto 120px; }
.column05 .visual01 { position: absolute; top: 0; left: 0; }
.column05 .visual01 img { width: 452px; height: auto; }
.column05 .inner { position: absolute; top: 0; left: 506px; width: 580px; height: 678px; }
.column05 .inner .rate { position: absolute; top: 515px; left: 45px; }
.column05 .inner .rate-text { position: absolute; top: 555px; left: 45px; }
.column05 .inner .more { position: absolute; bottom: 0; left: 45px; }
.column05 .inner .review-text { position: absolute; top: 515px; right: 0; }
.column05 .inner h2 img { width: 89px; height: auto; }
.column05 .inner ul.bra img { width: 136px; height: auto; }
.container .column05 h2:after { margin: 24px auto 24px; }



/* cherish */
.column06 { position: relative; width: 1010px; height: 886px; margin: 0 auto 140px; }
.column06 .visual01 { background: #fff; position: absolute; top: 0; left: 370px; z-index: 1; }
.column06 .visual01 img { width: 230px; height: auto; }
.column06 .visual02 { position: absolute; bottom: 0; right: 0; z-index: 0; }
.column06 .visual02 img { width: 450px; height: auto; }
.column06 .inner { position: absolute; top: 205px; left: 0; width: 433px; height: 683px; box-sizing: border-box; }
.column06 .inner .rate { position: absolute; top: 490px; left: 0; }
.column06 .inner .rate-text { position: absolute; top: 530px; left: 0; }
.column06 .inner .more { position: absolute; bottom: 0; left: 0; }
.column06 .inner .review-text { position: absolute; top: 490px; left: 225px; white-space: nowrap; }
.column06 .inner h2 img { width: 90px; height: auto; }
.column06 .inner ul.bra img { width: 152px; height: auto; }




