@charset "UTF-8";

/*
Version: 2.2.4
*/


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

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



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

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

body { font: 16px/1.8 'Shippori Mincho', "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif; 
	 margin:0; padding: 0; background-color:#FFF; color:#222;  font-weight: 400; letter-spacing: 0.08em; }

	 
a       { text-decoration: none; color:#000; }
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; }
}

.fn-Shippori{ font-family: 'Shippori Mincho', serif;}

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



#wrapper  { /*overflow: hidden; */}
.wrap{ padding: 0 50px; margin: 0 auto; box-sizing: border-box;}
.Inner1500{ max-width: 1500px; width: 100%; margin: 0 auto; box-sizing: border-box;}
.Inner1400{ max-width: 1400px; width: 100%; margin: 0 auto; box-sizing: border-box;}
.Inner1300{ max-width: 1300px; width: 100%; margin: 0 auto; box-sizing: border-box;}
.Inner1200{ max-width: 1200px; width: 100%; margin: 0 auto; box-sizing: border-box;}
.Inner1100{ max-width: 1100px; width: 100%; margin: 0 auto; box-sizing: border-box;}
.Inner1000{ max-width: 1000px; width: 100%; margin: 0 auto; box-sizing: border-box;}
.Inner900{ max-width: 900px; width: 100%; margin: 0 auto; box-sizing: border-box;}
.Inner800{ max-width: 800px; width: 100%; margin: 0 auto; box-sizing: border-box;}
.Inner750{ max-width: 750px; width: 100%; margin: 0 auto; box-sizing: border-box;}


/* #Container{ padding-top: 100px; }  */
body:not(.index) #Container { }
#Container.fixed{ } 
#Container{}
.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
==========================================================*/



/* footer
==========================================================*/
#footerContainer { }
#footer{position: absolute; bottom: 0; left: 0; width: 100%; text-align: center;  height: 40px;}
#footer p { font-size: 10px; line-height: 40px;}
#ft_logo{}
#ft_menu{}

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



@media screen and (max-width: 750px) {
    #footer{height: 30px;}
    #footer p { line-height: 30px;}
}

/*  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 { }


.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;}
}


/* 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 */


body.fixed{ position: fixed; width: 100%; }

#display_scene1, #display_scene2,
#ind_animContainer{ position: fixed; z-index: 9995; width: 100%; height: 100vh; height: 100dvh;left: 0; top: 0; }
.ind_animwrap{ padding: 8%; box-sizing: border-box; }
#ind_animContainer .flex{ height: 100%;} 
#display_scene1{ z-index: 9996; }
#display_scene2{ z-index: 9997; }

@supports (-webkit-touch-callout: none) {
  #ind_animContainer {
    /* Safari HACK */
    height: -webkit-fill-available;
  }
}

@media screen and (max-width: 600px) {
    .ind_animwrap{ padding: 20%; box-sizing: border-box; }
}



/* #ind_mv
-------------------*/
.Wrap { padding: 40px 0;}
#ind_mv { width: 100%; }
.fp-section { position: relative; -webkit-box-sizing: border-box; box-sizing: border-box;}
.section { box-sizing: border-box;}
#ind_mv .inner { height: 100%; overflow: hidden;} 

.index_mainslide { width: 100%;}
.index_mainslide li { height: 100vh;height: 100dvh; }
.index_mainslide p { display: flex; flex-wrap: wrap;}
.index_mainslide p span { width: 50%; height: 100vh;height: 100dvh; display: block; overflow: hidden; position: relative;}

.index_mainslide span::before { position: absolute; content: ""; width: 100%; height: 100%; left: 0; top: 0; transform: scale(1.05);}
.index_mainslide .slide01 span:nth-child(1)::before { background: url(../images/pscut_img316a.jpg) center 25% no-repeat; background-size: cover;}
.index_mainslide .slide01 span:nth-child(2)::before { background: url(../images/pscut_4B3DFEF8-7FDC-4406-AE33-6A1350CEDCFB_1_201_aa_1.jpg) 60% 25% no-repeat; background-size: cover;}
.index_mainslide .slide03 span:nth-child(1)::before { background: url(../images/pscut_IMG_1471-2-268.jpg) center 35% no-repeat; background-size: cover;}
.index_mainslide .slide03 span:nth-child(2)::before { background: url(../images/pscut_img_0460-5.jpg) 50% 30% no-repeat; background-size: cover;}
.index_mainslide .slide02 span:nth-child(1)::before { background: url(../images/mv06.jpg) center 20% no-repeat; background-size: cover;}
.index_mainslide .slide02 span:nth-child(2)::before { background: url(../images/mv05.jpg) center center no-repeat; background-size: cover;}

.index_mainslide .slick-slide{ /* slickによってelement.styleで付けられるopacityを無効化 */ opacity: 1 !important; }
.index_mainslide .slick-slide p{ /* フェード要素の初期設定 */ opacity: 0; transition: 0s;  }
.index_mainslide .slick-active p{ /* slick-active(効果開始)の際のフェード設定 */ /* [重要]slick側の設定と同じdurationを取る */ opacity: 1; transition: ease 4.0s; }
.index_mainslide .slick-continue p{ /* エフェクトの継続用に付与したslick-continueのフェード設定 *//* [重要]slick側の設定と同じdurationを取る */ opacity: 0; transition: ease 4.0s; }
.index_mainslide .slick-slide span:before{ transform: scale(1.0, 1.0); transition: 0s; }
.index_mainslide .slick-active span:before{  transform: scale(1.1, 1.1); transition: ease 12.0s; }
.index_mainslide .slick-continue span:before{transform: scale(1.2, 1.2); transition: ease 12.0s; }

/* .#fp-nav ul li a span, .fp-slidesNav ul li a span { background: #fff;} */

a.ind_mv_scrollBtn{bottom: 65px; right: 18px; margin:auto;;z-index:2;display:inline-block;text-decoration:none}
a.ind_mv_scrollBtn p{transform:rotate(90deg)}
@media screen and (max-width:750px) {
a.ind_mv_scrollBtn{right: 10px;}
}
a.ind_mv_scrollBtn span{position:absolute;top:40px;left:0;right:0;margin:auto;width:1px;height:60px;border-left:1px solid #fff;-webkit-animation:sdb 2s infinite;animation:sdb 2s infinite;box-sizing:border-box}
@-webkit-keyframes sdb {
0%{-webkit-transform:rotate(0) translate(0,0);opacity:0}
50%{opacity:1}
100%{-webkit-transform:rotate(0) translate(0,20px);opacity:0}
}
@keyframes sdb {
0%{transform:rotate(0) translate(0,0);opacity:0}
50%{opacity:1}
100%{transform:rotate(0) translate(0,20px);opacity:0}
}



.maincopy { width: 100%; font-size: 40px; text-align: center; line-height: 1; z-index: 1;}
.maincopy span { font-size: 18px;}
.centerposi { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}

@media screen and (max-width: 750px) {
    .maincopy { font-size: 30px; text-align: center; line-height: 1.4; z-index: 1;}
    .maincopy span { display: block; font-size: 16px;}

    .index_mainslide p span { width: 120%; height: 50vh; display: block; overflow: hidden; position: relative;}


}

/* #ind_location
-------------------*/
#ind_location { width: 100%; overflow: hidden;}
.ind_Wrap { height: 100%;}
.flex-box { height: 100%;}
.text_side {  margin: 0 auto; box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: center; align-content:space-between; height: 78vh; max-height: 600px; }
.btn_box{ width: 100%;}
.img_side { width: calc(100% - 34%); padding: 40px 0; height: 100%; box-sizing: border-box; object-fit: cover;}
.img_side p { height: 100%; width: 100%;}
#ind_location .img_side p { 
    /*background: url(../images/ps_IMG_7397-2-1a.jpg) center bottom no-repeat; */
    background: url(../../location/assets/images/2024/TOP_img098-10.jpg) center 40% no-repeat; 
    background-size: cover;}

.tategaki {writing-mode: vertical-rl;  margin: 0 auto; /*margin: 5vw auto 15vw;*/}

.logo { width: 160px; margin: 20px auto 0;}
.arrow { width: 50px; margin: 0 auto;}

#fp-nav ul li a span, .fp-slidesNav ul li a span { background: #fff; width: 6px; height: 6px; border: 1px solid #fff; margin: 0 0 0 -15px;  transition: all .3s;}
#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span { height: 6px; width: 6px; margin: 0 0 0 -15px; background-color: rgba(0, 0, 0, 0);}
#fp-nav ul li:hover a span, .fp-slidesNav ul li:hover a span { width: 6px; height: 6px; margin: 0 0 0 -15px;}


#fp-nav.invert3 ul li a span {  background: #000; border: 1px solid #000;}
#fp-nav.invert3 ul li a.active span, #fp-nav.invert3 ul li:hover a.active span {  background-color: rgba(0, 0, 0, 0);}




@media screen and (max-width: 750px) {
    .Wrap { padding: 20px 0;}
    .flex-box { display: block;}
    .text_side { height: 380px; height: 480px; padding: 60px 0 40px; }
    .tategaki {writing-mode: vertical-rl; }
    .img_side { width: 100%; height: calc(100vh - 480px); height: calc(100dvh - 480px);padding: 0;}
    .arrow { margin: -5px auto 20px;}

    .logo { width: 80px; margin: 10px auto 0;}

    #fp-nav ul li a span, .fp-slidesNav ul li a span { margin: 0 0 0 -5px;}
    #fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span { margin: 0 0 0 -5px;}


#fp-nav.invert2 ul li a span {  background: #000; border: 1px solid #000;}
#fp-nav.invert2 ul li a.active span, #fp-nav.invert2 ul li:hover a.active span {  background-color: rgba(0, 0, 0, 0);}



    @media screen and (max-height: 700px) {
        .text_side { height: 430px; padding: 50px 0 40px; }
        .img_side { height: calc(100vh - 430px); height: calc(100dvh - 430px);}
        .text_side{ font-size: 0.82em;}
    }
}

.section .section-fadeIn { opacity: 0; -webkit-transition: all .8s; transition: all .8s; -webkit-transition-delay: .6s; transition-delay: .6s; }
.section.active .section-fadeIn { opacity: 1;}
.section .section-fadeIn-up { opacity: 0; -webkit-transition: all 1s; transition: all 1s; -webkit-transition-delay: .6s; transition-delay: .6s; transform: translate(0,10px);}
.section.active .section-fadeIn-up { opacity: 1; transform: translate(0,0);}
/* #ind_studio
==========================================================*/
#ind_studio .logo { width: 200px;}

#ind_studio .img_side p { background: url(../images/studio.jpg) center 40% no-repeat; background-size: cover;}

@media screen and (max-width: 750px) {
    #ind_studio .logo { width: 120px;}

}
/* form */
input, button, textarea, select { margin: 0; padding: 0; background: none; border: none; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; }







/* 
----------------------------------------------------------------------------------------------*/


