/* font ------------------------------------------------------------------------------*/

.font_14 {
    font-size: 16px;
}

html {
    font-size: 16px;
}


/* font ------------------------------------------------------------------------------*/

/* color -----------------------------------------------------------------------------*/

:root{
    /*--color1:#80bcae;*/
    /*--color2:#ddebe8;*/
    --color1:#69a5b4;
    --color2:#cce0e5;    
    --color3:#897d51;
    --color4:#e4e4de;
    --white:#ffffff;
    --black:#333;
}

.linkStyle{color: var(--color1);
          border-bottom:solid 1px;
}
body#body {
    background: var(--white);
}
/* color -----------------------------------------------------------------------------*/

/* ev --------------------------------------------------------------------------------*/
#main_img{position:relative;}

#main_img::before,#intro .modal_bt span:before,#intro .modal_bt span:after,.image-container::before,.container_box::before,.container_box_pr::before {
    content: '';
    position: absolute;
    display: block;
    background-repeat: no-repeat;
    z-index: 1;
    pointer-events:none;
}
/* ev --------------------------------------------------------------------------------*/

/*top■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#main_img {
    background: var(--white);
}

.topimg_box {
    height: calc(100vh - 150px);
    width: 60vw;
    overflow: hidden;
    right: 0;
    top: 50%;
    position: absolute !important;
    transform: translate(0%, -50%);
}
.topimg01 {
    object-fit: cover;
    width: 100%;
    height: 102%;
    box-sizing: border-box;
    top: 51%;
    position: absolute !important;
    transform: translate(-50%, -50%);
    left: 50%;
}

span.catch img {
    width: calc(40vw - 8%);
    position: absolute;
    top: 44%;
    left: 4%;
    transform: translate(0%,-50%);
    z-index: 2;
}

span.item01 img {
    height: auto;
    width: 30vw;
    position: absolute;
    bottom: -7%;
    right: 44vw;
    /*transform: translate(0%,0%);*/
    z-index: 1;
    mix-blend-mode: screen;
    opacity:1;
}

span.item02 img {
    height: auto;
    width: 15vw;
    position: absolute;
    bottom: 33%;
    right: 53vw;
    /*transform: translate(0%,0%);*/
    z-index: 1;
    mix-blend-mode: screen;
    opacity:1;
}

span.item03 img {
    height: auto;
    width: 15vw;
    position: absolute;
    top: 10%;
    right: -5vw;
    /*transform: translate(0%,0%);*/
    z-index: 1;
    mix-blend-mode: screen;
    opacity:1;
}

#line_animation1 path{
     fill: none;
     stroke: #ffffff;
     stroke-width: 20vw;
     stroke-linejoin: round;
     stroke-miterlimit: 10;
}

svg#line_animation1 {
    position: absolute;
    bottom: 0%;
    width: 45vw;
    height: auto;
    left: -4vw;
}

#logo img {
    /*max-width: 180px;*/
    max-width: 230px;
}

/*#contents_wrap h2*/
#contents_wrap .text.title{
    padding-bottom: 13vh;
    line-height: 42px;
    display: block !important;
}

#contents_wrap .con_item {
    z-index: -1;
    min-width: 150px;
    width: 60%;
    opacity: 0.45;
}

#main_img::before{
    background-image: url(dup/img/light01.png),url(dup/img/light01.png);
    width: 100%;
    height: 100%;
    background-size: 35vw,18vw;
    background-position: top 18% left 13vw,top 56% left -9%;
    top: 0;
    left: 0;
    mix-blend-mode: screen;
    z-index: 4;
    opacity: 1;
}
.container_box::before {
    background-image: url(dup/img/light01.png),url(dup/img/light01.png);
    width: 100%;
    height: 120%;
    background-size: 35vw,23vw;
    background-position: top 0% right -21%,bottom 0% left -9%;
    top: -9%;
    left: 0;
    mix-blend-mode: multiply;
    z-index: 4;
    opacity: 0.2;
}
/*上下に揺らす----------------------------------------*/

#main_img::before,.item02 img{
  animation: img_box_9955 4s linear infinite;
  transform-origin: 50% 50%;
  margin: 1rem 0 !important;}
.item01 img,.item03 img{  
  animation: img_box_0000 5s linear infinite;
  transform-origin: 50% 50%;
  margin: 1rem 0 !important;}
 
.container_box::before{
  animation: img_box_2000 4s linear infinite;
  transform-origin: 50% 50%;
  margin: 1rem 0 !important;}
  
@keyframes img_box_9955 {
  0% { transform: translateY(0);opacity:1; }
  33.33333% { transform: translateY(-20px);opacity:0; }
  66.66667% { transform: translateY(0);opacity:1; }
  100% { transform: translateY(0);opacity:1; }}

@keyframes img_box_2000 {
  0% { transform: translateY(0);opacity:0.2; }
  33.33333% { transform: translateY(-20px);opacity:0.1; }
  66.66667% { transform: translateY(0);opacity:0.2; }
  100% { transform: translateY(0);opacity:0.2; }}

@keyframes img_box_0000 {
  0% { transform: translateY(0);opacity:1; }
  33.33333% { transform: translateY(-25px);opacity:0.2; }
  66.66667% { transform: translateY(0);opacity:1; }
  100% { transform: translateY(0);opacity:1; }}

/*上下に揺らす----------------------------------------*/

/*ボタン*/
#intro .modal_bt {
    border: solid 1px var(--color4);
    /*border-radius: 0px;*/
    opacity: 1 !important ;
    transition: 0.5s;
}

#intro .modal_bt:hover{
    border:solid 1px transparent;
}

#intro .modal_bt span {
    transition: 0.5s;
}
#intro .modal_bt span:before{
    transition: 0.5s;
    width: 100%;
    height: 100%;
    background: var(--white);
    top: 0;
    left: 0;
    z-index: -1;    
}

#intro .modal_bt span:after{
    width: 100%;
    height: 100%;
    background:linear-gradient(122deg, #f6f6f0 0%, var(--color2) 50%);
    top: 0;
    left: 0;
    z-index: -2;
    border-radius: 45px;    
}

#intro .modal_bt:hover span:before{
   opacity: 0;   
}

/*ボタン*/

#intro .modal_bg {
    top: 0;
    left: 0;
    background-color: rgb(155 179 173 / 50%);
    z-index: 9;
}
#intro span.bg_box{
    background: linear-gradient(122deg, #f6f6f0 0%, var(--color2) 50%);
}


#tab_buttons .stepber ul li span.active.before{
    background: linear-gradient(122deg, var(--color4) 0%, var(--color1) 70%);
}


.image-container::before {
    background: linear-gradient(122deg, #f6f6f0 0%, var(--color2) 50%);
    width: 100%;
    height: 100%;
    top: 10%;
    left: -10%;
    z-index: -1;
}

#contents_links .box_wrap .box a h4 {
    background-color: rgba(255,255,255,0.7);
}

/*top■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/*all■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#header.active #logo img {
    /*max-width: 150px;*/
    max-width: 190px;
}
.load_logo{width: 240px;}

footer .bg_box {
    display: none;
}
/*all■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/*sub■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

#page_title h2 span.font_anim {
    height: 58px;
    overflow: hidden;
}


#cms_6-c .circle, #cms_6-c .arrow {display:none;}
#cms_6-c .cate_box {margin-bottom:50px;
                    border-radius:0px 0px 5px 5px ;}
#cms_6-c h3.box_title{border-bottom:dotted 2px var(--color2);}

p.tel a {
    display: inline-block;
    padding: 20px 30px;
    margin-bottom: 20px;
    background: var(--color1);
    color: var(--white);
}

div#logo2 {
    max-width: 200px;
}

#cms_2-f .box_title1::after {
    top: 17px;
}

div#cms_3-a h4.box_title1 {
    font-size: 18px;
}

/*sub■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/


/*1536*/
@media screen and (max-width: 1536px){

}

/*1530 × 735*/
@media screen and (max-width: 1530px){

}

/*1366*/
@media screen and (max-width: 1366px){

}

/*1366*/
@media screen and (max-width: 1320px){

h2.intro_title, h2.trainer {
    font-size: min(2.2vw,30px);
}
}

/*タブレット*/
@media screen and (max-width: 768px){

#main_img {
    height: 100vh!important;
}

svg#line_animation1 {
    position: absolute;
    bottom: auto;
    top: 200px;
    width: 60vw;
    height: auto;
    left: auto;
    right: -3%;
}
.topimg_box {
    height: calc(100vh - 400px);
    width: 90vw;
    overflow: hidden;
    right: 0;
    top: auto;
    bottom: 0;
    position: absolute !important;
    transform: translate(0%, 0%);
}

span.catch img {
    width: 100%;
    position: absolute;
    top: calc(100px + 4%);
    left: 45%;
    transform: translate(-50%,0%);
    z-index: 2;
    height: calc(300px - 10%);
    object-fit: contain;
}

span.item01 img,span.item02 img,span.item03 img{
    display: none;
}

#main_img::before {
    background-image: url(dup/img/light01.png),url(dup/img/light01.png),url(dup/img/light03.png),url(dup/img/light01.png);
    width: 100%;
    height: 100%;
    background-size: 45vw,18vw,45vw,78vw;
    background-position: bottom 2% left -16%,top 59% left 3%,top 43% right -40%,top -7% right -43%;
    top: 0;
    left: 0;
    mix-blend-mode: screen;
    z-index: 4;
    opacity: 1;
}

h2.intro_title, h2.trainer {
    font-size: 30px;
}

p.intro_txt {
    padding-left: 0;
}

.image-container {
    order: 1;
    margin-top: 50px;
}

.image-container::before {
    background: linear-gradient(122deg, #f6f6f0 0%, var(--color2) 50%);
    width: 100%;
    height: 100%;
    top: 5%;
    left: -5%;
    z-index: -1;
}

.container_box::before {
    background-image: url(dup/img/light01.png),url(dup/img/light01.png);
    width: 100%;
    height: 110%;
    background-size: 35vw,23vw;
    background-position: top 0% right -21%,bottom 6% left -9%;
    top: -4%;
    left: 0;
    mix-blend-mode: multiply;
    z-index: 4;
    opacity: 0.1;
}
#contents_wrap .bg_container {
    padding: 150px 0;
    overflow: visible;
    height: 100%;
}

/*#contents_wrap h2*/
#contents_wrap .text.title{
    padding-bottom: 0;
    line-height: 1.5;
    letter-spacing: -0.04em;
    display: block !important;
}


.cms_3-a p.box_title2 {
    padding-left: 5px;
    padding-right: 10px;
}

}

/*スマホ*/
@media screen and (max-width: 667px){
#logo img {
    /*max-width: 95px;*/
    max-width: 130px;
}
#header.active #logo img {
    /*max-width: 95px;*/
    max-width: 110px;
}
figure.load_logo {
    width: 150px;
}
#page_title h2 span.font_anim {
    height: 42px;
    overflow: hidden;
    font-size: 35px;
}
#page_title {
    padding-top: 90px;
    padding-bottom: 84px;
}

p.tel a {
    display: block;
    padding: 20px 25px;
    margin-bottom: 20px;
    background: var(--color1);
    color: var(--white);
    font-size: 18px;
    letter-spacing: 1px;
}

.contact_tel p.letter_2 {
    font-size: 14px;
}

#main_img {
    height: calc(100svh - 66px) !important;
}

.topimg_box {
    height: calc(100svh - 66px -  200px);
    width: 100%;
    overflow: hidden;
    right: 0;
    top: auto;
    bottom: 0;
    position: absolute !important;
    transform: translate(0%, 0%);
}

span.catch img {
    width: 90%;
    position: absolute;
    top: 0%;
    left: 50%;
    transform: translate(-50%,-0%);
    z-index: 2;
    height: 200px;
    object-fit: contain;
}

h2.intro_title, h2.trainer {
    font-size: 22px;
    letter-spacing: 2px;
}

.container_box {
    padding-top: 50px;
    padding-bottom: 100px;
}

.intro_txt {
    padding-top: 20px;
}

.container_box::before {
    top: -9%;
}

#contents_wrap .bg_container {
    padding: 50px 0;
    overflow: visible;
    height: 100%;
}

#contents1 .con_txt ,#contents2 .con_txt ,#contents3 .con_txt {
    padding-top: 20px !important;
}

/*.tab_content .box .con_txt p */
.tab_content .box .con_txt .text.bun {
    margin-top: 10px !important;
}


#contents_wrap .tab_content .box .con_txt .title_wrap {
    padding-top: 30px;
}

#contents_wrap .bg_container {
    padding: 50px 0 120px;
    overflow: visible;
    height: 100%;
}

svg#line_animation1 {
    top: 100px;
}
.font_13_sp {
    font-size: 14px;
}
}


/*202402026*/

.tel_bt a {
    display: none;
}

footer .f_btn_box .tel_bt {
    display: none;
}

#intro .modal_bg {
    top: 0;
    left: 0;
    background-color: rgb(105 165 180 / 50%);
    z-index: 9;
}



/*20240424*/



.shop_link {
    /*bottom: 0px !important;*/
    bottom: 10px !important;
    
    right: 100px;
    position: fixed;
    background: var(--color1);
    max-width: 250px;
    width: 100%;
    height: 83px;
    z-index: 90;
}

.shop_link a{
    color:var(--white);
}

.shop_link a p{
    /*text-align: left;*/
    font-weight: bold;
    /*font-size: 16px;*/
    font-size: 20px;
    width: 100%;
    text-align: center;
}


#page-top {
    position: fixed;
    z-index: 99;
    width: 100px;
    right: 0;
    height: 83px;
    /*bottom: 0px !important;*/
    bottom: 10px !important;
    
    background: var(--color2);
}
#page-top a {
    display: block;
    width: auto;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.shop_link,#page-top{
    display: none;
}

.container_box_pr::before {
    background: linear-gradient(122deg, #f6f6f0 0%, var(--color2) 50%);
    width: 120%;
    height: 70%;
    top: 22%;
    animation: none;
    left: auto;
    z-index: -1;
    right: -30%;
    opacity: 1;
}
.container_box_pr .image-container::before {
    display: none;
    /*background: linear-gradient(122deg, #f6f6f0 0%, var(--color2) 50%);*/
    /*width: 100%;*/
    /*height: 100%;*/
    /*top: 10%;*/
    /*left: -10%;*/
    /*z-index: -1;*/
}


.container_box_pr p.intro_txt {
    font-family: 'Shippori Mincho', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
    font-size: 20px;
    line-height: 2.5;
}

.container_box_pr p.intro_txt span {
    border-bottom: solid 1px var(--white);
    padding-bottom: 2px;
    width: 70%;
    display: inline-block;
}

/*1280*/
@media screen and (max-width: 1280px){
.container_box_pr p.intro_txt {
    font-family: 'Shippori Mincho', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
    font-size: 18px;
    line-height: 2.5;
}

.container_box_pr p.intro_txt span {
    border-bottom: solid 1px var(--white);
    padding-bottom: 2px;
    width: 90%;
    display: inline-block;
}

}


/*タブレット*/
@media screen and (max-width: 768px){
    .container_box_pr p.intro_txt span {
        border-bottom: solid 1px var(--white);
        padding-bottom: 2px;
        width: 100%;
        display: inline-block;
    }

    .container_box_pr .text-container {
            order: 2 !important;
    }
    
    .container_box_pr .image-container {
            order: 1 !important;
    }
    
    .container_box_pr {
        padding-left: 5%;
        padding-right: 10%;
    }
    
    .container_box_pr p.intro_txt {
        font-size: 16px;
        line-height: 2.5;
    }
    
    .container_box_pr::before {
        background: linear-gradient(122deg, #f6f6f0 0%, var(--color2) 50%);
        width: 120%;
        height: 65%;
        top: 24%;
        animation: none;
        left: auto;
        z-index: -1;
        right: -30%;
        opacity: 1;
    }
    
    .bottom_wrap {
        padding-bottom: 100px;
    }
}


/*スマホ*/
@media screen and (max-width: 667px){
    .shop_link {
        bottom: 0px !important;
        /*bottom: 10px !important;*/
        
        right: 50px;
        position: fixed;
        background: var(--color1);
        max-width: 100%;
        width: calc(100% - 50px);
        height: 50px;
    }
    
    #page-top {
        position: fixed;
        z-index: 99;
        width: 50px;
        right: 0;
        height: 50px;
        bottom: 0px !important;
        /*bottom: 10px !important;*/
        
        background: var(--color2);
    }

    .bottom_wrap {
        padding-bottom: 70px;
    }
    
    .container_box_pr .image-container {
        order: 2 !important;
    }
    
    .container_box_pr .text-container {
        order: 1 !important;
    }
    .container_box_pr p.intro_txt {
        font-size: 16px;
        line-height: 1.5;
    }    

    .container_box_pr {
        padding-left: 5%;
        padding-right: 5%;
    }
    
    .container_box_pr::before {
        background: linear-gradient(122deg, #f6f6f0 0%, var(--color2) 50%);
        width: 120%;
        height: 50%;
        top: 6%;
        animation: none;
        left: -10%;
        z-index: -1;
        right: 0;
        opacity: 1;
    }
    
    .container_box_pr {
        padding-left: 5%;
        padding-right: 5%;
        padding-bottom: 50px;
    }
        .container_box_pr p.intro_txt span {
        border-bottom: solid 1px var(--white);
        padding-bottom: 5px;
        width: 100%;
        display: inline-block;
    }
    
        .container_box_pr p.intro_txt {
        font-size: 15px;
        line-height: 1.5;
        letter-spacing: 0.8px;
    }
    
    .container_box_pr p.intro_txt span {
        border-bottom: solid 1px var(--white);
        padding-bottom: 5px;
        width: 100%;
        display: inline-block;
        padding-top: 8px;
    }
    
}



/*20240510*/

.bottom_wrap {
    justify-content: flex-start;
}

p#copyright {
    padding-left: 50px;
}

.shop_link {
    max-width: 280px;
}

.shop_link a p {
    font-size: 25px;
}


/*スマホ*/
@media screen and (max-width: 667px){
    
    p#copyright {
        padding-left: 0px;
    }
    
    .shop_link {
        bottom: 0px !important;
        right: 50px;
        position: fixed;
        background: var(--color1);
        max-width: 100%;
        width: calc(100% - 50px);
        height: 50px;
    }
    
/*20240521*/
.shop_link a p {
    font-size: 17px;
    letter-spacing: 1px;
}
    
}


span.link_txt {
    line-height: 1.2;
}




/*20241209*/
/*オーナー実績非表示*/  
/*contents2非表示（あいさつ文下）*/
.container_box {
    display: none;
}

#contents_wrap .tab_content .box.active .con_txt .text.text.bun,.con_txt .text.text.bun {
    letter-spacing: 0.07em;
    text-align: justify;
}