@charset "UTF-8";
/*
clearfix
body
img
header
kv
cv link
SALON INF0

  */
  
*{
   margin : 0;
   padding : 0;
}


body { font-family: "メイリオ",Meiryo,sans-serif; margin: 0 auto; text-align: center; z-index: 1; }
.fleft {float: left;}
.clear{ display: block; clear: both; line-height: 0px; height: 0px; }
img	{ border: 0px; }

div#navigation  { display: block; width: 100%; height: 90px; z-index: 49999; background: #FFF; position: fixed; top: 0px; left: 0px; }
div#navigation .inBlock  { width: 100%; top: 0px; z-index: 49999; background: #FFF; position: relative; }

.gnav_wrapper {
    width: 100%;
    max-height: 90px;
    height: 4%;
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
}
.gnav_logo {
    display: block;
    width: 12%;
    height: 90px;
    float: left;
    background: #000000 url('../../img/nav/nav_logo.png') no-repeat center center;
    background-size: contain;
    text-align: center;
}
.gnav_menu_about {
    float: left;
    width: 30%;
    height: 90px;
    text-align: center;
}
.gnav_menu_about .gnav_menu_content {
    border-right: 1px solid #dddddd;
}
.gnav_menu_ec {
    float: right;
    width: 30%;
    height: 90px;
    text-align: center;
}
.gnav_menu_ec .gnav_menu_content {
    border-left: 1px solid #dddddd;
}
.gnav_menu_content {
    position: relative;
    width: 25%;
    height: 100%;
    float: left;
    box-sizing: border-box;
}
.gnav_menu_content img {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
}


    .imgStyle {
        width: 100%;
        height: auto;
    }
    div.pcBox	{ display: block; width: 100%; padding: 90px 0px 0px; }
    /*div.spBox	{ display: none; }*/
    div.mainVisual  { }


    div.footer  { dipslay: block; width: 100%; padding: 15px 0px; box-sizing: border-box; background: #333; color: #FFF; overflow: hidden; text-align: center; }
    div.footer a{ color: #FFF; position: relative; width: 150px; font-size: 12px; margin: 0px 10px; text-align: center; }
    div.spfooter{ display: none; }
    div#navigation{ display: block; }
    div#navigationSp  { display: none;}
	
	.pic {
		position: relative;
		width: 1000px;
		margin: 0px auto;
	}
	.button2 {
		background: url(https://www.zacc.jp/lp/shop/images/linkbtn.jpg) no-repeat;
		width: 325px;
		height: 126px;
		position: absolute;
		z-index: 100;
		top: 43px;
		right: 40px;
	}
.push_text{
    margin-top: 20px;
    font-size: 12px;
    letter-spacing: 1px;
}

@media screen and (min-width: 650px) and (max-width: 950px){
.push_text{
    margin-top: 20px;
    font-size: 12px;
    letter-spacing: 1px;
}

.imgStyle {
    width: 100%;
    height: auto;
}
	div.pcBox	{ display: block; width: 100%; padding: 90px 0px 0px; }
	div.spBox	{ display: none; }
	div.mainVisual  { }


	/* コンバージョンボックス */
	div.convBox { }


    div.footer  { display: block; width: 100%; padding: 15px 0px; box-sizing: border-box; background: #333; color: #FFF; overflow: hidden; text-align: center; }
    div.footer a{ color: #FFF; position: relative; width: 150px; font-size: 12px; margin: 0px 10px; text-align: center; }
    div.spfooter{ display: none; }

div.ctaBox  { width: 100%; position: relative; }
div.ctaBox a.mailBtn    {
	display: block;
	position: absolute;
	bottom: 8%;
	left: 5%;
	width: 90%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
div.ctaBox a.mailBtn img    { width: 100%; height: auto; }
div.ctaBox a.telBtn    { display: block; position: absolute; bottom: 5%; left: 5%; width: 90%; }
div.ctaBox a.telBtn img    { width: 100%; height: auto; }

    /*　縦の動き　*/
    @keyframes moveY {
        0%  {bottom:30px;}
        50% {bottom:50px;}
        100%{bottom:30px;}
    }

    @-ms-keyframes moveY {
        0%  {bottom:30px;}
        50% {bottom:50px;}
        100%{bottom:30px;}
    }

    @-webkit-keyframes moveY /* Safari and Chrome */
    {
        0%  {bottom:30px;}
        50% {bottom:50px;}
        100%{bottom:30px;}
    }

    @-moz-keyframes moveY /* Firefox */
    {
        0%  {bottom:30px;}
        50% {bottom:50px;}
        100%{bottom:30px;}
    }


    /*div#navigation{ display: none; }*/
    div#navigationSp  { display: block; width: 100%; height: 90px; z-index: 20000; background: #FFF; position: fixed; top: 0px; left: 0px; }
    .gnav_menu_about .gnav_menu_content {
        border-right: 1px solid #dddddd;
    }

    ul.linkNvg  { width: 184px; overflow: hidden; float: right; margin-right: 90px; border-left: 1px solid #EEE; }
    ul.linkNvg li   { display: block; width: 90px; height: 90px; float: left; cursor: pointer; border-right: 1px solid #EEE; }
    ul.linkNvg li a { width: 90px; height: 90px; display: block; text-align: center; font-size: 12px; color: #000; text-decoration: none; padding: 60px 0px 0px; box-sizing: border-box; font-family: "Arial",sans-serif; }
    ul.linkNvg li a.cart    { background: url(../../sp/img/nav/icon_cart.png) no-repeat 50% 27%; background-size: 40%; }
    ul.linkNvg li a.login    { background: url(../../sp/img/nav/icon_login.png) no-repeat 50% 27%; background-size: 40%; }

    .gnav_logo {
        display: block;
        width: 25%;
        height: 90px;
        float: left;
        background: #000000 url('../../img/nav/nav_logo.png') no-repeat center center;
        background-size: contain;
        text-align: center;
    }
    .gnav_menu_about {
        float: left;
        width: 30%;
        text-align: center;
    }
    .gnav_menu_about .gnav_menu_content {
        border-right: 1px solid #dddddd;
    }

    #menuBoxPc {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 90px;
        z-index: 99999;
        display: none;
        background: rgba(000,000,000,0.9);
        overflow: auto;
    }

    .menu-trigger   { display: block; width: 90px; height: 90px; position: absolute; top: 0px; right:0px; cursor: pointer; }
    .menu-trigger,
    .menu-trigger span {
        display: inline-block;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }
    .menu-trigger p   { position: absolute; bottom: 19px; left: 30%; text-align: center; font-size: 12px; color: #000; font-family: "Arial",sans-serif; }

    .menu-trigger span {
        position: absolute;
        left: 27%;
        width: 40px;
        height: 2px;
        background-color: #000;
        border-radius: 1px;
    }
    .menu-trigger span:nth-of-type(1) {
        top: 21px;
    }
    .menu-trigger span:nth-of-type(2) {
        top: 32px;
    }
    .menu-trigger span:nth-of-type(3) {
        bottom: 45px;
    }
    .menu-trigger.active    { background: #000; }
    .menu-trigger.active :nth-of-type(1){
        width: 40px;
        transform: translate(0px,22px) rotate(-45deg);
        -webkit-transform: translate(0px,22px) rotate(-45deg);
        background: #FFF;
    }
    .menu-trigger.active :nth-of-type(2){
        display: none;
    }
    .menu-trigger.active :nth-of-type(3){
        width: 40px;
        transform: translate(0px,0px) rotate(45deg);
        -webkit-transform: translate(0px,0px) rotate(45deg);
        background: #FFF;
    }
    .menu-trigger.active p  { display: none; }
    #navigationSp input[type=checkbox]{
        display: none;
    }
    #navigationSp input[type=checkbox]:checked + #menuBoxPc {
        display: block;
    }
    #navigationSp label {
        z-index: 9998;
        display: block;
    }

    ul.navBox   { width: 100%; height: 100%; padding: 5px; box-sizing: border-box; -webkit-box-sizing: border-box; }
    ul.navBox li{ width: 100%; height: auto; margin-bottom: 5px; border-radius: 3px; text-align: center; box-sizing: border-box; -webkit-box-sizing: border-box;  }
    ul.navBox li a          { color: #000; background: #FFF; padding: 26px 0px 23px; height: 100%; line-height: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; display: block; font-weight: bold; font-size: 18px; text-decoration: none; }
    ul.navBox li a img      { width: 90%; margin: 0px auto; }
}


    body { font-family: "メイリオ",Meiryo,sans-serif; margin: 0 auto; text-align: center; z-index: 1; line-height: 0; }
	img { width: 100%; height: auto; line-height: 0px; font-size: 0px; }
	div.pcBox	{ display: none; }
	div.spBox	{ display: block; padding: 45px 0px 0px; }
    div.spBox .spInCont div   { line-height: 0; }
    div.cartLink    { padding: 15px; }

	/* コンバージョンボックス */
	div.convBox { width: 100%; height: auto; position: relative; }


    div.footer{ display: none; }
    div.spfooter  { display: block; width: 100%; padding: 15px 0px; box-sizing: border-box; background: #333; color: #FFF; overflow: hidden; text-align: center; }
    div.spfooter a{ color: #FFF; position: relative; font-size: 10px; margin: 0px 10px; line-height: 140%; }

    .push_text{
    margin-bottom: 30px;
    font-size: 12px;
    letter-spacing: 1px;
}




    body::before {
        display: block;
    }
    div#navigation  { width: 100%; height: 90px; z-index: 20000; background: #FFF; position: fixed; top: 0px; left: 0px; }
    .gnav_menu_about .gnav_menu_content {
        border-right: 1px solid #dddddd;
    }

    ul.linkNvg  { width: 184px; overflow: hidden; float: right; margin-right: 90px; border-left: 1px solid #EEE; }
    ul.linkNvg li   { display: block; width: 90px; height: 90px; float: left; cursor: pointer; border-right: 1px solid #EEE; }
    ul.linkNvg li a { width: 90px; height: 90px; display: block; text-align: center; font-size: 12px; color: #000; text-decoration: none; padding: 60px 0px 0px; box-sizing: border-box; font-family: "Arial",sans-serif; }
    ul.linkNvg li a.cart    { background: url(../img/nav/icon_cart.png) no-repeat 50% 27%; background-size: 40%; }
    ul.linkNvg li a.login    { background: url(../img/nav/icon_login.png) no-repeat 50% 27%; background-size: 40%; }

    .gnav_logo {
        display: block;
        width: 25%;
        height: 90px;
        float: left;
        background: #000000 url('../../img/nav/nav_logo.png') no-repeat center center;
        background-size: contain;
        text-align: center;
    }
    .gnav_menu_about {
        float: left;
        width: 30%;
        text-align: center;
    }
    .gnav_menu_about .gnav_menu_content {
        border-right: 1px solid #dddddd;
    }

    #menuBox {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 90px;
        z-index: 99999;
        display: none;
        background: rgba(000,000,000,0.9);
        overflow: auto;
    }

    .newsBox    { background-color: rgba(000,000,000,0.8); overflow: hidden;  color: #FFF; width: 100%; padding: 20px; box-sizing: border-box; -webkit-box-sizing: border-box; font-size: 18px; position: absolute; bottom: 0px; z-index:1300; }
    .newsBox div    { width: 100px; float: left; font-size: 18px; font-weight: bold; color: #ffff33; }
    .newsBox p      { width: 70%; float: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
    .underArrow {
        position: absolute;
        bottom: 100px;
        left: 50%;
        margin-left: -20px;
        animation: moveY 2s infinite alternate linear;
        -ms-animation: moveY 2s infinite alternate linear;
        -webkit-animation: moveY 2s infinite alternate linear;
        -moz-animation: moveY 2s infinite alternate linear;
        z-index: 1200;
    }
    .top_cover {
        width: 100%;
        height: 95vh;
        padding: 0;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        overflow: hidden;
        position: relative;
        z-index: 0;
    }
    .top_cover_btn {
        display: block;
        width: 40px;
        height: 40px;
        position: relative;
        margin: 0px auto 0px;
        border: 1px solid #ffffff;
        border-radius: 20px;
        -webkit-border-radius: 20px;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }
    .top_cover_btn_arrow {
        width: 10px;
        height: 10px;
        position: absolute;
        top: 12px;
        left: 50%;
        margin-left: -5px;
        border-right: 1px solid #ffffff;
        border-bottom: 1px solid #ffffff;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }

    #product    { width: 100%; clear: both; overflow: hidden; }
    .product_cover {
        height: 635px;
    }
    .product_cover_img {
        width: 100%;
        height: 635px;
        background: url('../img/product/product_cover.jpg') center center;
        background-size: cover;
    }
    .product_cartmark::before {
        content: url('img/carticon.png');
    }

    div#navigation  { width: 100%; height: 45px; z-index: 20000; background: #FFF; position: fixed; top: 0px; left: 0px; }

    .gnav_logo {
        display: block;
        width: 25%;
        height: 45px;
        float: left;
        background: #000000 url('../../img/nav/nav_logo.png') no-repeat center center;
        background-size: contain;
        text-align: center;
    }
    .gnav_menu_about {
        float: left;
        width: 30%;
        text-align: center;
    }
    .gnav_menu_about .gnav_menu_content {
        border-right: 1px solid #dddddd;
    }

    ul.linkNvg  { width: 92px; overflow: hidden; float: right; margin-right: 45px; border-left: 1px solid #EEE; }
    ul.linkNvg li   { display: block; width: 45px; height: 45px; float: left; cursor: pointer; border-right: 1px solid #EEE; }
    ul.linkNvg li a { width: 45px; height: 45px; display: block; text-align: center; font-size: 9px; color: #000; text-decoration: none; padding: 35px 0px 0px; box-sizing: border-box; font-family: "Arial",sans-serif; }
    ul.linkNvg li a.cart    { background: url(../../sp/img/nav/icon_cart.png) no-repeat 50% 25%; background-size: 40%; }
    ul.linkNvg li a.login    { background: url(../../sp/img/nav/icon_login.png) no-repeat 50% 25%; background-size: 40%; }


    /*　縦の動き　*/
    @keyframes moveY {
        0%  {bottom:30px;}
        50% {bottom:50px;}
        100%{bottom:30px;}
    }

    @-ms-keyframes moveY {
        0%  {bottom:30px;}
        50% {bottom:50px;}
        100%{bottom:30px;}
    }

    @-webkit-keyframes moveY /* Safari and Chrome */
    {
        0%  {bottom:30px;}
        50% {bottom:50px;}
        100%{bottom:30px;}
    }

    @-moz-keyframes moveY /* Firefox */
    {
        0%  {bottom:30px;}
        50% {bottom:50px;}
        100%{bottom:30px;}
    }

    #menuBox {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 45px;
        z-index: 99999;
        display: none;
        background: rgba(000,000,000,0.9);
        overflow: auto;
    }

    .menu-trigger   { display: block; width: 45px; height: 45px; position: absolute; top: 0px; right:0px; cursor: pointer; }
    .menu-trigger,
    .menu-trigger span {
        display: inline-block;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }
    .menu-trigger p   { position: absolute; bottom: 10px; left: 18%; text-align: center; font-size: 9px; color: #000; font-family: "Arial",sans-serif; }

    .menu-trigger span {
        position: absolute;
        left: 27%;
        width: 20px;
        height: 2px;
        background-color: #000;
        border-radius: 1px;
    }
    .menu-trigger span:nth-of-type(1) {
        top: 9px;
    }
    .menu-trigger span:nth-of-type(2) {
        top: 15px;
    }
    .menu-trigger span:nth-of-type(3) {
        bottom: 22px;
    }
    .menu-trigger.active    { background: #000; }
    .menu-trigger.active :nth-of-type(1){
        width: 20px;
        transform: translate(0px,14px) rotate(-45deg);
        -webkit-transform: translate(0px,14px) rotate(-45deg);
        background: #FFF;
    }
    .menu-trigger.active :nth-of-type(2){
        display: none;
    }
    .menu-trigger.active :nth-of-type(3){
        width: 20px;
        transform: translate(0px,2px) rotate(45deg);
        -webkit-transform: translate(0px,2px) rotate(45deg);
        background: #FFF;
    }
    .menu-trigger.active p  { display: none; }
    #navigation input[type=checkbox]{
        display: none;
    }
    #navigation input[type=checkbox]:checked + #menuBox {
        display: block;
    }
    #navigation label {
        z-index: 9998;
        display: block;
    }

    ul.navBox   { width: 100%; height: 100%; padding: 5px; box-sizing: border-box; -webkit-box-sizing: border-box; }
    ul.navBox li{ width: 100%; height: auto; margin-bottom: 5px; border-radius: 3px; text-align: center; box-sizing: border-box; -webkit-box-sizing: border-box;  }
    ul.navBox li a          { color: #000; background: #FFF; padding: 16px 0px 13px; height: 100%; line-height: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; display: block; font-weight: bold; font-size: 16px; text-decoration: none; }
    ul.navBox li a img      { width: 90%; margin: 0px auto; }

div.ctaBox  { width: 100%; position: relative; }
div.ctaBox a.mailBtn    {
	display: block;
	position: absolute;
	bottom: 8%;
	left: 5%;
	width: 90%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
div.ctaBox a.mailBtn img    { width: 100%; height: auto; }
div.ctaBox a.telBtn    { display: block; position: absolute; bottom: 5%; left: 5%; width: 90%; }
div.ctaBox a.telBtn img    { width: 100%; height: auto; }




/*メインビジュアル100%表示*/
.mainVisual img{
    width: 100%;
}

/*一体型フォームスマホ用*/
@media (max-width: 600px){
.orderInfoOptPrice {
    font-size: 1.1rem;
    line-height: 1.5em;
}
#orderGuest .formItem input[type="password"] ~ p:not(.error) {
    line-height: 1.5em;
    text-align: left;
}
#orderForm {
    background: #f7fbfb !important;
}
#login_modal .ds__form-table th p {
    /* float: left; */
    /* width: 100%; */
    /* text-align: left; */
    line-height: 1.5em;
    font-size: 14px;
    /* padding-top: 0.5rem; */
}
div.spBox .spInCont div {
    line-height: 1.5em;
}
}

label {
 text-align: left;
}
.lpc .txt-lx[name="ord_zip"], .lpc .txt-lx[name="deliv_zip"] {
    width: 100% !important;
    min-width: 50%;
}
select[name="ord_pref"], select[name="deliv_pref"] {
    width: 100% !important;
}

#confirmButton{
    background: #D33452 !important;
}

#orderGuest .formItem input[name^="NAME"], #orderGuest .formItem input[type="tel"], #orderGuest .formItem input[type="password"] {
    min-width: 100%;
}