@charset "utf-8";
/*-------------------
   clearfix
-------------------*/
.cf:before, .cf:after {
	content: " ";
	display: table;
}
.cf:after {
	clear: both;
}
.cf {
 *zoom: 1;
}
/*-------------------
   common
-------------------*/
.wrapper {
	font: 1.0em/1.2 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-feature-settings: "palt";
	letter-spacing: .1em;
	padding: 0 0 20px;
	position: relative;
}
.wrapper * {
	box-sizing: border-box;
}
.wrapper a {
	color: inherit;
	display: block;
}
.wrapper img {
	height: auto;
	max-width: 100%;
}
#container .flex {
    align-items: flex-start;
	display: flex;
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	flex-wrap: wrap;
	margin: 0 auto;
}
/*ブレイクポイントのルール*/
/* -スマホ基本設計 解像度に依存しない-
 *350pxまで：SP縦 i5 SE
 *350px〜480px：SP縦 i6-8　****一番重要****
 *480px〜960px：SP横からタブレット
 *960px〜小型PC　大型PC
 
/*  全体指定 スマホ縦 i5 i5SE　350pxまで  */

#container .buy-btn {
    background-color: #a62b45;
    border: 2px solid #a62b45;
    color: #a62b45;
    display: inline-block;
    font: bold 1.3rem/2.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    text-align: center;
    text-decoration: none;
    padding: 0 0;
    position: relative;
    width: 100%;
}
#container .buy-btn a {
    position: relative;
    z-index: 1;
}
#container .buy-btn::before,
#container .buy-btn::after {
    content: "";
    display: block;
    background-color: #c1dbe1;
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    transition: .4s;
}
#container .buy-btn::before {
    left: 0;
}
#container .buy-btn::after {
    right: 0;
}
#container .buy-btn:hover:before,
#container .buy-btn:hover:after {
    width: 0;
    background-color: #c1dbe1;
}
#container .buy-btn:hover {
    color: #FFF;
}
/*--ボタン-やじるし--*/
#container .buy-btn a::after {
    content: '';
    width: 7px;
    height: 7px;
    border: 0px;
    border-top: solid 3px #a62b45;
    border-right: solid 3px #a62b45;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 45%;
    right: 10%;
    margin-top: -5px;
}
#container .buy-btn a:hover:after {
    border-top: solid 3px #fff;
    border-right: solid 3px #fff;
}
/*-buybtn2-*/
#container .buy-btn2 {
    background-color: #a62b45;
    border: 2px solid #a62b45;
    color: #a62b45;
    display: inline-block;
    font: bold 1.3rem/2.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    text-align: center;
    text-decoration: none;
    padding: 0 0;
    position: relative;
    width: 100%;
}
#container .buy-btn2 a {
    position: relative;
    z-index: 1;
}
#container .buy-btn2::before,
#container .buy-btn2::after {
    content: "";
    display: block;
    background-color: #fff;
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    transition: .4s;
}
#container .buy-btn2::before {
    left: 0;
}
#container .buy-btn2::after {
    right: 0;
}
#container .buy-btn2:hover:before,
#container .buy-btn2:hover:after {
    width: 0;
    background-color: #626769;
    
}
#container .buy-btn2:hover {
    border: 2px solid #a62b45;
    color: #FFF;
}
/*--ボタン-やじるし--*/
#container .buy-btn2 a::after {
    content: '';
    width: 7px;
    height: 7px;
    border: 0px;
    border-top: solid 3px #a62b45;
    border-right: solid 3px #a62b45;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 45%;
    right: 10%;
    margin-top: -5px;
}
#container .buy-btn2 a:hover:after {
    border-top: solid 3px #fff;
    border-right: solid 3px #fff;
}
/*---*/
#container {
    overflow: hidden;
}
#container section {
	margin: 0 auto;
    padding: 0 0;
}
/*----------
 mainvisual
----------*/
#container .mainvisual {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/FV-sp.jpg) top 0px left 0px no-repeat;
    background-size: 100%;
    background-color: #c1dbe1;
    /*position: absolute;*/
    top: 0;
    left: 0;
    width: 100%;
    /*height: 150vw;*/
    height: 135vw;
    padding: 0 10px;
}
#container .mainbox {
    position: relative;
    padding-top: 4vw;
    margin: 0 auto;
    z-index: 1;
}
/*-h1-*/
#container .headtitle {
    color: #000;
    font: 2rem/1.3 'YuMincho','Yu Mincho','游明朝体','ＭＳ Ｐ明朝','MS PMincho','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
    font-weight: 500;
}
#container .headtitle .small {
    font-size: 1rem;
    font-weight: 500;
}
#container .headtitle .medium {
    font-size: 1.3rem;
    font-weight: 500;
}
/*-namebox-*/
#container .namebox {
    margin: 17em auto 0;
    text-align: center;
    width: 100%;
}
#container .namebox .box {
    border-top: solid 2px #1d2088;
    border-bottom: solid 2px #1d2088;
    color: #1d2088;
    display: inline-block;
    font: 0.8rem/1.2 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin: 0 0;
    padding: 7px 2px;
    vertical-align: text-bottom;
}
#container .namebox h2 {
    color: #000;
    font: bold 1.7rem/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    display: inline-block;
    padding: 0 0;
}
#container .pricebox .price {
    color: #a62b45;
    font: 1.5rem/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin: 0 0;
    text-align: center;
}
#container .pricebox .price .small {
    font-size: 1rem;
}
#container .buy-btn {
    font-size: 1rem;
    line-height: 2.5rem;
}
/*---scroll---*/
.scroll {
    opacity: 0;
    transition: all 1.0s ease;
}
.scroll.show {
    opacity: 1;
    transform: none;
    animation: .2s fadeIn;
}
.s-left {
    transform: translate(-100px, 0);
}/*左からイン*/
.s-right {
    transform: translate(100px, 0);
}/*右からイン*/
/*-sec1-*/
#container .sec1 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back.png) top 0px left 50% repeat-y;
    background-size: 110%;
    background-color: #626769;
}   
#container .cont-box {
    /*position: relative;*/
    /*padding-top: calc(90vh - 80px);*/
    padding-top: calc(20vh - 90px);
}
#container .fff-box {
    background-color: #fff;
    box-shadow: 5px 10px 10px 0px rgba(0,0,25,0.3);
    position: relative;
    z-index: 1;
}
#container .left-box {
    margin-right: 7vw;
    padding-left: 5vw;
}
#container .right-box {
    margin-left: 7vw;
    padding: 0 5vw;
}
/*---*/
#container .fff-box:nth-of-type(1) .imgbox {
    width: 110%;
    position: absolute;
    top: -2vw;
    left: 30vw;
}
/*---*/
#container .fb {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/top-img2top.png),
                url(/contents/shop/sevenbeauty/img/freepage/probody-main/top-img2bot.png);
    background-repeat: no-repeat, no-repeat;
    background-position: top -5px right 0px,
                         bottom 0px left -70px;
    background-size: 50%, 80%;
    background-color: #fff;
}
/*---*/
#container .fff-box:nth-of-type(3) .cont {
    margin-top: 40vw;
}
#container .fff-box:nth-of-type(3) .imgbox {
    width: 80%;
    position: absolute;
    top: -33vw;
    left: 25vw;
}
/*---*/
#container .fff-box:nth-of-type(4) .cont {
    margin-top: 28vw;
}
#container .fff-box:nth-of-type(4) .imgbox {
    width: 85%;
    position: absolute;
    top: -21vw;
    left: -17vw;
}
/*---*/
#container .fff-box:nth-of-type(6) {
    margin: -30px 7vw 0 0;
}
#container .sec1back {
    width: 100%;
}
#container .fff-box:nth-of-type(6) h2 {
    letter-spacing: -0.01rem;
}
/*-textbox-*/
#container .cont {
    height: 140px;
    width: 100%;
    margin-bottom: 20px;
    padding: 10px 0;
    position: relative;
}
#container .cont .textbox,
#container .sec-cont {
    color: #000;
    font: bold 1rem/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin: 0 auto;
    padding: 0 0;
    position: relative;
    z-index: 1;
}
#container .right-box .cont {
    text-align: end;
}
#container .right-box .cont .textbox {
    text-align: left;
    display: inline-block;
}
#container .cont .textbox .number,
#container .sec-cont .number {
    border-bottom: solid 1px #000;
    display: inline-block;
    font-size: 0.5rem;
    margin-bottom: 5px;
    padding: 0 3px 5px;
}
#container .cont .textbox .des,
#container .sec-cont .des,
#container .sec-cont .small {
    display: inline-block;
    font-size: 0.8rem;
}
/*-itembox-*/
#container .item-box {
    display: grid;
    margin: -30px auto 0;
    padding: 0 10px;
    width: 100%;
}
#container .item-box .imgbox {
    margin: 0 auto;
    width: 70%;
    z-index: 1;
}
/*-namebox2-*/
#container .namebox2 {
    display: inline-table;
    text-align: center;
    margin-bottom: 20px;
    width: 100%;
    z-index: 1;
}
#container .namebox2 .box {
    border-top: solid 1px #fff;
    border-bottom: solid 1px #fff;
    color: #fff;
    display: inline-block;
    font: 0.8rem/1.2 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin: 0 10px 0 0;
    padding: 5px 2px;
    vertical-align: text-bottom;
}
#container .namebox2 h2 {
    color: #fff;
    font: bold 1.5rem/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    display: inline-block;
    padding: 5px 0 0;
}
#container .namebox2 .pricebox .price {
    color: #fff;
    font: 1.2rem/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    text-align: center;
    margin: 0 0;
}
#container .pricebox .price .small {
    font-size: 0.5rem;
    letter-spacing: -0.05rem;
}
#container .buy-btn2 {
    font-size: 0.8rem;
    line-height: 2rem;
}
#container .buy-btn2 a::after {
    border-top-width: 2px;
    border-right-width: 2px;
    width: 6px;
    height: 6px;
    top: 50%;
    right: 5%;
}
#container .buy-btn2 a:hover:after {
    width: 6px;
    height: 6px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    top: 50%;
    right: 5%;
}
/*-------
section2
-------*/
#container .sec2 .sec-cont {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-01.jpg) top 250px left 0px no-repeat;
    background-size: 190%;
    background-color: #efeaeb;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 93vh;
    padding: 20px;
}
#container .sec-cont {
    width: 100%;
    padding: 20px;
}
#container .sec-cont h2 {
    margin-bottom: 20px;
}
#container .sec-cont .des {
    text-align: justify;
    letter-spacing: 0.05rem;
}
#container .sec2 .fff-box,
#container .sec4 .fff-box {
    margin: -30px 10px 0;
    padding: 10px;
    font-size: 0.8rem;
}
#container .sec2 .fff-box h3,
#container .sec4 .fff-box h3,
#container .sec6 .sec6-box h3,
#container .sec7 h2,
#container .sec7 h4 {
    border-bottom: solid 1px #000;
    color: #000;
    font-size: 1rem;
    margin-bottom: 10px;
    padding: 5px 0;
}
#container .sec2 .fff-box .des {
    font-size: 0.8rem;
    text-align: justify;
    margin-bottom: 20px;
    padding: 0 5px;
}
#container .sec2-box .box {
    border: solid 1px #c1adad;
    margin-bottom: 10px;
    padding: 5px;
}
#container .sec2-box .minibox {
    border: solid 1px #c1adad;
    color: #c1adad;
    display: inline-block;
    font-size: 0.8rem;
    float: left;
    clear: left;
    margin: 5px 5px 0 0;
    padding: 5px 0;
    width: 50px;
    text-align: center;
}
#container .sec2-box h4 {
    border-bottom: dotted 1px #c1adad;
    text-align: center;
    margin-bottom: 5px;
}
#container .blue {
    color: #0794b8;
}
#container .green {
    color: #309b09;
}
#container .yellow {
    color: #d7860e;
}
#container .sec2-box li:nth-of-type(2) {
    padding: 10px 0;
}
#container .draw {
    background-color: #eee;
    padding: 10px;
}
/*-------
section3
-------*/
#container .sec3 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/model01.png) top 95px left 150px no-repeat;
    background-size: 80%;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
}
#container .sec3 .des {
    width: 55%;
}
/*-------
section4
-------*/
#container .sec4 .sec-cont {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-02.jpg) top 170px left -90px no-repeat;
    background-size: 160%;
    background-color: #e0dcdd;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 88vh;
    padding: 20px;
}
#container .sec4 .sec4-box {
    margin-bottom: 30px;
}
#container .sec4 .mode-box1 {
    display: flex;
    font-size: 1rem;
    text-align: center;
}
#container .sec4 .mode-box dl {
    display: inline-block;
    text-align: center;
}
#container .sec4 .mode-box1 dt {
    margin-bottom: 5px;
}
#container .sec4 .mode-box1 dd {
    color: #000;
    font-size: 0.8rem;
}
#container .sec4 .mode-box1 dd p:nth-of-type(1) {
    padding: 5px 0;
}
#container .sec4 .mode-box1 dl:nth-of-type(2) dd p:nth-of-type(1),
#container .sec4 .mode-box1 dl:nth-of-type(3) dd p:nth-of-type(1) {
    padding: 13px 0;
}
#container .sec4 .mode-box1 dd .small {
    color: #1b3e87;
    font-size: 0.6rem;
}
#container .waku {
    color: #1b3e87;
    border-bottom: solid 2px #1b3e87;
    display: inline-block;
    margin: 10px 0 5px;
    padding: 5px 15px;
}
#container .sec4 .mode-box2 div {
    display: flex;
    text-align: center;
}
#container .sec4 .mode-box2 div dl {
    width: calc(100%/4);
}
#container .sec4 .mode-box2 div dt {
    margin: 5px;
}
#container .sec4 .draw {
    margin: 10px 0 -30px;
}
#container .sec4 .sec4-box .des {
    font-size: 0.8rem;
    text-align: justify;
    margin-bottom: 10px;
}
/*-------
section6
-------*/
#container .sec6 .sec-cont {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/po5-img01.png) top 110px left 160px no-repeat;
    background-size: 75%;
    background-color: #97aabd;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 64vh;
    padding: 20px;
}
#container .sec6 .sec-cont h2 {
    letter-spacing: -0.01rem;
}
#container .sec6 .sec-cont .des {
    width: 55%;
}
#container .sec6 .sec6-box {
    margin: 20px 0 0;
}
#container .sec6 .sec6-box .des {
    font-size: 0.8rem;
    text-align: justify;
    margin-bottom: 10px;
}
#container .sec6 .sec6-box .design-box1 {
    margin-bottom: 20px;
    padding: 0 20px;
}
#container .sec6 .sec6-box .design-box2 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/model02.png) top 0px left -28px no-repeat;
    background-size: 47%;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    margin: 0 auto;
    padding: 20px 20px 5px;
}
#container .design-box2 div {
    margin: 0 0 0 auto;
    width: 67%;
}
#container .design-box2 div:nth-of-type(2) {
    display: flex;
}
#container .design-box2 div .img {
    text-align: center;
    margin: 0 0;
    width: 100%;
}
#container .design-box2 div img {
    width: 100%;
}
#container .design-box2 div .text {
    font-size: 0.8rem;
    margin: auto 0 10px -20px;
}
/*-------
section7
-------*/
#container .sec7 {
    background-color: #f3ffff;
    margin-bottom: 10px;
    padding: 30px 20px;
} 
#container .sec7 h2,
#container .sec7 h4 {
    text-align: center;
} 
#container .sec7 .sec7-box dt {
    margin: 5px 0;
    width: 100%;
}
#container .sec7 .sec7-box .des,
#container .sec7 .come {
    color: #000;
    font-size: 0.8rem;
    line-height: 1rem;
    text-align: justify;
}
#container .sec7 .sec7-box div {
    margin-bottom: 20px;
}
#container .sec7 .use-box1 dl {
    margin-bottom: 10px;
}
#container .sec7 .use-box2 dl {
    display: inline-block;
    text-align: center;
    margin-bottom: 10px;
    width: calc(97%/2);
}
/*-------
section8
-------*/
#container .sec8 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-03.png) top 0px right -207px no-repeat;
    background-size: 270%;
    background-color: #fff;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    margin: 0 0 20px;
    padding: 20px 10px 0;
}
#container .sec8 .namebox {
    margin: 15em auto 0;
}
#container .sec8 .buy-btn::before,
#container .sec8 .buy-btn::after {
    background-color: #fff;
}
#container .sec8 .buy-btn:hover:before,
#container .sec8 .buy-btn:hover:after {
    background-color: #fff;
}

@media screen and (min-width:350px) and ( max-width:480px) {
/*　スマホ縦　i6 / i6plus / i7  350pxから480pxまではここを読み込む　*/
#container .mainvisual {
    height: 140vw;
}/**/
#container .headtitle {
    font-size: 2.3rem;
}
#container .headtitle .medium {
    font-size: 1.6rem;
}
#container .namebox .box {
    font-size: 1rem;
}
#container .namebox h2 {
    font-size: 2rem;
}
#container .pricebox .price {
    font-size: 1.8rem;
}
#container .pricebox .price .small {
    font-size: 0.8rem;
    letter-spacing: 0.1rem;
}
#container .buy-btn {
    font-size: 1.2rem;
    line-height: 2.8rem;
}
#container .namebox {
    margin: 21em auto 0;
}
#container .cont-box {
    /*padding-top: calc(160vw - 90px);*/
    padding-top: 7%;
}
#container .cont .textbox {
    font-size: 1.2rem;
}
#container .cont .textbox .des {
    font-size: 0.7rem;
}
#container .cont {
    height: 160px;
}
#container .right-box {
    margin-left: 7vw;
    padding-right: 5vw;
}
/*-sec2-*/
#container .cont .textbox .number, #container .sec-cont .number {
    font-size: 0.8rem;
}
#container .cont .textbox, #container .sec-cont {
    font-size: 1.2rem;
}
#container .sec2 .sec-cont {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-01.jpg) top 210px left 0px no-repeat;
    background-size: 190%;
    background-color: #efeaeb;
    height: calc(120vw - -80px);
}
#container .sec3 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/model01.png) top 112px left 160px no-repeat;
    background-size: 80%;
}
#container .sec4 .sec-cont {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-02.jpg) top 140px left -90px no-repeat;
    background-size: 160%;
    background-color: #e0dcdd;
    height: calc(120vw - -80px);
}
#container .sec4 .mode-box1 dl:nth-of-type(2) dd p:nth-of-type(1) {
    padding: 12px 0;
}
#container .sec6 .sec-cont {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/po5-img01.png) top 120px left 170px no-repeat;
    background-size: 70%;
    background-color: #97aabd;
    height: calc(80vw - -70px);
}
#container .sec6 .sec-cont .des {
    width: 50%;
}
#container .sec8 .namebox {
    margin: 18em auto 0;
}
}

 @media screen and (min-width:480px) and ( max-width:960px) {
/*　スマホ横～タブレット 480pxから960pxまではここを読み込む　*/
#container .mainvisual {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/FV-pc.jpg) top 0px left 50% no-repeat;
    background-size: 1200px;
    background-color: #c1dbe1;
    /*position: absolute;*/
    top: 0;
    left: 0;
    width: 100%;
    /*height: 67vh;*/
    height: 57vh;
    min-height: 620px;
    padding: 0 0;
}
#container .mainbox {
    padding-top: 3vw;
    margin: 0 30px;
}
/*-h1-*/
#container .headtitle {
    font-size: 4.4rem;
}
#container .headtitle .small {
    font-size: 1.8rem;
}
#container .headtitle .medium {
    font-size: 2.8rem;
}
/*-namebox-*/
#container .namebox {
    margin: 23em 0 0;
    text-align: left;
    width: 60%;
}
#container .namebox .box {
    font-size: 1rem;
    padding: 7px 5px;
}
#container .namebox h2 {
    font-size: 2.5rem;
}
#container .pricebox .price {
    font-size: 2rem;
}
#container .pricebox .price .small {
    font-size: 1rem;
}
/*-sec1-*/
#container .sec1 {
    background-size: 800px;
}
#container .cont-box {
    /*padding-top: calc(68vh - 80px);*/
    padding-top: 5%;
}
#container .fff-box {
    box-shadow: 5px 20px 20px 0px rgba(0,0,25,0.3);
}
#container .left-box {
    margin-right: 5vw;
    padding-left: 5vw;
}
#container .right-box {
    margin-left: 5vw;
    padding-right: 5vw;
}
/*---*/
#container .fff-box:nth-of-type(1) .imgbox {
    width: 100%;
    position: absolute;
    top: -3vw;
    left: 30vw;
}
/*---*/
#container .fb {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/top-img2top.png),
                url(/contents/shop/sevenbeauty/img/freepage/probody-main/top-img2bot.png);
    background-repeat: no-repeat, no-repeat;
    background-position: top -20px right 0px,
                         bottom 0px left -150px;
    background-size: 50%, 70%;
    background-color: #fff;
}
/*---*/
#container .fff-box:nth-of-type(3) .cont {
    margin-top: 38vw;
}
#container .fff-box:nth-of-type(3) .imgbox {
    width: 80%;
    position: absolute;
    top: -33vw;
    left: 29vw;
}
/*---*/
#container .fff-box:nth-of-type(4) .cont {
    margin-top: 26vw;
}
#container .fff-box:nth-of-type(4) .imgbox {
    width: 75%;
    position: absolute;
    top: -20vw;
    left: -15vw;
}
/*---*/
#container .fff-box:nth-of-type(6) {
    margin: -120px 10vw 0 0; 
}
#container .sec1back {
    width: 100%;
}
#container .fff-box:nth-of-type(6) h2 {
    letter-spacing: 0.1em;
}
/*-textbox-*/
#container .cont {
    height: 310px;
    margin-bottom: 40px;
    padding: 30px 0;
}
#container .cont .textbox {
    font-size: 2.1rem;
}
#container .right-box .cont {
    text-align: end;
}
#container .right-box .cont .textbox {
    text-align: left;
    display: inline-block;
}
#container .cont .textbox .number {
    border-bottom: solid 1px #000;
    display: inline-block;
    font-size: 1rem;
    margin-bottom: 20px;
    padding: 0 10px 10px;
}
#container .cont .textbox .des {
    font-size: 0.9rem;
}
#container .cont .textbox .des br {
    display: none;
}
/*-itembox-*/
#container .item-box {
    display: flex;
    margin: 0 0;
    padding: 0 0;
    width: 90%;
}
#container .item-box .imgbox {
    margin: -12vw 10px 0;
}
/*-namebox2-*/
#container .namebox2 {
    text-align: left;
    width: 38vw;
}
#container .namebox2 .box {
    border-top: solid 2px #fff;
    border-bottom: solid 2px #fff;
    color: #fff;
    display: block;
    text-align: center;
    font: 1rem/1.2 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin: 0 10px 0 0;
    padding: 7px 5px;
    vertical-align: text-bottom;
}
#container .namebox2 h2 {
    color: #fff;
    font: bold 2.5rem/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    display: inline-block;
    padding: 0 0;
}
#container .namebox2 .pricebox .price {
    color: #fff;
    font: 2rem/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin: 0 0;
    text-align: center;
}
#container .buy-btn2 {
    font-size: 1.3rem;
    line-height: 2.5em;
}
/*-sec2-*/
#container .sec-cont h2 {
    margin-bottom: 30px;
}
#container .cont .textbox .number, #container .sec-cont .number {
    font-size: 0.8rem;
}
#container .sec2 .sec-cont {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-01.jpg) top 25px left -40px no-repeat;
    background-size: 120%;
    background-color: #efeaeb;
    height: 44vh;
    padding: 20px 50px;
}
#container .sec2 .sec-cont .des {
    display: flex;
    margin: 0 0 0 auto;
    width: 45%;
}
#container .sec2 .fff-box, #container .sec4 .fff-box {
    margin: -30px 50px 0;
    padding: 30px;
    font-size: 0.8rem;
}
#container .sec2 .fff-box .des {
    margin-bottom: 20px;
}
#container .sec2 .sec2-box {
    display: flex;
}
#container .sec2-box .box {
    margin: 5px 5px 20px;
    padding: 10px 5px;
}
#container .draw {
    padding: 20px 40px;
}
#container .sec2-box li:nth-of-type(3) {
    float: none;
}
#container .sec2-box li:nth-of-type(4) {
    margin-top: 5px;
}
#container .sec2 .fff-box h3, #container .sec4 .fff-box h3, #container .sec6 .sec6-box h3 {
    font-size: 1.2rem;
    margin-bottom: 14px;
    padding: 8px 0;
}
#container .sec3 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/model01.png) top 50px right -60px no-repeat;
    background-size: 55%;
    padding: 20px 50px;
}
#container .sec3 .sec-cont div {
    margin-top: 30px;
    width: 55%;
}
#container .sec4 .sec-cont {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-02.jpg) top 10px left -19px no-repeat;
    background-size: 120%;
    background-color: #e0dcdd;
    height: 58vh;
    padding: 20px 50px;
}
#container .sec4 .mode-box1 {
    font-size: 1.2rem;
    margin: 20px 40px;
}
#container .sec4 .sec4-box {
    margin-bottom: 60px;
}
#container .sec4 .mode-box1 dd {
    font-size: 1rem;
}
#container .sec4 .mode-box1 dd .small {
    font-size: 0.8rem;
}
#container .sec4 .mode-box1 dl:nth-of-type(2) dd p:nth-of-type(1) {
    padding: 14px 0;
}
#container .sec4 .mode-box1 dl:nth-of-type(3) dd p:nth-of-type(1) {
    padding: 5px 0;
}
#container .waku {
    font-size: 1rem;
    margin: 10px 5px 5px;
}
#container .sec4 .mode-box2 dd {
    font-size: 1rem;
}
#container .sec5 .sec-cont {
    padding: 50px 50px;
}
#container .sec-cont {
    font-size: 1.4rem;
    text-align: justify;
}
#container .sec5 .sec-cont h2 br {
    display: none;
}
#container .sec5 .des {
    margin-bottom: 20px;
}
#container .sec6 .sec-cont {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/po5-img01.png) top 20px right -40px no-repeat;
    background-size: 50%;
    background-color: #97aabd;
    height: 35vh;
    padding: 20px 50px;
}
#container .sec6 .sec6-box .design-box1 {
    display: flex;
    margin: 0 0 -30px;
    padding: 0 50px;
}
#container .design-box1 div:nth-of-type(1) {
    margin: 70px 10px 0 0;
}
#container .design-box1 div:nth-of-type(2) {
    margin-right: -80px;
}
#container .sec6 .sec6-box .design-box2 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/model02.png) top 0px left 50px no-repeat;
    background-size: 40%;
    padding: 20px 50px 40px;
}
#container .design-box2 div {
    margin: 54px 0 0 auto;
    width: 51%;
}
#container .design-box2 div img {
    width: 90%;
}
#container .design-box2 div .text {
    font-size: 1rem;
    margin: auto 0 20px -54px;
    width: 55%;
}
#container .sec7 {
    padding: 30px 50px;
}
#container .sec7 .sec7-box .use-box1 {
    display: flex;
}
#container .sec7 .sec7-box .use-box1 dl {
    margin: 5px 15px 20px;
    width: calc(100%/2);
}
#container .sec7 .use-box2 dl {
    margin: 0 0 10px 15px;
    width: calc(89%/3);
}
#container .sec7 .sec7-box .des {
    text-align: center;
    margin-bottom: 20px;
}
#container .sec7 .sec7-box .use-box1 .des {
    text-align: left;
}
#container .sec8 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-03.png) top 0px right -270px no-repeat;
    background-color: #fff;
    background-size: 160%;
    height: 40vh;
}
#container .sec8 .mainbox {
    padding-top: 2vw;
}
#container .sec8 .headtitle {
    font-size: 3.8rem;
}
#container .sec8 .namebox {
    margin: 1em auto 0 0;
    width: 43%;
}
#container .sec8 .buy-btn::before,
#container .sec8 .buy-btn::after {
    background-color: #c1dbe1;
}
#container .sec8 .buy-btn:hover:before,
#container .sec8 .buy-btn:hover:after {
    background-color: #c1dbe1;
}
}

 @media screen and (min-width:960px) {
/*　小・大画面デスクトップ　960pxからはここを読み込む　*/
#container .mainvisual {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/FV-pc.jpg) top 0px left 50% no-repeat;
    background-size: 1300px;
    background-color: #c1dbe1;
    /*position: absolute;*/
    top: 0;
    left: 0;
    width: 100%;
    /*height: 680px;*/
    height: 630px;
    min-height: 620px;
    padding: 0 0;
}
#container .mainbox {
    position: relative;
    padding-top: 2vw;
    width: 750px;
    height: calc(100% - 85px);
    margin: 0 auto;
    z-index: 1;
}
/*-h1-*/
#container .headtitle {
    font-size: 4.4rem;
}
#container .headtitle .small {
    font-size: 1.8rem;
}
#container .headtitle .medium {
    font-size: 2.8rem;
}
/*-namebox-*/
#container .namebox {
    text-align: left;
    margin: 24em 0 0;
    width: 60%;
}
#container .namebox .box {
    font-size: 1rem;
    padding: 7px 5px;
}
#container .namebox h2 {
    font-size: 2.5rem;
}
#container .pricebox .price {
    font-size: 2rem;
}
#container .pricebox .price .small {
    font-size: 1rem;
}
/*-sec1-*/
#container .sec1 {
    background-size: 800px;
}
#container .cont-box {
    /*padding-top: calc(90vh - 140px);*/
    /*padding-top: 750px;*/
    padding-top: 4%;
}
#container .fff-box {
    background-color: #fff;
    box-shadow: 10px 20px 30px 0px rgba(0,0,25,0.3);
    position: relative;
    z-index: 1;
}
#container .left-box {
    margin-right: 10vw;
    padding-left: 10vw;
}
#container .right-box {
    margin-left: 10vw;
    padding-right: 10vw;
}
/*---*/
#container .fff-box:nth-of-type(1) .imgbox {
    width: 80%;
    position: absolute;
    top: -2vw;
    left: 30vw;
}
/*---*/
#container .fb {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/top-img2top.png),
                url(/contents/shop/sevenbeauty/img/freepage/probody-main/top-img2bot.png);
    background-repeat: no-repeat, no-repeat;
    background-position: top -20px right 0px,
                         bottom 0px left -150px;
    background-size: 40%, 50%;
    background-color: #fff;
}
/*---*/
#container .fff-box:nth-of-type(3) .cont {
    margin-top: 24vw;
}
#container .fff-box:nth-of-type(3) .imgbox {
    width: 70%;
    position: absolute;
    top: -21vw;
    left: 34vw;
}
/*---*/
#container .fff-box:nth-of-type(4) .cont {
    margin-top: 19vw;
}
#container .fff-box:nth-of-type(4) .imgbox {
    width: 75%;
    position: absolute;
    top: -16vw;
    left: -15vw;
}
/*---*/
#container .fff-box:nth-of-type(6) {
    margin: -190px 10vw 0 0; 
}
#container .sec1back {
    width: 100%;
}
#container .fff-box:nth-of-type(6) h2 {
    letter-spacing: 0.1em;
}
/*-textbox-*/
#container .cont {
    height: 340px;
    max-width: 1000px;
    margin: 0 auto 40px;
    padding: 30px 0;
}
#container .cont .textbox {
    font-size: 2.3rem;
}
#container .right-box .cont {
    text-align: end;
}
#container .right-box .cont .textbox {
    text-align: left;
    display: inline-block;
}
#container .cont .textbox .number {
    border-bottom: solid 1px #000;
    display: inline-block;
    font-size: 1rem;
    margin-bottom: 20px;
    padding: 0 10px 10px;
}
#container .cont .textbox .des {
    font-size: 1rem;
}
#container .cont .textbox .des br {
    display: none;
}
/*-itembox-*/
#container .item-box {
    display: flex;
    margin: 0 auto;
    padding: 0 0 50px;
    width: 80%;
    max-width: 1200px;
}
#container .item-box .imgbox {
    margin: -6vw 10px 0;
    width: 60%;
}
/*-namebox2-*/
#container .namebox2 {
    text-align: left;
    margin: auto 0;
    width: 38vw;
}
#container .namebox2 .box {
    border-top: solid 2px #fff;
    border-bottom: solid 2px #fff;
    color: #fff;
    display: block;
    text-align: center;
    font: 1rem/1.2 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin: 0 10px 0 0;
    padding: 7px 5px;
    vertical-align: text-bottom;
}
#container .namebox2 h2 {
    color: #fff;
    font: bold 2.5rem/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    display: block;
    text-align: center;
    padding: 0 0;
}
#container .namebox2 .pricebox .price {
    color: #fff;
    font: 2rem/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin: 0 0;
    text-align: center;
}
#container .buy-btn2 {
    font-size: 1.3rem;
    line-height: 2.5em;
}
/*-sec2-*/
#container .cont .textbox .number, #container .sec-cont .number {
    font-size: 0.8rem;
}
#container .sec2 .backfull {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-01.jpg) top -60px left 50% no-repeat;
    background-size: 1200px;
    background-color: #efeaeb;
    top: 0;
    left: 0;
    width: 100%;
    height: 460px;
    padding: 0 0;
}
#container .sec2 .sec-cont {
    background: none;
    padding: 30px 50px;
    width: 960px;
}
#container .sec2 .sec-cont .des {
    display: flex;
    margin: 0 0 0 auto;
    width: 45%;
}
#container .sec2 .fff-box, #container .sec4 .fff-box {
    margin: -40px auto 0;
    padding: 50px;
    width: 900px;
}
#container .sec2 .fff-box .des {
    margin-bottom: 40px;
}
#container .sec2 .sec2-box {
    display: flex;
}
#container .sec2-box .box {
    margin: 5px 10px 20px;
    padding: 10px 20px;
}
#container .draw {
    text-align: center;
    padding: 20px 40px;
}
#container .draw img {
    width: 80%;
}
#container .sec2-box li:nth-of-type(3) {
    float: none;
}
#container .sec2-box li:nth-of-type(4) {
    margin-top: 5px;
}
#container .sec2 .fff-box h3, #container .sec4 .fff-box h3, #container .sec6 .sec6-box h3 {
    font-size: 1.2rem;
    margin-bottom: 14px;
    padding: 8px 0;
}
#container .sec3 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/model01.png) top 30px right 50px no-repeat;
    background-size: 40%;
    padding: 20px 50px;
}
#container .sec3 .sec-cont div {
    margin-top: 30px;
    width: 55%;
}
#container .sec4 .backfull {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-02.jpg) top -90px left 50% no-repeat;
    background-size: 1500px;
    height: 750px;
    padding: 0 0;
}
#container .sec4 .sec-cont {
    background: none;
    padding: 30px 50px;
    width: 960px;
}
#container .sec4 .mode-box1 {
    font-size: 1.2rem;
    margin: 20px 40px;
}
#container .sec4 .mode-box1 dd {
    font-size: 1.2rem;
}
#container .sec4 .mode-box1 dd br {
    display: none;
}
#container .sec4 .mode-box1 dd .small {
    font-size: 0.8rem;
}
#container .sec4 .mode-box1 dd p:nth-of-type(1) {
    padding: 13px 0 5px;
}
#container .sec4 .mode-box1 {
    text-align: center;
}
#container .sec4 .mode-box1 img {
    width: 70%;
}
#container .waku {
    font-size: 1rem;
    margin: 10px 5px 5px;
}
#container .sec4 .mode-box2 {
    padding: 0 60px;
}
#container .sec4 .mode-box2 dd {
    font-size: 1rem;
}
#container .sec4 .sec4-box {
    margin-bottom: 60px;
}
#container .sec4 .sec4-box .des {
    margin-bottom: 30px;
}
#container .sec4 .draw {
    margin: 10px 0 -60px;
}
#container .sec5 .sec-cont {
    padding: 50px 50px;
}
#container .sec-cont {
    font-size: 1.85rem;
    text-align: justify;
    margin: 0 auto;
    padding: 20px 50px;
    width: 960px;
}
#container .sec5 .sec-cont h2 br {
    display: none;
}
#container .sec6 .backfull {
    background-color: #97aabd;
    height: 320px;
    padding: 0 0;
}
#container .sec6 .sec-cont {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/po5-img01.png) top 20px right 20px no-repeat;
    background-size: 380px;
    height: 320px;
    padding: 30px 50px;
    width: 960px;
}
#container .sec6 .sec6-box {
    margin: 40px auto 0;
    width: 960px;
}
#container .sec6 .sec6-box .design-box1 {
    display: flex;
    margin: 0 0 -70px;
    padding: 0 50px;
}
#container .design-box1 div:nth-of-type(1) {
    margin: 70px 10px 0 0;
}
#container .design-box1 div:nth-of-type(2) {
    margin-right: -80px;
}
#container .sec6 .sec6-box .design-box2 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/model02.png) top 0px left 50px no-repeat;
    background-size: 30%;
    padding: 110px 50px 0;
}
#container .design-box2 div {
    margin: 25px 0 0 auto;
    width: 59%;
}
#container .design-box2 div img {
    width: 90%;
}
#container .design-box2 div .text {
    font-size: 1rem;
    margin: auto 0 20px -50px;
    width: 100%;
}
#container .sec7 .sec7-box {
    margin: 0 auto;
    padding: 20px 50px;
    width: 960px;
}
#container .sec7 .sec7-box .use-box1 {
    display: flex;
}
#container .sec7 .sec7-box .use-box1 dl {
    margin: 10px 25px;
    width: calc(100%/2);
}
#container .sec7 .use-box2 dl {
    margin: 0 0 20px 25px;
    width: calc(87%/3);
}
#container .sec7 h2, #container .sec7 h4 {
    margin-bottom: 15px;
}
#container .sec7 .come {
    margin: 0 auto;
    padding-left: 50px;
    width: 960px;
}
#container .sec7 .sec7-box .des {
    text-align: center;
}
#container .sec7 .sec7-box .use-box1 .des {
    text-align: left;
}
#container .sec8 {
    background: url(/contents/shop/sevenbeauty/img/freepage/probody-main/back-03.png) top 0px right 50% repeat-x;
    background-color: #fff;
    background-size: 1500px;
    height: 510px;
}
#container .sec8 .mainbox {
    width: 870px;
}
#container .sec8 .headtitle {
    font-size: 3.8rem;
}
#container .sec8 .namebox {
    margin: 4em 0 0;
    width: 40%;
}
#container .sec8 .buy-btn::before,
#container .sec8 .buy-btn::after {
    background-color: #c1dbe1;
}
#container .sec8 .buy-btn:hover:before,
#container .sec8 .buy-btn:hover:after {
    background-color: #c1dbe1;
}
#container .new-btn-box .width {
    width: 910px !important;
}
}

/*-------------------
   footer
-------------------*/
#container .page-top {
	display: block;
	margin: 30px auto;
	text-align: center;
}