@charset "UTF-8";

@import url("inc_format.css");


@font-face {
	font-family: 'Gotham-Bold';
	src: url(./font/Gotham-Bold.woff) format("woff"),
       url(./font/Gotham-Bold.otf) format("opentype");
}


@font-face {
	font-family: 'Gotham-Book';
	src: url(./font/Gotham-Book.woff) format("woff"),
       url(./font/Gotham-Book.otf) format("opentype");
}



.bold{font-family: 'Gotham-Bold';}


.lang_noto{ 
    font-family: "Noto Sans", sans-serif;
 font-optical-sizing: auto;
 font-weight: 400;
 font-style: normal;
}

.lang_jp{ 
font-family:  "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
 font-weight: 400;
}




/*/////////////////////////
base layout　
//////////////////////////*/
html,body {
	width: 100%;
	font-size: 14px;
}
body {
	font-family:  'Gotham-Book',"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
    font-style: normal;
    font-weight: 500;
	line-height: 2.0;
    -webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: none;
	color:#fff;
	width: 100%;
	background: #000;
	text-align: left;
    overflow-y: scroll;
    letter-spacing: -0.05em;
}



body.fixed{ overflow-x:hidden; overflow-y: scroll;}


body.fixed #container{ position: fixed; top: 0; left: 0; width: 100%; height: 100vh; overflow: hidden; z-index: 1;}

html.touchDevice,
.touchDevice body{ font-size: 26px;}


#container{ position:relative; opacity: 0;}


a, a:link {
	color: #fff;
	text-decoration: none;
	outline: 0;
}
a:hover, a:active {
	color: #fff;
	text-decoration: none;
}
a:visited {
	color: #fff;
	text-decoration: none;
}

a.noline, a.noline:link {
	text-decoration: none !important;
}




/* content tags
----------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
	padding: 0;
	margin: 0 auto 20px auto;
	font-weight: 800;
	display: block;
	line-height: 1;
}

h1{	font-size: 2.5rem;font-weight: 900; line-height: 1.3;}
h2{	font-size: 2rem;font-weight: 800;line-height: 1.3;}
h3{	font-size: 1.75rem;font-weight: 800;line-height: 1.3;}
h4{	font-size: 1.5rem;}
h5{	font-size: 1.25rem;}
h6{	font-size: 1.1rem;}

section{ position: relative;width: 100%; padding:0; margin:0 auto 0px auto;z-index: 5; }


p {
	margin-bottom: 2em;
}



p:last-child{}
p:nth-of-type(1){}


ul{ margin-bottom: 2em;}
ul li{}

li:first-child 		{/* 親の最初にあったら*/}
li:last-child 		{/* 親の最後にあったら*/}
li:nth-of-type(1) 	{/* n番目*/}
li:nth-child(odd) 	{/* 奇数*/}
li:nth-child(even) 	{/* 偶数*/}




/* class
----------------------------------------------- */
.tLeft{ text-align:left;}
.grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-auto-rows: auto;
	grid-gap: 50px;
	padding: 0;
	margin: 0;
}
.grid.col_3{grid-template-columns: 1fr 1fr 1fr;}
.grid.col_2{grid-template-columns: 1fr 1fr;}
.grid.col_1{grid-template-columns: 1fr;}
.grid.sp_col_2{	grid-template-columns: 1fr 1fr;}

.grid .center {	display: grid;	align-items: center;}
.gridItem {}

img.full{width:100%; height: auto;}


.innerWrap{ width:90%; margin: auto; max-width: 1000px;}

.bgBtn{}

.bgBtn_w{ display: inline-block; height: 3em; line-height: 3em; text-align: center; padding: 0 2em; background: #fff; color: #000 !important; text-decoration: none; border-radius: 5px;transition: all 250ms cubic-bezier(.50, .0, .50, 1);}
.bgBtn_w:hover{ background: #d91226; color: #fff !important;}





/* header
----------------------------------------------- */

#globalHeader{ position: fixed; top: 0; left: ; width: 100%; height: 60px; background: #000; z-index: 100; color: #fff;}

#globalHeader .logo{display: block;width: 120px; height: 32px; background: url(./img/logo_mini.svg) left center no-repeat; background-size:contain; position: absolute; left: 30px; top: 50%; transform: translate(0,-50%);}

#globalHeader .menu{ position: absolute; right: 0; top: 50%; transform: translate(0,-50%);}
#globalHeader .menu li{ display: inline-block; margin-right: 30px;}



#globalHeader #menuBtn{ width: 40px; height: 58px; position: absolute; top: 0px; right: 20px;z-index: 10;cursor: pointer; display: none; }
#globalHeader #menuBtn hr{ transition: all 250ms cubic-bezier(.50, .0, .50, 1);transform: translate(-50%,0); left: 50%;}

#globalHeader #menuBtn hr:nth-of-type(1),
#globalHeader #menuBtn hr:nth-of-type(2),
#globalHeader #menuBtn hr:nth-of-type(3){ width: 40px; height: 8px; background: #fff; position: absolute;}

#globalHeader #menuBtn hr:nth-of-type(1){ top: 10px;}
#globalHeader #menuBtn hr:nth-of-type(2){ top: 25px;}
#globalHeader #menuBtn hr:nth-of-type(3){ top: 40px;}


#globalHeader.menuOpen #menuBtn hr:nth-of-type(1){ transform: translate(-50%,-50%) rotate(-45deg); top: 50%; left: 50%; }
#globalHeader.menuOpen #menuBtn hr:nth-of-type(2){ opacity: 0;}
#globalHeader.menuOpen #menuBtn hr:nth-of-type(3){ transform: translate(-50%,-50%) rotate(45deg); top: 50%; left: 50%; }



#globalFooter{ text-align: center; padding: 100px 0 400px 0;color: #fff;position: relative; z-index: 5;}
#globalFooter a{ color: #fff; text-decoration: underline}

#globalFooter .logo{display: block;width: 150px; height: 150px; background: url(./img/logo.svg) center center no-repeat; background-size:contain; margin:0px auto 50px auto;}

#globalFooter p{ margin-bottom: 1em;}

#globalFooter .address{margin-bottom: 40px;}


#globalFooter .tel{margin-bottom: 40px;}
#globalFooter .copyright{margin-bottom: 80px;}

#globalFooter ul.share{ width:300px; margin: auto;}


/* contents
----------------------------------------------- */
.contentsWrap{background: #fff;}

section#topContents{ background:transparent;  width:100%; height: 100vh;}
h1.logo{ width: 500px; height: 200px; position: absolute; top: 50%; left: 50%; z-index: 3;transform: translate(-50%,-50%); margin-top: 60px;}




section#bgImage{ background:#fff; background-size:cover;  width:100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 1;}
section#bgImage:after{ content:''; display: block;width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; background: #000; opacity: .3;transition: all 500ms cubic-bezier(.50, .0, .50, 1);}

section#bgImage.darkMode:after{ opacity: .8;}

section#bgImage .slick-slide{width: 100%; height: 100%;}
section#bgImage .draggable,
section#bgImage .draggable div,
section#bgImage .slick-slide div{width: 100%; height: 100%;}
section#bgImage .slick-dots{ display:none;}
section#bgImage .slick{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1;}
section#bgImage .slick .single-item{width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
section#bgImage .slick .single-item li{width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
section#bgImage .slick .single-item li:nth-of-type(1){ background: url(./img/slide/1.jpg) center center no-repeat #369; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(2){ background: url(./img/slide/2.jpg) center center no-repeat #f00; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(3){ background: url(./img/slide/3.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(4){ background: url(./img/slide/4.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(5){ background: url(./img/slide/5.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(6){ background: url(./img/slide/6.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(7){ background: url(./img/slide/7.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(8){ background: url(./img/slide/8.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(9){ background: url(./img/slide/9.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(10){ background: url(./img/slide/10.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(11){ background: url(./img/slide/11.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(12){ background: url(./img/slide/12.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(13){ background: url(./img/slide/13.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .single-item li:nth-of-type(14){ background: url(./img/slide/14.jpg) center center no-repeat #ccc; background-size: cover;}
section#bgImage .slick .slick-arrow{display:none !important; opacity: 0; pointer-events: none; visibility: hidden;}



#scrollDown{ width:auto; height: 50px; position: absolute; bottom:20px; left: 50%; transform: translate(-50%,0); z-index: 5; color: #fff; text-align: center; white-space: nowrap; cursor: pointer;}


#scrollDown:after {
    content: '';
    display: block;
    width: 12px;
    height: 12px;
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translate(-50%,0) rotate(45deg);
    border-bottom: solid 3px #fff;
    border-right: solid 3px #fff;
    
    animation: arrowdown 2500ms infinite ;
    
}



/* instagram feed
----------------------------------------------- */
#sb_instagram{ padding-top:0px !important; margin-bottom: 40px !important; }
.sb_instagram_header{ display: none !important;}

#sb_instagram #sbi_load{ padding-top:30px;}

section#instaArea{ padding:100px 0; }

section#instaArea h2.title{ height:0; padding-top: 50px; margin-bottom: 0px; overflow:hidden;  background: url(./img/Instagram_logo_typo.svg) center top no-repeat; background-size: contain; display: none;}

.sbi_type_image,
.sbi_type_carousel,
.sbi_type_video{ pointer-events: none !important; cursor: default !important;}

.sbi_lightbox_carousel_icon,
.sbi_playbtn{ display: none !important;}

#sb_instagram .sbi_type_carousel .sbi_playbtn, 
#sb_instagram .sbi_type_carousel .svg-inline--fa.fa-play, 
#sb_instagram .sbi_type_video .sbi_playbtn, 
#sb_instagram .sbi_type_video .svg-inline--fa.fa-play, 
.sbi_type_carousel .fa-clone{display: none !important; opacity: 0 !important;}

#sb_instagram #sbi_images a{pointer-events: none !important; cursor: default !important;}





/* about
----------------------------------------------- */

section#about{ text-align: center;}
section#about .innerWrap{ max-width: 700px;}
section#about .innerWrap p{ text-align: left !important;
    
        
   
    
}


section#about h2{ margin-bottom:80px;}
section#about h3{ margin-bottom:40px;}



@media screen and (max-width:750px) {
    .touchDevice #globalHeader{ height: 120px;}	
    .touchDevice #globalHeader .logo{ height: 64px; width: 300px;}
    .touchDevice #globalHeader #menuBtn{ display: block;right:0; width: 120px; height: 120px;}
.touchDevice #globalHeader #menuBtn hr:nth-of-type(1),
.touchDevice #globalHeader #menuBtn hr:nth-of-type(2),
.touchDevice #globalHeader #menuBtn hr:nth-of-type(3){ width: 60px; height: 8px; background: #fff; position: absolute;}

.touchDevice #globalHeader #menuBtn hr:nth-of-type(1){ top: 35px;}
.touchDevice #globalHeader #menuBtn hr:nth-of-type(2){ top: 56px;}
.touchDevice #globalHeader #menuBtn hr:nth-of-type(3){ top: 76px;}


#globalHeader.menuOpen #menuBtn hr:nth-of-type(1){ transform: translate(-50%,-50%) rotate(-45deg); top: 50%; left: 50%; }
#globalHeader.menuOpen #menuBtn hr:nth-of-type(2){ opacity: 0;}
#globalHeader.menuOpen #menuBtn hr:nth-of-type(3){ transform: translate(-50%,-50%) rotate(45deg); top: 50%; left: 50%; }

    
    
    .touchDevice #globalHeader .menu{ position: absolute; top: 120px; right: 0; background: #000; width: auto; transform: translate(100%,0);transition: all 500ms cubic-bezier(.50, .0, .50, 1); padding-top: 20px;}
    .touchDevice #globalHeader.menuOpen .menu{ transform: translate(0,0);}
    
    .touchDevice #globalHeader .menu li{ display: block; margin: 0; font-size: 1.2em; white-space: nowrap; margin-bottom: 20px;}
    .touchDevice #globalHeader .menu li a{ display: block; line-height:1; padding: 40px 80px; border: solid 0px #666;}
    
    .touchDevice h1.logo{ margin-top:-5%;}
    .touchDevice #scrollDown{height: 70px; bottom:140px;}
    
    
    .touchDevice section#bgImage .slick .single-item li:nth-of-type(1){ background: url(./img/slide/1.jpg) center center no-repeat #369; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(2){ background: url(./img/slide/2.jpg) center bottom no-repeat #f00; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(3){ background: url(./img/slide/3.jpg) center bottom no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(4){ background: url(./img/slide/4.jpg) center bottom no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(5){ background: url(./img/slide/5.jpg) center bottom no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(6){ background: url(./img/slide/6.jpg) right bottom no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(7){ background: url(./img/slide/7.jpg) center bottom no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(8){ background: url(./img/slide/8.jpg) left bottom no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(9){ background: url(./img/slide/9.jpg) center bottom no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(10){ background: url(./img/slide/10.jpg) center center no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(11){ background: url(./img/slide/11.jpg) center center no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(12){ background: url(./img/slide/12.jpg) center center no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(13){ background: url(./img/slide/13.jpg) center center no-repeat #ccc; background-size: cover;}
.touchDevice section#bgImage .slick .single-item li:nth-of-type(14){ background: url(./img/slide/14.jpg) center center no-repeat #ccc; background-size: cover;}
    
    
    .touchDevice #globalFooter ul.share{ width: 600px;}
    
    .touchDevice #sb_instagram #sbi_load .sbi_load_btn, 
    .touchDevice #sb_instagram .sbi_follow_btn a,
    .touchDevice #sb_instagram .sbi_follow_btn .fa, 
    .touchDevice #sb_instagram .sbi_follow_btn svg{ font-size:26px;}
    
    
    
#sbi_images{
    display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-auto-rows: auto;
	grid-gap: 10px;
	padding: 0;
	margin: 0;
    
}
#sbi_images .sbi_item{ width: 100% !important;}
    
    
    
    
}

/* ▲ max-width:750px  */



/* media
----------------------------------------------- */
.onlyPC{ display:inline-block !important;}
.onlySP{ display:none !important;}
		
@media screen and (max-width: 1000px) {	

}


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

	
	.onlyPC{ display:none !important;}
	.onlySP{ display:inline-block !important;}
	
	
	
	
}



@keyframes arrowdown {
    0% {  bottom: 10px;}
	10% { bottom: 0px;}
	30% {  bottom: 10px;}
	40% {  bottom: 0px;}
	50% {  bottom: 10px;}
	90% {  bottom: 10px;}
	100% {  bottom: 10px;}
}