@charset "UTF-8";

/*
Version: 2.2.4
*/


/*
===== CONTENTS ================================================================================

	Index:
  - Base Style
  - Layout
  
===============================================================================================
*/



/* 1: Base Style Setting
----------------------------------------------------------------------------------------------*/

/* Base Setting
==========================================================*/

body { 
    font-family: 'Noto Sans JP', sans-serif, Helvetica, Arial, "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif; 
	margin:0; padding: 0; 
    background-color:#FFF; 
    color:#535353;  
    font-weight: 300; 
    letter-spacing: 0; 
    font-size: 14px;
}

	 
a       { text-decoration: none; color:#535353; }
a:hover { /*text-decoration: underline;*/  }
a.disabled { pointer-events: none; opacity:0.5;-moz-opacity:0.5; filter: alpha(opacity=50); }
a.underline{ text-decoration: underline;}

@media screen and (min-width: 751px) {
.tellink { pointer-events: none; }
}

.latoRegular { font-family: 'Lato', sans-serif; font-weight: 400;}
.latoBold { font-family: 'Lato', sans-serif; font-weight: 700;}

@media screen and (max-width: 750px) {
    body { font-size: calc((12 / 360) * 100vw);}
}

/* main-layout
==========================================================*/

/*------------------------------------------
  Responsive Grid Media Queries - 1280, 1024, 768, 480
   1280-1024   - デスクトップ（デフォルトのグリッド）
   1024-768    - タブレット横長
   768-480     - タブレット縦長
   480-less    - スマホ
--------------------------------------------*/
@media all and (min-width: 1024px) and (max-width: 1280px) { }
 
@media all and (min-width: 768px) and (max-width: 1024px) { }
 
@media all and (min-width: 480px) and (max-width: 768px) { }
 
@media all and (max-width: 480px) { }

/* iPhoneポートレイト */
@media screen and (max-width: 480px) and (orientation:portrait) {} 
 
/* iPhoneランドスケープ */
@media screen and (max-width: 480px) and (orientation:landscape) {}
 
/* iPadポートレイト */
@media screen and (min-width: 481px) and (orientation:portrait) {}
 
/* iPadランドスケープ */
@media screen and (min-width: 481px) and (orientation:landscape) {
}


*, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box}

@media screen and (min-width: 751px) {
    .Inner1600{ max-width: 1600px; width: 100%; margin: 0 auto; box-sizing: border-box;}
    .Inner1400{ max-width: 1400px; width: 100%; margin: 0 auto; box-sizing: border-box;}
    .Inner1250{ max-width: 1250px; width: 100%; margin: 0 auto; box-sizing: border-box;}
    .Inner1200{ max-width: 1200px; width: 100%; margin: 0 auto; box-sizing: border-box;}
    .Inner1150{ max-width: 1150px; width: 100%; margin: 0 auto; box-sizing: border-box;}
    .Inner1050{ max-width: 1050px; width: 100%; margin: 0 auto; box-sizing: border-box;}
    .Inner1000{ max-width: 1000px; width: 100%; margin: 0 auto; box-sizing: border-box;}
    .Inner950{ max-width: 950px; width: 100%; margin: 0 auto; box-sizing: border-box;}
    .Inner900{ max-width: 900px; width: 100%; margin: 0 auto; box-sizing: border-box;}
}

@media screen and (min-width: 1400px) {
    .side_padding100 { padding: 0 100px;}
    .side_padding150 { padding: 0 150px;}
    .side_padding165 { padding: 0 165px;}
    .side_padding220 { padding: 0 220px;}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
    .side_padding100 { padding: 0 calc((100 / 1400) * 100vw);}
    .side_padding150 { padding: 0 calc((150 / 1400) * 100vw);}
    .side_padding165 { padding: 0 calc((165 / 1400) * 100vw);}
    .side_padding220 { padding: 0 calc((220 / 1400) * 100vw);}
}
@media screen and (max-width: 750px) {
    .side_padding100,
    .side_padding150,
    .side_padding165,
    .side_padding220 { padding: 0 calc((20 / 360) * 100vw);}
}

#wrapper  { /*overflow: hidden; */}
.wrap{ padding: 0 50px; margin: 0 auto; box-sizing: border-box;}

#Container{} 
body:not(.index) #Container { }
#Container.fixed{ } 
.pages{}


@media screen and (min-width: 751px) {
.sp-hide { display: block;}
.sp-hide-inline { display: inline;}
.sp-show { display:none !important;}
.sp-show-inline { display:none !important;}
}
@media screen and (max-width: 750px) {
/* body { font-size: 14px; } */
.sp-hide-inline, .sp-hide { display: none !important;}
.sp-show{ display:block;}
.sp-show-inline{ display:inline;}
.sp-br-none br, br.sp-br-none {display: none;}
.flex.sp-noflex { display: block;}
.wrap{ padding: 0 7%;}
.sp-pdnone{ padding: 0 !important;}
#Container.fixed{ }
}

@media screen and (min-width: 1201px) {
    .show-1200 { display: none; }
    .hide-1200 { display: block; }
    }
    @media screen and (max-width: 1200px) {
    .show-1200 { display: block; }
    .hide-1200 { display: none; }
    }
    @media screen and (min-width: 1101px) {
    .show-1100 { display: none; }
    .hide-1100 { display: block; }
    }
    @media screen and (max-width: 1100px) {
    .show-1100 { display: block; }
    .hide-1100 { display: none; }
    }
    @media screen and (min-width: 1001px) {
    .show-1000 { display: none; }
    .hide-1000 { display: block; }
    }
    @media screen and (max-width: 1000px) {
    .show-1000 { display: block; }
    .hide-1000 { display: none; }
    }
    @media screen and (min-width: 901px) {
    .show-900 { display: none; }
    .hide-900 { display: block; }
    }
    @media screen and (max-width: 900px) {
    .show-900 { display: block; }
    .hide-900 { display: none; }
    }
    @media screen and (min-width: 801px) {
        .show-800 { display: none; }
        .hide-800 { display: block; }
     }
        @media screen and (max-width: 800px) {
        .show-800 { display: block; }
        .hide-800 { display: none; }
    }
    @media screen and (min-width: 751px) {
    .show-750 { display: none; }
    .hide-750 { display: block; }
    }
    @media screen and (max-width: 750px) {
    .show-750 { display: block; }
    .hide-750 { display: none; }
    .sp-br-none br{ display: none;}
    }
    
    @media screen and (min-width: 601px) {
        .show-600 {display: none;  }
        .hide-600 { display: block;  }
    }
    @media screen and (max-width: 600px) {
        .show-600 { display: block; }
        .hide-600 { display: none; }
    }
    
    @media screen and (min-width: 501px) {
        .show-500 {display: none;  }
        .hide-500 { display: block;  }
    }
    @media screen and (max-width: 500px) {
        .show-500 { display: block; }
        .hide-500 { display: none; }
    }
    
    @media screen and (min-width: 401px) {
        .show-400 {display: none;  }
        .hide-400 { display: block;  }
    }
    @media screen and (max-width: 400px) {
        .show-400 { display: block; }
        .hide-400 { display: none; }
    }
    @media screen and (min-width:375px) {
        .show-374 {display: none;  }
        .hide-374 { display: block;  }
    }
    @media screen and (max-width: 374px) {
        .show-374 { display: block; }
        .show-800.rehide-374,
        .show-750.rehide-374,
        .show-600.rehide-374,
        .show-500.rehide-374,
        .show-500.rehide-374,
        .show-400.rehide-374,
        .hide-374 { display: none; }
    }


/* header
==========================================================*/

#headerContainer { /*height: 100px; width: 100%;  background: #eee;*/}
/* .header_inner { padding: 0 50px 0 65px;} */
#header{ height: 100%; }
#header_BGC { width: 100%; height: 100vh; position: fixed; z-index: 970; top: 0; left: 0; z-index: ; visibility: hidden; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s;}
.active #header_BGC { background-color: rgba(0, 0, 0, 0.3); visibility: visible; opacity: 1;}
#hd_logo{ position: fixed; z-index: 960; left: 0;}
.header_navbtn { position: fixed; z-index: 999;}
.menu-trigger,
.menu-trigger span { display: inline-block; transition: all.4s; box-sizing: border-box;}
.menu-trigger { position: relative; line-height: inherit; cursor: pointer; }
.menu-trigger span { position: absolute; left: 0; width: 100%; background-color: #FFF;}
.menu-trigger span:nth-of-type(1) { top: 0;}
.menu-trigger span:nth-of-type(2) { top: 50%; transform: translateY(-50%);}
.menu-trigger span:nth-of-type(3) { bottom: 0;}
.active .menu-trigger span { background-color: #535353;}
.active .menu-trigger span:nth-of-type(1) { -webkit-transform: translateY(18px) rotate(-40deg); transform: translateY(18px) rotate(-40deg);}
.active .menu-trigger span:nth-of-type(2) { opacity: 0;}
.active .menu-trigger span:nth-of-type(3) { -webkit-transform: translateY(-18px) rotate(40deg); transform: translateY(-18px) rotate(40deg);}

#g-menu { width: calc(100% - 100px); }
.g-menu li { margin-left: 2em;}
.g-menu li a{ display: block; }

#g_nav { display: none; height: 100vh; height: 100dvh; position: fixed; top: 0; right: 0; z-index: 990; background-color: #fff; }
.g_nav_top { overflow-y: scroll;}
.g_anv_list li a { color: #535353;}

.g_nav_bottom { padding: 0 5%;}
.g_nav_bottom > .flex-jcc {}

@media screen and (min-width: 1400px) {
    
}
@media screen and (min-width: 751px) {
    #hd_logo { top: 55px; width: 127px; margin-left: 65px;}
    .header_navbtn { top: 50px; right: 50px;}
    .menu-trigger { height: 40px; width: 55px;}
    .menu-trigger span { height: 4px;}

    #g_nav { width: 350px;}
    .g_nav_top { height: calc(100vh - 160px);}
    .g_anv_list { margin: 24vh auto 0;}
    .g_anv_list li { width: 125px; margin-left: 125px;}
    .g_anv_list li:not(:last-child) { margin-bottom: 70px;}

    .g_nav_bottom .hd_fb { width: 15px;}
    .g_nav_bottom .hd_insta { width: 32px; margin-left: 70px;}
    .g_nav_bottom p { padding-top: 70px;}
}
@media screen and (max-width: 750px) {
    #hd_logo { top: calc((30 / 360) * 100vw); width: calc((80 / 360) * 100vw); margin-left: calc((35 / 360) * 100vw);}
    .header_navbtn { top: calc((25 / 360) * 100vw); right: calc((25 / 360) * 100vw);}

    .active .menu-trigger span:nth-of-type(1) { transform: translateY(calc((9 / 360) * 100vw)) rotate(-40deg);}
    .active .menu-trigger span:nth-of-type(3){ transform: translateY(calc((-9 / 360) * 100vw)) rotate(40deg);}
    .menu-trigger { height: calc((20 / 360) * 100vw); width: calc((30 / 360) * 100vw);}
    .menu-trigger span { height: calc((2 / 360) * 100vw);}

    #g_nav { width: 100vw;}
    .g_nav_top { height: calc(100vh - ((100 / 360) * 100vw));height: calc(100dvh - ((100 / 360) * 100vw));}
    .g_anv_list { margin: calc((85 / 360) * 100vw) auto 0;}
    .g_anv_list li { width: calc((95 / 360) * 100vw); margin-left: auto; margin-right: auto; text-align: center;}
    .g_anv_list li:not(:last-child) { margin-bottom: calc((35 / 360) * 100vw);}

    .g_nav_bottom .hd_fb { width: calc((15 / 360) * 100vw);}
    .g_nav_bottom .hd_insta { width: calc((30 / 360) * 100vw); margin-left: calc((35 / 360) * 100vw);}
    .g_nav_bottom p { padding-top: calc((35 / 360) * 100vw);}

    #sp_menu{ height: 25px; width: 40px; cursor:pointer; position: fixed; right: 15px; top: 15px; padding-top: 15px; z-index: 9901;}
    #sp_menu span{position:absolute;display:block;content:'';}
    #sp_menu span:before{position:absolute;height:2px;width:30px;background:#fff;display:block;content:'';}
    #sp_menu span:before{bottom:-12px}
    #sp_menu span:after{position:absolute;height:2px;width:30px;background:#fff;display:block;content:'';}
    
    #sp_menu_close{ height: 25px; width: 40px; cursor:pointer; position: fixed; right: 15px; top: 15px; padding-top: 15px; display: none; z-index: 9912; }
    #sp_menu_close span{ background:none; }
    #sp_menu_close span:before,
    #sp_menu_close span:after{top:50%;left:0;position:absolute;height:2px;width:30px;background:#000;display:block;content:'';cursor:pointer;-webkit-transition: all .3s ease;transition: all .3s ease;  }
    #sp_menu_close span:before{transform:skewY(-45deg)}
    #sp_menu_close span:after{transform:skewY(45deg)}

     /* ------------------- */
    #sp_menuBk {
      /*display: none; position: fixed; z-index: 20; top: 0; width: 100%; height: 100vh;left: 0; background: rgba(0,0,0,0.6); */
    }
    #g-menu { width: 100%; }
    .g-menu{ flex-direction: column;}
    .g-menu li { margin-left: 0em;}
    #g-menu{ display: none; position: fixed; left: 0; top: 0; width: 100%; height:100vh; padding: 10%; background: #ccc; 
      -webkit-overflow-scrolling: touch; overflow-scrolling: touch; z-index: 9911 !important; overflow: scroll !important; }

    

}


/* footer
==========================================================*/
#footerContainer { }
#footer{}
#ft_logo{}
#ft_menu{}

.footermenu {}
.footermenu li{ }
.footermenu li a{   }

#copyright{ line-height:1;  }
.backTop{ z-index:1; line-height:1; }



/*  common-layout
==========================================================*/

/* color */
.c_w, 
.c_w a{ color: #fff ;}
.c_bk{ color: #000;}
.c_99{ color: #999;}

.bg_w{ background: #fff;}
.bg_fa{ background: #FAFAFA;}


	
/* ttl / fonts */

#h1outer { position: absolute; top: -100%; }

.h1_ttl{ }
.h2_ttl{  }
.h2_subttl{  }
.h2_jpttl{  }
.h2_enttl{  }
.h3_ttl{  }
.lead_ttl { }


.fn_size11 { font-size: 11px;}
.fn_size13 { font-size: 13px;}
.fn_size15 { font-size: 15px;}
.fn_size16 { font-size: 16px;}
.fn_size18 { font-size: 18px;}
.fn_size19 { font-size: 19px;}
.fn_size20 { font-size: 20px;}
.fn_size21 { font-size: 21px;}
.fn_size22 { font-size: 22px;}
.fn_size25 { font-size: 25px;}
.fn_size26 { font-size: 26px;}
.fn_size27 { font-size: 27px;}
.fn_size30 { font-size: 30px;}
.fn_size38 { font-size: 38px;}
.fn_size40 { font-size: 40px;}

@media screen and (max-width: 750px) {
    .fn_size11 { font-size: calc((9 /360) * 100vw);}
    .fn_size13 { font-size: calc((11 /360) * 100vw);}
    .fn_size15 { font-size: calc((13 /360) * 100vw);}
    .fn_size16 { font-size: calc((14 /360) * 100vw);}
    .fn_size18 { font-size: calc((16 /360) * 100vw);}
    .fn_size19 { font-size: calc((17 /360) * 100vw);}
    .fn_size20 { font-size: calc((18 /360) * 100vw);}
    .fn_size21 { font-size: calc((19 /360) * 100vw);}
    .fn_size22 { font-size: calc((20 /360) * 100vw);}
    .fn_size25 { font-size: calc((22 /360) * 100vw);}
    .fn_size26 { font-size: calc((24 /360) * 100vw);}
    .fn_size27 { font-size: calc((25 /360) * 100vw);}
    .fn_size30 { font-size: calc((28 /360) * 100vw);}
    .fn_size38 { font-size: calc((36 /360) * 100vw);}
    .fn_size40 { font-size: calc((38 /360) * 100vw);}
}

.mfns12{ font-size: 0.75em;}
.mfns13{ font-size: 0.81em;}
.mfns14{ font-size: 0.875em;}
.mfns15{ font-size: 0.937em;}
.mfns18{ font-size: 1.125em;}
.mfns19{ font-size: 1.187em;}
.mfns20{ font-size: 1.25em;}
.mfns21{ font-size: 1.312em;}
.mfns24{ font-size: 1.5em;}
.mfns26{ font-size: 1.625em;}
.mfns27{ font-size: 1.687em;}
.mfns28{ font-size: 1.75em;}
.mfns32{ font-size: 2em;}
.mfns35{ font-size: 2.18em;}
.mfns36{ font-size: 2.25em;}
@media screen and (max-width: 750px) {
.mfns24{ font-size: 1.312em;}
.mfns26{ font-size: 1.312em;}
.mfns27{ font-size: 1.312em;}
.mfns28{ font-size: 1.312em;}
.mfns32{ font-size: 1.687em;}
.mfns35{ font-size: 1.8em;}
.mfns36{ font-size: 1.8em;}
}

.fs46 { font-size: calc(46rem / 16); }
.fs40 { font-size: calc(40rem / 16); }
.fs34 { font-size: calc(34rem / 16); }
.fs33 { font-size: calc(33rem / 16); }
.fs30 { font-size: calc(30rem / 16); }
.fs29 { font-size: calc(29rem / 16); }
.fs26 { font-size: calc(26rem / 16); }
.fs25 { font-size: calc(25rem / 16); }
.fs23 { font-size: calc(23rem / 16); }
.fs24 { font-size: calc(24rem / 16); }
.fs22 { font-size: calc(22rem / 16); }
.fs20 { font-size: calc(20rem / 16); }
.fs19 { font-size: calc(19rem / 16); }
.fs18 { font-size: calc(18rem / 16); }
.fs16 { font-size: calc(16rem / 16); }
.fs15 { font-size: calc(15rem / 16); }
.fs14 { font-size: calc(14rem / 16); }
.fs12 { font-size: calc(12rem / 16); }
@media screen and (max-width: 750px){
    .fs46 { font-size: calc(46rem / 20); }
    .fs40 { font-size: calc(40rem / 20); }
    .fs34 { font-size: calc(34rem / 18); }
    .fs33 { font-size: calc(33rem / 18); }
    .fs30 { font-size: calc(30rem / 18); }
    .fs29 { font-size: calc(29rem / 18); }
    .fs26 { font-size: calc(26rem / 18); }

}


/* button */




/*  plugin
==========================================================*/


/* slider */
.scslide{visibility:hidden}
.scslide.slick-initialized{visibility:visible}


.vegas-animation-kenburns{animation:kenburns ease-out}
@keyframes kenburns {
0%{transform:scale(1.2)}
100%{transform:scale(1)}
}


/* aos */
[data-aos=fade-up]{transform:translate(0,20px)}
[data-aos=fade-left]{transform: translate3d(20px,0,0);}
[data-aos=fade-right]{transform: translate3d(20px,0,0);}
[data-aos=zoom-out]{transform:scale(1.05)}




/* 2: layout
----------------------------------------------------------------------------------------------*/




/* INDEX
-------------------*/
/* loading */
.page-index.fixed{ position:fixed ;}

.loading{position:fixed;z-index:9200;top:0;right:0;bottom:0;left:0;width:100%;height:100vh}
.loading img{animation:loadFlash 2.2s 1;opacity:0}
@keyframes loadFlash {
0%{opacity:0}
50%{opacity:1}
100%{opacity:0}
}

/* slider */
.scslide{visibility:hidden}
.scslide.slick-initialized{visibility:visible}

/* ----------------------------------------------------------------------------------------------*/
#main_visual { width: 100%; height: 100%; position: relative;}
.mv_wrapper { width: 100%; height: 100%;}
.swiper_container { width: 100%;}
.swiper_wrapper { height: 100vh; height: 100dvh; z-index: -1;}
.mv_txt { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; color: #fff; letter-spacing: 0.01em;}
.mv_txt span { display: block;}

.vegas-animation-kenburns{animation:kenburns ease-out}
@keyframes kenburns {
0%{transform:scale(1.2)}
100%{transform:scale(1)}
}
@media screen and (min-width: 751px) {
    .mv_txt { font-size: 37px;}
    .mv_txt span { font-size: 21px; margin-top: 20px;}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
}
@media screen and (max-width: 750px) {
    .mv_txt { width: 90%; font-size: calc((35 / 360) * 100vw);}
    .mv_txt span { font-size: calc((19 / 360) * 100vw); margin-top: calc((10 / 360) * 100vw);}
}


.index-bnr{ position: fixed; left: 0; bottom: 0; z-index: 10; padding: 40px 65px;}
.index-bnr ul{ margin-left: -10px; display: flex;}
.index-bnr li{ margin-left: 10px; line-height: 1;}
.index-bnr li:first-child{background: #fff; }
@media screen and (max-width: 750px){
    .index-bnr {
        padding: calc((30 / 360) * 100vw) calc((25 / 360) * 100vw);
    }
}
/* KASOU
----------------------------------------------------------------------------------------------*/
.kasou .menu-trigger span { background-color: #535353;}
@media screen and (min-width: 751px) {
    .kasou #Container { padding-top: 195px;}
}
@media screen and (max-width: 750px) {
    .kasou #Container { padding-top: calc((100 / 360) * 100vw);}
}

/* ABOUT
-------------------*/
/* #about01 */
@media screen and (min-width: 1400px) {
    #about01 { padding-bottom: 70px;}
    #about01 .Inner1400 > .flex-jcs { padding-bottom: 110px;}
    .about01_left { width: 435px;}
    .about01_right { width: 560px;}
    .about01_left h1 { margin-bottom: 45px;}
} 
@media screen and (min-width: 751px) and (max-width: 1399px) {
    #about01 { padding-bottom: calc((70 / 1400) * 100vw);}
    #about01 .Inner1400 > .flex-jcs { padding-bottom: calc((110 / 1400) * 100vw);}
    .about01_left { width: calc((435 / 1400) * 100vw);}
    .about01_right { width: calc((560 / 1400) * 100vw);}
    .about01_left h1 { margin-bottom: calc((45 / 1400) * 100vw);}
}
@media screen and (max-width: 750px) {
    #about01 { padding-bottom: calc((35 / 360) * 100vw);}
    #about01 .Inner1400 > .flex-jcs { padding-bottom: calc((55 / 360) * 100vw);}
    .about01_left { width: 100%; margin-bottom: calc((20 / 360) * 100vw);}
    .about01_right { width: 100%;}
    .about01_left h1 { margin-bottom: calc((20 / 360) * 100vw);}
}

/* #about02 */
.instaAccount a { position: relative;}
.instaAccount a::before { position: absolute; top: -2px; left: 0; content: ""; width: 25px; height: 25px; background-image: url(../images/common/instagram.svg); background-position: center; background-repeat: no-repeat; background-size: cover;}
@media screen and (min-width: 1400px) {
    #about02 { padding-bottom: 145px;}
    #about02 h2 { margin-bottom: 55px;}
    .about02_right { margin-left: 100px;}
    #about02 h3 { margin: 35px 0;}
    .instaAccount { margin-top: 45px;}
    .about02img { width: 215px; margin-left: 40px;}
}
@media screen and (min-width: 751px) {
    .instaAccount a { padding-left: 35px;}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
    #about02 { padding-bottom: calc((145 / 1400) * 100vw);}
    #about02 h2 { margin-bottom: calc((55 / 1400) * 100vw);}
    #about02 h3 { margin: calc((35 / 1400) * 100vw) 0;}
    .instaAccount { margin-top: calc((45 / 1400) * 100vw);}
}
@media screen and (min-width: 891px) and (max-width: 1399px) {
    #about02 .Inner1400 .flex { flex-wrap: nowrap;}
    .about02_right { margin-left: calc((80 / 1400) * 100vw);}
    .about02img { width: calc((215 / 1400) * 100vw); margin-left: calc((40 / 1400) * 100vw);}
}
@media screen and (max-width: 890px) {
    .about02_left,
    .about02_right { width: 100%;}
    .about02_left > .flex,
    .about02_right > .flex { justify-content: center;}
    .about02img { box-sizing: border-box;}
}
@media screen and (min-width: 751px) and (max-width: 890px) {
    .about02_right { margin-left: 0; margin-top: calc((80 / 1400) * 100vw);}
    .about02_txtBox { width: calc((500 / 1400) * 100vw);}
    .about02img { width: calc(100% - ((750 / 1400) * 100vw)); padding-left: calc((10 / 1400) * 100vw);}
}
@media screen and (max-width: 750px)  {
    #about02 { padding-bottom: calc((70 / 360) * 100vw);}
    .about02_left > .flex,
    .about02_right > .flex { flex-direction: column-reverse;}
    .about02img { width: 100%; text-align: center;}
    .about02_txtBox { max-width: 430px; width: 100%; margin: 0 auto;}
    #about02 h2 { margin-bottom: calc((25 / 360) * 100vw);}
    .instaAccount a { padding-left: calc((22 / 360) * 100vw);}
    .instaAccount a::before { top: 2px; width: calc((15 /360) * 100vw); height: calc((15 /360) * 100vw);}
    .about02_right { margin-left: 0; margin-top: calc((40 / 360) * 100vw);}
    #about02 h3 { margin: calc((15 / 360) * 100vw) 0;}
    .instaAccount { margin-top: calc((20 / 360) * 100vw);}
}

/* #about03 */
.about03_right { box-sizing: border-box;}
.about03_right iframe,
.sp_map iframe { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%);}

#about03 dl dt { width:105px; box-sizing: border-box; padding-right: 5px;}
#about03 dl dd { width: calc(100% - 105px);}
.mailbtn a { position: relative; background-color: #535353; color: #fff; padding: 7px 45px 7px 15px; letter-spacing: 0.075em;}
.mailbtn a::after { position: absolute; top: 11px; right: 15px; content: ""; width: 17px; height: 12px; background-image: url(../images/common/mail.svg); background-position: center; background-position: center; background-repeat: no-repeat; background-size: cover;}
@media screen and (min-width: 1400px) {
    #about03 { padding-bottom: 115px;}
    .about03_left { width: 455px;}
    .about03_right { width: calc(100% - 455px); padding-left: 75px; height: 295px;}
    #about03 dl dt,
    #about03 dl dd { margin-top: 45px;}
    .mailbtn { margin-left: 25px;}
    .sp_map { display: none;}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
    #about03 { padding-bottom: calc((115 / 1400) * 100vw);}
    #about03 dl dt,
    #about03 dl dd { margin-top: calc((45 / 1400) * 100vw);}
}

@media screen and (min-width: 861px) and (max-width: 1399px) {
    .mailbtn { display: block; margin-top: calc((25 / 1400) * 100vw); margin-left: 0;}
}
@media screen and (min-width: 861px) and (max-width: 1399px) {
    .sp_map { display: none;}
    .about03_right { width: calc(100% - ((455 / 1400) * 100vw)); padding-left: calc((75 / 1400) * 100vw); height: calc((295 / 1400) * 100vw);}
    .about03_left { width: calc((455 / 1400) * 100vw);}
}
@media screen and (max-width: 860px) {
    .about03_right { display: none;}
    .about03_left { width: 100%;}
}
@media screen and (min-width: 751px) and (max-width: 860px) {
    .sp_map { margin-top: calc((45 / 1400) * 100vw); width: 100%; height: calc((600 / 1400) * 100vw);}
    .mailbtn { margin-top: 0; margin-left: calc((25 / 1400) * 100vw);}
}
@media screen and (max-width: 750px) {
    #about03 { padding-bottom: calc((55 / 360) * 100vw);}
    .sp_map { margin-top: calc((20 / 360) * 100vw); width: 100%; height: calc((200 / 360) * 100vw);}
    #about03 dl dt,
    #about03 dl dd { width: 100%;}
    #about03 dl dt { margin-top: calc((25 / 360) * 100vw);}
    #about03 dl dd { margin-top: calc((10 / 360) * 100vw);}
    .mailbtn { margin-left: calc((15 / 360) * 100vw);}
}

/* STUDIO
-------------------*/
/* #studio01 */
.studio01_left { box-sizing: border-box;}
.pdfbtn a { position: relative; display: block; padding: 15px 0; text-align: center; background-color: #f2f2f2; letter-spacing: 0.1em;}
.pdfbtn a::after { position: absolute; top: 20px; right: 15px; content: ""; width: 33px; height: 15px; background-image: url(../images/common/pdf.svg); background-position: center; background-repeat: no-repeat; background-size: cover;}

.tab_box { margin: 0 auto;}
.tab_box .tabNavUl li { width: 60px; height: 30px; background-color: #f2f2f2; display: flex; justify-content: center; align-items: center; transition: all .3s; cursor: pointer;}
.tab_box .tabNavUl li:hover { opacity: 0.6;}
.tab_box .tabNavUl li:not(:last-child) { border-right: 0.5px solid #000;}
.tab_box .tabNavUl li.active { background-color: #535353; color: #fff; pointer-events: none;}
.galleryslide,
.tab_panel{ min-height: 444px;}
.tab_panel:not(:first-child) { display: none;}
@media screen and (min-width: 1400px) {
    #studio01 { padding-bottom: 170px;}
    .studio01_left { width: 120px; padding-right: 10px;}
    .studio01_right { width: calc(100% - 120px);}
    .pdfbtn:last-child { margin-left: 65px;}
    .pdfbtn a { width: 270px;}
    .about01img { width: 555px; margin: 130px auto 145px;}
    .tabNavWrap { margin-bottom: 40px;}

    .tab_box { width: 635px;}
}
@media screen and (min-width: 1001px) and (max-width: 1399px) {
    .studio01_left { width: calc((120 / 1400) * 100vw); padding-right: calc((10 / 1400) * 100vw);}
    .studio01_right { width: calc(100% - ((120 / 1400) * 100vw));}
}
@media screen and (min-width: 751px) and (max-width: 1000px) {
    .studio01_left { width: 100%;}
    .studio01_right { width: 100%; padding-top: calc((45 / 1400) * 100vw);}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
    #studio01 { padding-bottom: calc((170 / 1400) * 100vw);}
    .pdfbtn:last-child { margin-left: calc((65 / 1400) * 100vw);}
    .pdfbtn a { width: 260px;}
    .about01img { width: calc((555 / 1400) * 100vw); margin: calc((130 / 1400) * 100vw) auto calc((145 / 1400) * 100vw);}

    .tab_box { width: calc((635 / 1400) * 100vw);}
    .tabNavWrap { margin-bottom: calc((40 / 1400) * 100vw);}
}
@media screen and (max-width: 750px) {
    #studio01 { padding-bottom: calc((85 / 360) * 100vw);}
    .studio01_left { width: 100%;}
    .studio01_right { width: 100%; padding-top: calc((20 / 360) * 100vw);}
    .pdfbtn { width: 100%;}
    .pdfbtn:last-child { margin-top: calc((30 / 360) * 100vw);}
    .pdfbtn a { width: 100%;}
    .pdfbtn a::after { right: calc((19 / 360) * 100vw); width: calc((35 / 360) * 100vw); height: calc((16 / 360) * 100vw);}
    .about01img { width: calc((275 / 360) * 100vw); margin: calc((65 / 360) * 100vw) auto calc((70 / 360) * 100vw);}
    .galleryslide,
    .tab_panel{ min-height: 52.4vw;}
    .tab_box { width: calc((270 / 360) * 100vw);}
    .tabNavWrap { margin-bottom: calc((20 / 360) * 100vw);}
    .tab_box .tabNavUl li { width: calc((35 / 360) * 100vw); height: calc((20 / 360) * 100vw);}
}


/* slick */
.slide_arrow { width: 24px; height: 24px; position: absolute; cursor: pointer; transition: all .3s;}
.slide_arrow:hover { opacity: 0.6;}
.prev_arrow { top: 50%; content: ""; border-top: 1px solid #535353; border-left: 1px solid #535353; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.next_arrow { top: 50%; content: ""; border-top: 1px solid #535353; border-right: 1px solid #535353; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
@media screen and (min-width: 1400px) {
    .prev_arrow { left: -85px;}
    .next_arrow { right: -85px;}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
    .prev_arrow { left: calc((-85 / 1400) * 100vw);}
    .next_arrow { right: calc((-85 / 1400) * 100vw);}
}
@media screen and (max-width: 750px) {
    .prev_arrow { left: calc((-20 / 360) * 100vw);}
    .next_arrow { right: calc((-20 / 360) * 100vw);}
}


/* BOOKING
-------------------*/
/* #booking01 */
.booking01_left { box-sizing: border-box;}
#booking01 dl { line-height: 1.8; width: 100%; box-sizing: border-box; border-bottom: 0.5px solid #000;}
#booking01 dt { font-weight: 500;}

.cancelPriceWrap table { width: 100%; box-sizing: border-box;}

.calendarWrap iframe{ width: 100%; height: 100%;border: none;}
@media screen and (min-width: 1400px) {
    #booking01 { padding-bottom: 90px;}
    .booking01_left { width: 170px; padding-right: 10px;}
    .booking01_right { width: calc(100% - 170px); max-width: 830px;}
    #booking01 dl { padding: 65px 30px 50px 0;}
    #booking01 dt:nth-of-type(2) { margin-top: 40px;}
    #booking01 dt:nth-of-type(3) { margin-top: 35px;}

    .cancelPriceWrap table { margin: 55px 0 90px;}
    .cancelPriceWrap table th:first-child { min-width: 200px;}
    .cancelPriceWrap table td { max-width: 215px;}

    .calendarWrap { width: 800px; height: 800px;}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
    #booking01 { padding-bottom: calc((90 / 1400) * 100vw);}
    .booking01_left { width: calc((170 / 1400) * 100vw); padding-right: calc((10 / 1400) * 100vw);}
    .booking01_right { width: calc(100% - ((170 / 1400) * 100vw)); max-width: calc((830 / 1400) * 100vw);}
    #booking01 dl { padding: calc((65 / 1400) * 100vw) calc((30 / 1400) * 100vw) calc((50 / 1400) * 100vw) 0;}
    #booking01 dt:nth-of-type(2) { margin-top: calc((40 / 1400) * 100vw);}
    #booking01 dt:nth-of-type(3) { margin-top: calc((35 / 1400) * 100vw);}

    .cancelPriceWrap table { margin: calc((55 / 1400) * 100vw) 0 calc((90 /1400) * 100vw);}
    .cancelPriceWrap table th:first-child { min-width: calc((200 / 1400) * 100vw);}
    .cancelPriceWrap table td { max-width: calc((215 / 1400) * 100vw);}

    .calendarWrap { width: calc((800 / 1400) * 100vw); height: calc((900 / 1400) * 100vw);}
}
@media screen and (max-width: 750px) {
    #booking01 { padding-bottom: calc((45 / 360) * 100vw);}
    .booking01_left { width: 100%; /*padding-bottom: calc((20 / 360) * 100vw);*/}
    .booking01_right { width: 100%; max-width: auto;}
    #booking01 dl { padding: calc((30 / 360) * 100vw) calc((15 / 360) * 100vw) calc((25 / 360) * 100vw) 0;}
    #booking01 dt:nth-of-type(2) { margin-top: calc((20 / 360) * 100vw);}
    #booking01 dt:nth-of-type(3) { margin-top: calc((15 / 360) * 100vw);}

    .cancelPriceWrap .sp-show > div { margin-top: calc((25 / 360) * 100vw);}
    .cancelPriceWrap table { margin: calc((25 / 360) * 100vw) 0 calc((45 /360) * 100vw);}
    .cancelPriceWrap table td { max-width: calc((105 / 360) * 100vw);}

    .calendarWrap { width: 100%; height: calc((450 / 360) * 100vw);}
}

/* #booking02 */
@media screen and (min-width: 1400px) {
    .booking02_top_txt { margin: 35px 0 60px;}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
    .booking02_top_txt { margin: calc((35 / 1400) * 100vw) 0 calc((60 / 1400) * 100vw);}
}
@media screen and (max-width: 750px) {
    .booking02_top_txt { margin: calc((15 / 360) * 100vw) 0 calc((30 / 360) * 100vw);}
}

/* CONTACT
==========================================================*/
.contact_table { width: 100%; font-family: "游ゴシック", "Yu Gothic", YuGothic;}
.table_list { width: 100%; display: table; letter-spacing: 0.05em; border-top: 1px solid #eaeaea; display: flex; align-items: center;}
.table_list dt { box-sizing: border-box;}
.input_area { width: 100%; letter-spacing: 0.05em; border: none; line-height: 2em; background-color: #f0f0f0; font-family: "游ゴシック", "Yu Gothic", YuGothic; font-size: 18px;}
.taxtareaWrap dl { align-items: flex-start; border-bottom: 1px solid #eaeaea;}
textarea { width: 100%; border: none; background-color: #f0f0f0; box-sizing: border-box; font-family: "游ゴシック", "Yu Gothic", YuGothic; font-size: 18px;}

.checkbox { text-align: center; font-family: "游ゴシック", "Yu Gothic", YuGothic; letter-spacing: 0.05em;}
input[type="checkbox"] { display: none;}
.checkbox label { position: relative; cursor: pointer;}
.checkbox label::before, .radio label::before { content: ""; background-color: #535353; position: absolute; top: 50%; left: 0; transform: translateY(-50%); transition: all .4s;}
.checkbox label::after, .radio label::after { opacity: 0; content: ""; position: absolute; top: 3%; left: 4%; transform: translateY(-50%); transition: all .4s; width: 20px; height: 10px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg);}
input[type="checkbox"]:checked + .check::after { opacity: 1;}
.PPlink { text-align: center; font-family: "游ゴシック", "Yu Gothic", YuGothic; letter-spacing: 0.05em;}
.PPlink span { color: #e43b23;}
.PPlink a { text-decoration: underline;}
.submitBtn span { text-align: center; display: inline-block; position: relative;}
.submitBtn #submit { cursor: pointer; text-align: center; display: inline-block; background-color: #535353; color: #fff; letter-spacing: 0.1em;}
.error_box { display: none; width: 100%; text-align: center; box-sizing: border-box; border: 1px solid #d00; color: #d00; line-height: 2;}
/* form */
input, button, select { margin: 0; padding: 0; background: none; border: none; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
@media screen and (min-width: 1400px) {
    .table_list { padding: 25px 0;}
    .table_list dt { width: 240px; padding-right: 10px;}
    .table_list dd { width: calc(100% - 240px);}
    .input_area { height: 80px; padding: 0 30px;}
    .taxtareaWrap dl dt { padding-top: 30px;}
    textarea { height: 275px; padding: 30px;}

    .checkbox { margin-top: 55px;}
    .PPlink { margin: 50px 0;}
    .submitBtn { padding-bottom: 100px;}
    .error_box { padding: 25px 20px; margin-bottom: 50px;}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
    .table_list { padding: calc((25 / 1400) * 100vw) 0;}
    .table_list dt { width: calc((240 / 1400) * 100vw); padding-right: calc((10 / 1400) * 100vw);}
    .table_list dd { width: calc(100% - ((240 / 1400) * 100vw));}
    .input_area { height: calc((80 / 1400) * 100vw); padding: 0 calc((30 / 1400) * 100vw);}
    .taxtareaWrap dl dt { padding-top: calc((30 / 1400) * 100vw);}
    textarea { height: calc((275 / 1400) * 100vw); padding: calc((30 / 1400) * 100vw);}

    .checkbox { margin-top: calc((55 / 1400) * 100vw);}
    .PPlink { margin: calc((50 / 1400) * 100vw) 0;}
    .submitBtn { padding-bottom: calc((100 / 1400) * 100vw);}
    .error_box { padding: calc((25 / 1400) * 100vw) calc((20 / 1400) * 100vw); margin-bottom: calc((50 / 1400) * 100vw);}
}
@media screen and (min-width: 751px) {
    .checkbox label { padding-left: 60px;}
    .checkbox label::before, .radio label::before { width: 45px; height: 45px;}
    .submitBtn #submit { min-width: 285px; padding: 10px; font-size: 26px;}
}
@media screen and (max-width: 750px) {
    .table_list { padding: calc((15 / 360) * 100vw) 0; display: block;}
    .table_list dt { width: 100%; padding-bottom: calc((5 / 360) * 100vw);}
    .table_list dd { width: 100%;}
    .input_area { height: calc((40 / 360) * 100vw); padding: 0 calc((15 / 360) * 100vw); font-size: 16px;}
    .taxtareaWrap dl dt { padding-top: calc((15 / 360) * 100vw);}
    textarea { height: calc((135 / 360) * 100vw); padding: calc((15 / 360) * 100vw);}

    .checkbox { margin-top: calc((25 / 360) * 100vw);}
    .checkbox label { padding-left: calc((30 / 360) * 100vw);}
    .checkbox label::before, .radio label::before { width: calc((20 / 360) * 100vw); height: calc((20 / 360) * 100vw);}
    .checkbox label::after, .radio label::after { opacity: 0; content: ""; position: absolute; top: 25%; left: 2%; width: calc((10 / 360) * 100vw); height: calc((5 / 360) * 100vw);}
    .PPlink { margin: calc((25 / 360) * 100vw) 0;}
    .submitBtn { padding-bottom: calc((50 / 360) * 100vw);}
    .submitBtn #submit { min-width: calc((140 / 360) * 100vw); padding: calc((5 / 360) * 100vw); font-size: calc((24 / 360) * 100vw);}
    .error_box { padding: calc((12 / 360) * 100vw) calc((10 / 360) * 100vw); margin-bottom: calc((25 / 360) * 100vw);}
}


/* recaptcha */
.g-recaptchaInner { margin-bottom: calc((50 / 1400) * 100vw); display: flex; justify-content: center;}
input:disabled,
input:disabled:hover {
 cursor: default;
 opacity: 0.5 !important;

 }
 @media screen and (max-width: 750px) {
    .g-recaptchaInner { margin-bottom: calc((25 / 360) * 100vw);}
}

/* PRIVACY POLICY
-------------------*/
@media screen and (min-width: 1400px) {
    #thanks01 { padding-bottom: 100px;}
    #thanks01 h1 {margin-bottom: 80px;}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
    #thanks01 { padding-bottom: calc((100 / 1400) * 100vw);}
    #thanks01 h1 {margin-bottom: calc((80 / 1400) * 100vw);}
}
@media screen and (max-width: 750px) {
    #thanks01 { padding-bottom: calc((50 / 360) * 100vw);}
    #thanks01 h1 {margin-bottom: calc((40 / 360) * 100vw);}
}


/* PRIVACY POLICY
-------------------*/
@media screen and (min-width: 1400px) {
    #privacypolicy01 { padding-bottom: 100px;}
    #privacypolicy01 h1 { margin-bottom: 60px;}
    #privacypolicy01 dd { margin-bottom: 30px;}
}
@media screen and (min-width: 751px) and (max-width: 1399px) {
    #privacypolicy01 { padding-bottom: calc((100 / 1400) * 100vw);}
    #privacypolicy01 h1 { margin-bottom: calc((60 / 1400) * 100vw);}
    #privacypolicy01 dd { margin-bottom: calc((30 / 1400) * 100vw);}
}
@media screen and (max-width: 750px) {
    #privacypolicy01 { padding-bottom: calc((50 / 360) * 100vw);}
    #privacypolicy01 h1 { margin-bottom: calc((30 / 360) * 100vw);}
    #privacypolicy01 dd { margin-bottom: calc((15 / 360) * 100vw);}
}
/* 
----------------------------------------------------------------------------------------------*/