@charset "utf-8";
/*@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');*/

/*loading*/
#loading{ width: 100%; height: 100vh; position: fixed; background:#fff; top: 0; left: 0; z-index: 10010; display: none; }

/*common*/
.pc-only { display: block!important; }
.sp-only { display: none!important; }

@media screen and (max-width: 900px) {
	.pc-only { display: none!important; }
	.sp-only { display: block!important; }
}

section, main {position: relative; display: block;}
body, html { width: 100%; overflow-x: hidden; }

.allwrap{
	width: calc(100% - 3vw);
	padding: 1.5vw 0;
	display: block;
	margin: 0 auto;
}

.allwrap::after{content: "";width: 2px;height: calc(100vh - 3vw);position: absolute;position: fixed;left: 50%;top: 1.5vw;background: #FF0044;}

.mainImgwrap{
	    width: calc(50% - 1.5vw);
	height: calc(100vh - 3vw);
	display: block;
	position: fixed;
	left: 1.5vw;
	top: 1.5vw;
	overflow: hidden;
	padding-bottom: 0;
}

.half-wrap{
	width: 50%;
	
}
.half-wrap.-right{margin-left: 50%; display:block; width: 50%;} 
.half-wrap.-right .half-wrap__contents{margin-left: 1.5vw;}

.section{ max-width: calc(100% - 9vw); width: 45em; margin:0 auto; padding-top: 10vw; text-align: center;} 
.contents{padding-top: 3em;}
.column{padding-top: 3em;}
.column.-s{padding-top: 1.5em;}
.contents .column:first-child{padding-top: 0;}

.section .contents:first-child{padding-top: 0;}

.h_2 img{height: 3em;width: auto;}
.lead img{ height:1.2em; width: auto; padding-top: 2em;}

@media screen and (max-width: 900px) {
	.section{padding-top: 30vw;}
	.contents{padding-top: 2.5em;}
	.column{padding-top: 2em;}
	.h_2 img{height: 2em;}
	.mainImgwrap{padding-bottom: 3rem;}
}

.half-wrap__contents{	width: calc(100% - 3vw);}

.logo.half-wrap.-right {height:calc(100vh - 4.5vh); display: flex; position: relative;}
.logo.half-wrap.-right::after{
	content: "";
    width: 2px;
    height: 5vw;
    max-height: 100px;
    background: #FF0044;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateY(50%);
	animation: sdl 2s infinite;
}

@media screen and (max-width: 900px) {
	.logo.half-wrap.-right::after{height: 40vw; width: 1px; max-height: 250px;}
}

@keyframes sdl {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  60% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  60.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  90% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
	100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}


.logo h1{
	margin: auto;
	max-width: 300px;
	width: 40%; height: auto;
	/*aspect-ratio: 1 / 1.5;*/
    padding-top: 60%;
	overflow: hidden;
	position: relative;
}

.logo h1 img{width: 200%; height: auto; position: absolute; right: 0; top: 0;}


/*main*/
.mainImgwrap.half-wrap{	width: calc(50% - 1.5vw);}
.mainImgwrap .mainimg{  height: calc(50vh - 1.5vw - 1.5vw - 0.75vw); display:block; overflow: hidden; margin-top: 1.5vw; margin-left: 1.5vw;}
.mainImgwrap .subimg{  height: calc(50vh - 1.5vw - 1.5vw - 0.75vw); display:block;  margin-top:1.5vw; margin-left: 1.5vw;}
.mainImgwrap  img{max-width: 100%; height: auto; width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;}

.swiper-slide{
	 -o-object-fit: cover;
    object-fit: cover;
idth: 100%;
    height: 100%;
}

.mainImgwrap .mainimg .swiper{ width: 100%; height: 100%;}
.mainImgwrap .subimg .swiper{ width: 100%; height: 100%;}

.instaNav{width: 8%;position: fixed;display: block; position:fixed; background: #fff; min-width: 120px;right: 1.5vw;top: 1.5vw;border-left: 2px solid #6BCFFF;border-bottom: 2px solid #6BCFFF;border-radius: 0 0 0 1em; z-index: 2;}
.instaNav img{width: 100%; height: auto;}

@media screen and (max-width: 900px) {
	.mainImgwrap.half-wrap{	width: 100%; position: relative; left:inherit; top:inherit;}
	.instaNav{right: 0; position: absolute;top: calc(100% - 2rem); transform: translateY(-100%); border-left: none;border-bottom:none;border-radius: 1em 0 0 1em; width: 5%; min-width: 80px;}
	.half-wrap__contents{width: 100%;}
	.mainImgwrap{height: auto;}
	.mainImgwrap .mainimg{margin-top: 0; margin-left: 0; height: 100vh;}
	.mainImgwrap .subimg{width: 90%; height: auto; margin: 5% auto 0;}
	.logo.half-wrap.-right{width: 100%; margin-left:0; height: 100vh; position: absolute; left: 0; top: 0; z-index: 10;}
	.logo h1 img{right: inherit; left: 0;}
	.half-wrap.-right{width: 100%; margin-left:0;}
}

.contents .column.-map{/*aspect-ratio: 1 / 0.66;*/ width: 100%; padding-top: 66%; display: block; position: relative;}
.column.-map iframe{ width: 100%; height: 100%; display: block;filter: grayscale(1); position: absolute; left: 0; top: 0;}

.swiper{overflow: initial;}

.swiper-pagination-bullet{background: #6BCFFF;     opacity: 1;}
.swiper-pagination-bullet-active{background: #FF0044;}

/*snsiconLink*/
.snsiconLink .-icon{
	width: 15%; height: auto; margin:0 auto 2rem; display: block;
}

.mainImgwrap .swiper-pagination{display: none;}

@media screen and (max-width: 900px) {
	.snsiconLink .-icon{margin-bottom: 1rem;}
	.mainImgwrap .swiper-pagination{bottom: -3em; display: block;}
}

/*parts*/
.link{
	position: relative;
	color: #6BCFFF;
	letter-spacing: 0.15em;
	padding: 1em 0;
}

.link::after{
	content: "";
	width: 100%; height: 2px; display: block; background: #FF0044; position: absolute; left: 0; bottom: 0;
}
.link:hover{
	color: #FF0044;
}
@media screen and (min-width: 900px) {
.link:hover{
	color: #FF0044;
}
}

/*modal*/
.contents_wrap.-modal{ display: none; opacity: 0; z-index: 100000;
	background: #fff;  position: relative;position: fixed; height: calc(100vh - 3vw); overflow: auto;
    left: 0;    top: 1.5vw;	width: calc(50% - 1.45vw);    margin-left: 1.5vw;
}
.closebtn{ width:5%;min-width: 70px; display: block;background: #fff;border-left: 2px solid #FF0044;border-bottom: 2px solid #FF0044;position: fixed;right: 50%;top: 1.5vw;display: flex;z-index: 10000;    cursor: pointer;}
.closebtn .-inner{width: 80%; padding-top: 100%; display: block; position: relative; margin:auto;}
.closebtn .-inner::before{content: ""; width: 100%; height: 2px; background: #FF0044; transform:rotate(45deg) ; position: absolute; top: 50%;}
.closebtn .-inner::after{content: ""; width: 100%; height: 2px; background: #FF0044; transform:rotate(-45deg) ; position: absolute; top: 50%;}
@media screen and (min-width: 899px) {
.closebtn:hover{ background:#FF0044; }
.closebtn:hover .-inner::before{content: ""; width: 100%; height: 2px; background: #fff; transform:rotate(45deg) ; position: absolute; top: 50%;}
.closebtn:hover .-inner::after{content: ""; width: 100%; height: 2px; background: #fff; transform:rotate(-45deg) ; position: absolute; top: 50%;}
}

@media screen and (max-width: 900px) {
	.contents_wrap.-modal{width: 100%; margin-left: 0vw; direction: inherit; top: 0;	}
	.closebtn{width: 13%;min-width: 50px;right: 2px;top: 2px;display: flex;}
	
}

/*
.contents_wrap.-modal{
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.contents_wrap.-modal::-webkit-scrollbar {  
  display: none;
}*/

#madori .madorizu{ margin-bottom: 1em;}

.contents_wrap.-modal .scrollwrap{padding:10vw 0; opacity: 0; }
.contents_wrap.-modal .scrollwrap .section{transform: translateY(20px);}
.contents_wrap.-modal .scrollwrap .section:first-child{padding-top: 0;}
.contents_wrap.-modal .modalclose{opacity: 0;}

.open .contents_wrap.-modal .scrollwrap{opacity: 1; transition:opacity 1s ease;}
.open .contents_wrap.-modal .modalclose{opacity: 1; transition:opacity 1s ease;}

.open .contents_wrap.-modal .scrollwrap .section{transform: translateY(0); transition:transform 1s ease;}

#foot{width: 100%; height: calc(100vh - 3vw); display: flex;}
#foot .section{margin: auto; padding-top: 0;}

.foot_logo{
	width: 25%; height: auto; display: block; margin: 0 auto;
}

@media screen and (max-width: 900px) {
	.contents_wrap.-modal .scrollwrap::before{content: ""; width: 100%; height: 100vh; position: fixed; border: 2px solid #FF0044; box-sizing: border-box; pointer-events: none; top: 0;    left: 0;}
	.contents_wrap.-modal{height: calc(100vh);}
	.contents_wrap.-modal .scrollwrap{
		padding:30vw 0;
	}
#foot{
height: auto;
    padding: 30vw 0;
}
}

/**/

.over_border {
	z-index: 99999999;
}
.over_border div{
height: 1.5vw;
position: fixed;
background: white;
	z-index: 99999999;
}

.over_border div:nth-child(1){
top: 0;
width: 100%;
left: 0vw;
}
.over_border div:nth-child(2){
top: 0vw;
width: 1.5vw;
height: 100vh;
right: 0;

}
.over_border div:nth-child(3){
bottom: 0;
width: 100%;
left:0vw;
	    z-index: 99999998;
}
.over_border div:nth-child(4) {
top: 0vw;
width: 1.5vw;
height: 100vh;
left: 0;
}

.over_border div:nth-child(1)::before{
	content: "";
	width: 100%;
	height: 2px;
	display:
	block;
	position: absolute;
	background: #FF0044;
	position: absolute;
	left: 0;
	bottom: 0;
}

.over_border div:nth-child(2)::before{
	content: "";
	width: 2px;
	height: calc(100% - 3vw + 4px);
	display:
	block;
	position: absolute;
	background: #FF0044;
	position: absolute;
	left: 0;
	top: calc(1.5vw - 2px);
}

.over_border div:nth-child(3)::before{
	content: "";
	width: 100%;
	height: 2px;
	display:
	block;
	position: absolute;
	background: #FF0044;
	position: absolute;
	left: 0;
	top: 0;
}

.over_border div:nth-child(4)::before{
	content: "";
	width: 2px;
	height: calc(100% - 3vw + 4px);
	display:
	block;
	position: absolute;
	background: #FF0044;
	position: absolute;
	right: 0;
	top: calc(1.5vw - 2px);
}


@media screen and (max-width: 900px) {
	.over_border {display: none;}
	.allwrap{padding: 0; width: 100%;}
	.allwrap::after{display: none;}
}