.orb-box{
    opacity: 1;
}


/* ===========================

common

=========================== */



.sub-fv-box{
        width: 100%;
    height: 50svh;
    display: flex;
    align-items: center;
}

.sub-h1-title{
    font-size: var(--font-b);
    font-weight: bold;
    letter-spacing: .05em;
    line-height: 1em;
}

.bread-crumb{
    display: flex;
    padding-top: 10%;
}

.bread-crumb li:not(:last-child){
    position: relative;
    padding-right: 16px;
}

.bread-crumb li:not(:last-child):after{
    position: absolute;
    content: "-";
    font-size: 16px;
    top: -2px;
    right: 4px;
}

.text-link{
    border-bottom: 1px solid #fff;
}

.h3-title{
    font-size: var(--font-d);
    color: #fff;
    font-weight: bold;
}




/* ===========================

about

=========================== */




.sub-column-contents{
    display: flex;
}

.sub-column-contents:not(:first-child){
    padding-top: 20%;
}

.column-title{
    color: #fff;
    writing-mode: vertical-rl;
    position: relative;
    padding-top: 10px;
}

.column-title::before{
    content: "-";
    position: absolute;
    top: 0;
}

.sub-column-left{
    width: 30%;
}

.sub-column-right{
    width: 70%;
}

.about-detail{
    display: flex;
    width:100%;
        padding: 8% 0px;
    border-bottom: 1px solid #fff;
}

.about-detail dt{
   width: 30%;
   font-weight: bold;
}

.about-detail dd{
   width: 70%;
}


.map-box,.map-box iframe{
    width: 100%;
}

.map-address{
    color: #fff;
    display: block;
    padding-top:3%;
}


@media screen and (max-width:640px){
    .sub-column-contents{
        flex-direction: column;
    }

    .sub-column-right,
    .sub-column-left{
        width: 100%;
    }

    .column-title{
        writing-mode: horizontal-tb;
        padding-top: 0;
        font-size: 16px;
        font-weight: bold;
        padding-bottom: 8%;
        padding-left: 16px;
    }

        .column-title::before{
        left: 0;
    }

    .sub-column-contents:not(:first-child) {
    padding-top: 40% 0;
    }

    .about-detail{
            flex-direction: column;
            padding: 16% 0;
    }


    .about-detail dt{
        width: 100%;
        padding-bottom: 3%;
    }

    .about-detail dd {
    width: 100%;
        }


    .bread-crumb li:not(:last-child):after {
    top: -5px;
    right: 5px;

}
}



/* ===========================

privacy-policy

=========================== */


.sub-h2{
    padding-bottom: 4%;
    border-bottom: 1px solid #fff;
    font-size: var(--font-h);
    color: #fff;
    font-weight: bold;
}

.privacy-policy-box{
    padding: 10% 0 0 3%;
}

.pr-list{
    color: #fff;
    padding-top: 8%;
}


.pr-list dt{
    font-weight: bold;
    font-size: var(--font-i);
    padding-bottom: 2%;
}


@media screen and (max-width:640px){

    .sub-h2{
    padding-bottom: 8%;
}

    .pr-list{
    padding-top: 28%;
}

.privacy-policy-box {
    padding: 28% 0 0 3%;
}

.pr-list dt {
    padding-bottom: 8%;
}

}


/* ===========================

sitemap

=========================== */

.sitemap-box{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.sitemap-list{
    width: 48%;
    padding-bottom: 10%;
}

.sitemap-list dt{
    border-bottom: 1px solid #fff;
    padding-bottom: 6%;
    font-weight: bold;
}

.sitemap-list dt a{
    font-size: var(--font-i)!important;
}

.sitemap-list dd{
    padding: 8% 0 0 4%;
}


@media screen and (max-width:800px){

        .sitemap-box {
        padding: 0;
    }

.sitemap-list{
    width: 100%;
    padding-bottom: 28%;
}


}




@media screen and (max-width: 400px){

    .sp-img{
    display: none!important;
}

    .sp-img02{
        display: block!important;
    }
}

/* ===========================

liver-pg

=========================== */



/* アコーディオンメニュー */


.acc {
    -webkit-column-width: 100%;
}

.acc-item {
  margin-bottom: 6px;
}

.acc-btn {
  width: 100%;
  background: none;
  border: none;
  color: #fff;
  padding: 0 0 5%;
  font-weight: bold;
  cursor: pointer;
  text-align: left;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--gray02);
}

/* プラス／マイナス */
.acc-btn::after,
.acc-btn::before {
  content: "";
  position: absolute;
  right: 1.5em;
  width: 14px;
  height: 2px;
  background: #ffffffb3;
  transition: opacity .3s ease, transform .3s ease;
}

.acc-btn::before { transform: rotate(90deg); }
.acc-item.active .acc-btn::before { opacity: 0; }

.acc-content {
  overflow: hidden;
  height: 0;
  opacity: 0;
  transition: height .35s ease, opacity .35s ease;
  padding: 0 1.5em;
}

.acc-item.active .acc-content {
  opacity: 1;
  padding: 5%;
}

.acc-title{
        font-size: var(--font-i);
        font-weight:bold;
}



.acc-content{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    color: #fff;
}


.acc-box{
    width: 48%;
}

.acc-list{
    padding: 6%;
}

.acc-list li{
    position: relative;
    padding-left: 1.5em;
}


.acc-list li::before{
 content: "■";
 position: absolute;
 left: 0;
}


.tiktok-btn{
    display: block;
    background: transparent;
    margin: 16% auto 0;
    width: 50%;
    border: 1px solid #fff;
    border-radius: 200px;
}

.tiktok-btn a{
    display: block;
    width: 100%;
    margin: 0 auto;
}

.tiktok-btn img{
    width: 40%;
    display: block;
    margin: 0 auto;
}




@media screen and (max-width:800px){
    .acc-content{
        flex-direction: column;
}

.acc-box{
    width: 100%;
    padding: 10% 0;
}


}




@media screen and (max-width:640px){

    .tiktok-btn{
        width: 100%;
    }

    .tiktok-btn a{
        width: 100%;
    }

}


/* momoka */


.momoka-img{
    background: url(../img/momoka.JPG) no-repeat center top 10% / 120%;
}

/* celia */

.celia .liver-content::after{
    content: "CELIA";
}

.celia-img{
    background: url(../img/Celia.jpg) no-repeat center / cover;
}


/* suzu */

.suzu .liver-content::after{
    content: "SUZU";
}

.suzu-img{
    background: url(../img/suzu.jpg) no-repeat center / cover;
}



/* nana */

.nana .liver-content::after{
    content: "NANA";
}

.nana-img{
    background: url(../img/nana.jpg) no-repeat center / cover;
}



/* Hannah */

.hannah .liver-content::after{
    content: "HANNA";
}

.hannah-img{
    background: url(../img/Hannah.jpg) no-repeat center / cover;
}







/* ===========================

contact

=========================== */

.form-table{
    color: #fff;
    width: 100%;
}

.form-box{
        padding: 10% 0;
}

.form-table tbody,
.form-tr,
.form-tr th,
.form-tr td{
    width: 100%;
}

.form-tr td{
    color: #fff;
}


.form-tr{
    display: flex;
}


button, input, optgroup, select, textarea {
    background: #fff;
    color: var(--black);
}



input[type="radio"] {
    width: 13px;
    height: 13px;
    background: #fff;
    vertical-align: sub;
    font-weight: bold;
    position: relative;
    border-radius: 50%;
    margin-bottom: 4px;
}


input[type="radio"]:checked:before {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 7px;
    height: 7px;
    background: #000;
    border-radius: 50%;
}



input[type="text"],
input[type="tel"]{
    height: 50px;
    
}

input[type="text"],
input[type="tel"],
textarea {
    width: 100%;
    padding: 5% 3%;
}

.confirm-btn{
    width: 100%;
    display: flex;
    justify-content: center;
}

.btn{
    font-weight: bold;
    padding: 3%;
    border-radius: 100px;
    width: 50%;
    background: var(--gray);
    color: #fff;
    margin: 10% auto;
    display: block;
    text-align: center;
}


input[type="submit"]{
    background: var(--pink);
    color: #fff;
    font-weight: bold;
    padding: 3%;
    border-radius: 100px;
        width: 50%;
        margin: 0 auto;
        text-align: center;
}



th, td{
    padding: 2.5em 1.2em;
}

.type{
    padding: 3px 12px;
    margin-right: 2%;
    color: #fff;
}

.required{
    background: var(--blue);
}

.optional{
    background: var(--gray);

}


.contact-privacy-policy{
    padding: 10% 0;
    text-align: center;
}

.caution{
    color: var(--pink);
    font-size: var(--font-h);
    font-weight: bold;
}

label{
	cursor:pointer;
}




@media screen and (max-width:800px){

    .form{
            padding-bottom: 20%;
    }
    .form-tr{
        flex-direction: column;
    }

    .form-radio{
        width: 100%!important;
    }

    .form-tr td {
        padding-top: 0;
}

input[type="submit"] {
            padding: 30px;
    width: 100%;
}

.privacy-policy-box {
    padding: 20% 0;

}

input[type="radio"] {
    margin-bottom: 2px;
}

.contact-privacy-policy{
    padding: 10% 0 25%;
}
}

.error-msg {
    color: #ff4d4f!important;
    font-size: 0.9em;
    margin-top: 0.3em;
    display: block;
}

.form-radio-group {
    display: flex;
    flex-direction: column; /* エラーを下に固定 */
    gap: 0.5em;
}

.form-radio-group label {
    display: flex;
    align-items: center;
    gap: 0.3em;
}

.form-radio-group label:first-child{
    margin-bottom: 4%;
}


/* ===========================

confirm

=========================== */


.confirm-box{
    padding: 10% 0;
}

.confirm-table{
    width: 100%;
    color: #fff;
}

.btn-box{
    display: flex;
        padding: 10% 0;
}

.confirm-back-btn{
    background: var(--gray);
    color: #fff;
    font-weight: bold;
    padding: 3%;
    border-radius: 100px;
    width: 50%;
    margin: 0 auto;
    margin-left: 30px;
}

.back-btn{
    margin-bottom: 20%;
}




@media screen and (max-width:800px){
    
.confirm-box{
    padding: 20% 0;
}

.btn-box{
        padding: 20% 0;
        flex-direction: column;
}

.confirm-back-btn{
    width: 100%;
    margin-left: 0;
    margin-top: 10px;
    padding: 30px;

}

.btn{
    padding: 30px;
    width: 100%;
}

}




/* ===========================

privacy-policy

=========================== */


.pr-text{
    padding: 0 0 2% 2%;
}

.pr-subtitle{
    padding: 0 0 0% 2%;
    font-weight: bold;

}
.pr-detail{
    padding: 0 0 2% 4%;
}

.pr-detail:last-child{
    padding: 0 0 0 4%;
}

.pr-last{
        text-align: end;
    padding-bottom: 4%;
}