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

/* ----------------------------
	Reset
---------------------------- */
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,main,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{
	margin:0;padding:0;border:0;font:inherit;vertical-align:baseline
}

article,main,aside,details,figcaption,figure,footer,header,hgroup,picture,menu,nav,section{display:block}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}
table{border-collapse:collapse;border-spacing:0}

html { /***スクロールバーの表示／非表示によるコンテンツの横ずれ***/
  scrollbar-gutter: stable;
}

/* ----------------------------
	Base
---------------------------- */
body {
	line-height: 1.692307692;
	font-size: 14px;
	font-size: 1.0833333vw;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-feature-settings: "palt";
	font-family: "fot-tsukuaoldmin-pr6n", sans-serif;
    font-weight: 300;
    font-style: normal;
   color:#fff;
	position: relative;
	letter-spacing:0.05em;
   background: #000;
	text-align: center;
	overflow-x: hidden;
	/*overflow-y: scroll;*/
}


@media screen and (max-width: 767px) {
	body {
		line-height: 1.615384615;
		font-size: 3.4666667vw;
	}
}


/*************ヘッダー******************/

#logo_btn{
	display: flex;
	position: fixed;
	align-items: center;
	top:10px;
	right: 10px;
   	z-index: 1
}


a#header_btn {
	font-size: 16px;
	width: auto;
	padding: 0 20px;
	margin-right: 10px;
	border: 1px #89939b solid;
	border-radius: 20px;
	background-color: rgba(255, 255, 255, .7);
	color:#586168;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	transition: ease-in-out .3s;
	
}
a#header_btn:hover{
		background-color: #000;
		color: #fff;
		border: 1px #fff solid;
}
@media screen and (max-width: 767px) {
a#header_btn {
	font-size: 11px;
	margin-right: 6px;
	padding: 0 10px;
}
}


#logo2026{
   width: 80px;
   position: fixed;
   left: 10px;
   top: 10px;
   z-index: 1
}

@media screen and (max-width: 1024px) {
#logo2026{
	width: 10vw;
	max-width: 130px;
}
}

@media screen and (max-width: 767px) {
#logo2026{
	width: 14vw;
	max-width: 130px;
}
}


#logo{
	width: 85px;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#logo{
	width: 9vw;
    max-width: 100px;
}
}

@media screen and (max-width: 767px) {
#logo{
	width: 57px;
}
}


/*************ファーストビュー******************/
#fv{
   background-color: #fff;
   position: relative;

}


@media screen and (max-width: 767px) {
#fv{
	padding-bottom: 13%;
}
}

#fv_img{
	width: 33%;
	position: relative;
   animation: toColor 7s ease forwards;
}
@media screen and (max-width: 1920px) {
#fv_img{
	width: 29%;
}
}
@keyframes toColor{
  from{ filter: grayscale(100%)  ; opacity: 0; }
  30%{ filter: grayscale(100%)  ; opacity: 1; }
  50%  { filter: grayscale(0) ;  }
  to  { filter: grayscale(0%); }
}


/***macbook***/
@media (min-width: 1025px) and (max-width: 1512px) {
#fv_img{
	width: 34%;
	margin: 0px 0 0 0;
}
}


@media (min-width: 768px) and (max-width: 1024px) {
#fv_img{
	width: 80%;
	margin: 60px 0 0 0;
}
}

@media screen and (max-width: 767px) {
#fv_img{
	width: 100%;
	margin: 55px 0 0 0;
}
}

#mada{
	font-size: 1.8rem;
    writing-mode: vertical-rl;
    text-orientation: upright;
    font-feature-settings: initial;
	z-index: 1;
	position: absolute;
	right: 20%;
	top: 5%;
	color: #4c5257;
}
/***macbook***/
@media (min-width: 1025px) and (max-width: 1512px) {
#mada{
	right: 15%;
	top: 8%;
	font-size: 1.6rem;
}
}
@media (min-width: 768px) and (max-width: 1024px) {
#mada{
	font-size: 1.8rem;
	right: 5%;
	top: 8%;
}
}

@media screen and (max-width: 767px) {
#mada{
	font-size: 1.2em;
	right: 4%;
	top: 8%;
}
}


#main_catch{
	max-width: 600px;
   margin: 0px auto 20px auto;
}
@media (min-width: 1025px) and (max-width: 1512px) {
#main_catch{
	max-width: 600px;
   margin: 0px auto 20px auto;
}
}

@media screen and (min-width:768px) and ( max-width:1024px) {
#main_catch{
	width: 95%;
	line-height: 1.5em;
}
}
@media screen and (max-width: 767px) {
#main_catch{
	width: 95%;
	line-height: 1.5em;
}
}



#main_date{
	max-width: 900px;
	width: 45%;
	margin:0px auto 0vh auto;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: .8em;
}



@media screen and (min-width:768px) and ( max-width:1024px) {
#main_date{
	max-width: 900px;
	width: 90%;
    margin:0px auto 0vh auto;
}
}
@media screen and (max-width: 767px) {
#main_date{
	width: 95%;
	margin:0px auto 0vh auto;
}
}


#main_arrow{
	width: 10rem;
	display: flex;
   margin-top: -20px;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#main_arrow{
	width: 8rem;
	max-width: 70px;
}
}

@media screen and (max-width: 767px) {
#main_arrow{
	width: 10rem;
    max-width: 110px;
	margin-top: 0px;
}
}

#main_lead{
	letter-spacing: 0.2em;
	font-size: 2.3rem;
	font-style: italic;
	margin-bottom: 35vh;
	line-height: 1em
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#main_lead{
	font-size: 4vw;
	line-height: 1.4em;
	margin: 10vh 0 37vh 0;
}
}

@media screen and (max-width: 767px) {
#main_lead{
	font-size: 1.4rem;
	line-height: 1.4em;
	margin: 10vh 0 37vh 0;
}
}



/*************about BG******************/
#about_bg{
   background: url("../img/about_bg.png") no-repeat;
   background-size:contain;
   background-position: center top;
   width: 100%;
   padding: 500px 0 5% 0;
    justify-content: center;
    align-items: center;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#about_bg{
	background-size: 160%;
   padding: 30% 0 5% 0;
   height: 100vh;
}
}

@media screen and (max-width: 767px) {
#about_bg{
    background-size:240%;
    padding: 50% 0 5% 0;

}
}



#about_lead{
	font-size: 34px;
	letter-spacing: 0.1em;
	line-height: 1.9em;
	margin: 50px 0 90px 0
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#about_lead{
	font-size: 4vw;
	line-height: 2.3em;
	margin: 50px 0 100px 0
}
}

@media screen and (max-width: 767px) {
#about_lead{
	font-size: 1.1rem;
	line-height: 2.3em;
	margin: 40px 0 40px 0
}
}

.fs160{
	font-size: 160%
}



#about_sub_lead{
	font-size: 26px;
	font-weight: 500;
	margin: 25px auto 10px auto;
	letter-spacing: 0.1em
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#about_sub_lead{
	font-size: 3vw;
	width: 90%;
}
}

@media screen and (max-width: 767px) {
#about_sub_lead{
	font-size: 4vw;
    width: 97%;
}
}

#kaisai_box{
		display: flex;
		justify-content: center;
}
#kaisai{
	font-size: 22px;
	text-align: left;
	line-height: 2.2em;
}
#kaisai li{
	display: block;
}
#kaisai li span{
	font-size: 170%;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#kaisai{
	font-size: 3vw
}
}

@media screen and (max-width: 767px) {
#kaisai{
	font-size: 12px
}
}


#kaisai li a{
		border-bottom: .5px #fff dashed;
		padding-bottom: 2px;
		transition: ease-in-out .3s;
}
#kaisai li a:hover{
	opacity: .5;
}


#sougaku{
	max-width: 1000px;
	margin: 0 auto;
    padding: 0 40px
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#sougaku{
	width: 90%;
	margin: 0 auto
}
}

@media screen and (max-width: 767px) {
#sougaku{
	width: 92%;
	margin: 0 auto;
	padding: 0
}
}

.sp_br{
	display: none
}
@media screen and (max-width: 767px) {
.sp_br{
	display: inline
}
}


#gra_sec{
	display: flex;
	justify-content: center;
	gap:30px;
	margin: 40px auto 40px auto
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#gra_sec{
	width: 70%;
	gap:20px;
	margin: 20px auto 40px auto
}
}
@media screen and (max-width: 767px) {
#gra_sec{
	width: 75%;
	gap:20px;
	margin: 20px auto 40px auto
}
}

#gra_sec div{
	width: 250px
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#gra_sec div{
	width: 40%
}
}


#hotel{
width: 260px;
margin: 20px auto
}
@media screen and (max-width: 1024px) {
#hotel{
max-width: 190px;
width: 100%;
}
}
@media screen and (max-width: 767px) {
#hotel{
margin: 20px auto 90px auto
}
}


.fa-window-restore{
	margin-left: 7px;
	font-size: 80%;
}

/*************スケジュール BG******************/
#schedule_bg{
   background: url("../img/schedule_bg.png") no-repeat;
   background-size: contain;
   background-position: center top;
   width: 100%;
   padding: 31% 0 5% 0;
   margin: 0px 0 0 0;
    justify-content: center;
    align-items: center;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#schedule_bg{
 	padding: 31% 0 5% 0;
   	margin: 120% 0 0 0;
}
}



#schedule_bg dl {
  display: flex;
  flex-wrap: wrap;
  width: 740px;
  margin:70px auto 0 auto;
  text-align: left;
  font-size: 2rem;
  line-height: 1em;
}
#schedule_bg span{
	font-size: 70%;
}
#schedule_bg dl dt {
  width: 32%;
  margin-bottom: 40px;
}
#schedule_bg dl dd {
  width: 68%;
  margin-bottom: 40px;
}
#schedule_bg dl dd p{
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	font-size: .9rem;
}
@media screen and (max-width: 767px) {
#schedule_bg dl {
  width: 90%;
  margin:70px auto 0 auto;
  line-height: 1em;
}
#schedule_bg dl dt {
  width: 100%;
  margin-bottom: 5px;
    font-size: 1.5rem;
}
#schedule_bg dl dd {
  width: 100%;
  margin-bottom: 35px;
}
#schedule_bg dl dd p{
	font-size: .9rem;
	line-height: 1.5em;
	margin-top: 5px;
}
}



/*************MOVie BG******************/
#movie_bg{
   background: url("../img/movie_bg.png") no-repeat;
   background-size: contain;
   background-position: center bottom;
   width: 100%;
   padding: 10% 0 30% 0;
    justify-content: center;
    align-items: center;
}
@media screen and (max-width: 767px) {
#movie_bg{
	padding: 10% 0 50% 0;
}
}


.movie_button{
	position: relative;
	/*display: flex;
	align-items: center;
	justify-content: center;*/
	transition: ease-in-out .5s;
	margin:75px auto 6px auto;
   max-width: 800px;
   width: 100%
}
@media screen and (max-width: 767px) {
.movie_button{
	margin:40px auto 4px auto;
}
}


.movie_button img{
		width: 100%;
}
@media screen and (max-width: 1024px) {
.movie_button img{
		width: 90%;
}
}


.movie_button:hover{
		opacity: .7;
}

.tyu {
    font-size: clamp(10px, 2vw, 12px);
    padding-left: 1em;
    text-indent: -1em;
    color: var(--black);
    line-height: 1.6em;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}
.fa-volume-high {
    padding-left: 1em;
}



/*************メッセージ BG******************/
#message_title_bg{
background: url("../img/message_title_bg.png");
   background-repeat: no-repeat;
    background-size: cover;
	background-position: center center;
    width: 100%;
	height: 130vh;
	padding: 15% 0 0 0
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#message_title_bg{
	height: 70vh;
	padding: 20% 0 0 0;

}
}
@media screen and (max-width: 767px) {
#message_title_bg{
	height: 70vh;

}
}

/*******************メッセージコンテンツ*******************/
#message_bg{
width: 100%;
  height: auto;
  background: linear-gradient(270deg, #8e1107, #ca0202, #800303) ;
  background-size: 200% 200%;
  animation: Grad 10s ease infinite;
  overflow-x: hidden;
}

@keyframes Grad {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}





#nendai{
 font-family: "fot-tsukuaoldmin-pr6n", sans-serif;
    font-weight: 300;
    font-style: normal;
	font-size: 3.2rem;
	margin-bottom: 10px
}

.ls_{
	letter-spacing: -0.07em;
}
.ls_main{
	letter-spacing: -0.5em;
	font-size: 70%
}

#sp2024{
    display: none
}
@media screen and (min-width:768px) and ( max-width:1024px) {
 #sp2024{
     display: inline-block;
	text-align: center;
	font-family: "din-2014", sans-serif;
	font-weight: 300;
	font-style: italic;
	font-size: 2.6rem;
	line-height: 1em;
	margin:50px auto 0vh auto;
}
}
@media screen and (max-width: 767px) {
#sp2024{
	display: inline-block;
	font-family: "din-2014", sans-serif;
	font-weight: 300;
	font-style: italic;
	font-size: 1.6rem;
	line-height: 1em;
	margin:50px auto 0vh auto;
}
}


#play span{
   display: none
}
.mt0{ margin-top: 0 !important}
.mt_minas{ margin-top: -10% !important}


.title{
	text-align: center;
	font-family: "meno-banner", serif;
    font-weight: 300;
    font-style: normal;
	font-size: 6rem;
	position: relative;
	display: flex;
	justify-content: center;
	letter-spacing: 0.1em;
	margin: 190px 0 5px 0;
	line-height: 1em;
}	
@media screen and (min-width:768px) and ( max-width:1024px) {
.title{
	font-size: 4.5rem;
	letter-spacing: 0.1em;
	margin: 140px 0 0 0;
	line-height: 1em;
}
}

@media screen and (max-width: 767px) {
.title{
	font-size: 3.5rem;
	letter-spacing: 0.1em;
	margin: 140px 0 0 0;
	line-height: 1em;
}
}

.ls{
	letter-spacing: 0em
}

.title:before{
	position: absolute;
	content: '';
	background: url("../img/tiara.svg") no-repeat;
	width: 50px;
	height: 50px;
	top: -60px;
	filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, .5));
}

@media screen and (max-width: 767px) {
.title:before{
	width: 30px;
	height: 30px;
	top: -40px;
}
}


#message .title:before{
	position: absolute;
	content: '';
	background: url("../img/tiara_gray.svg") no-repeat;
	width: 50px;
	height: 50px;
	top: -60px;
	filter: drop-shadow(0px 0px 0px rgba(0, 0, 0, 0));
}


.title_ja{
	font-size: 22px;
	font-weight: 500;
    letter-spacing: 0.1em;
	display: flex;
	align-items: center;
}

@media screen and (min-width:768px) and ( max-width:1024px) {
.title_ja{
	font-size: 1.1rem;
}
}

@media screen and (max-width: 767px) {
.title_ja{
	font-size: 1rem;
}
}

.title_ja::before,
.title_ja::after {
	content: "";
	height:1px;
	width:30px;
	background-color:#fff;
	margin: 0 auto;
}
@media screen and (max-width: 767px) {
.title_ja::before,
.title_ja::after {
	width: 4vw;
}
}


#message .title_ja::before,
#message .title_ja::after {
	background-color:#6b6f6b;
}


.title_ja:before {
margin-right: 10px;
}
.title_ja:after {
margin-left: 10px;
}



/*******************CTA*******************/
.contact{
	margin: 0px 0 0 0
}
.tel_lead{
	font-size: 20px;
    font-weight: 500;
    line-height: 1.3em;
    margin: 0 0 15px 0;
	letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.tel_lead{
	font-size: .8rem;
}
}

.tel{
	width: 550px;
	margin: 0 auto 10px auto
}
@media screen and (min-width:768px) and ( max-width:1024px) {
.tel{
	width: 50%;
	}
}

@media screen and (max-width: 767px) {
.tel{
	width: 90%;
}
}


.ope{
	font-size: 14px;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}
@media screen and (max-width: 768px) {
.ope{
	font-size: 11px
}
}

.btn a {
  color: #000;
    font-size: 18px;
    font-weight: bold;
    background: #fff;
    width: 550px;
    height: 65px;
    text-align: center;
    line-height: 62px;
    border: 1px solid #000;
    position: relative;
    z-index: 1;
    display: block;
    overflow: hidden;
    transition: .3s;
    margin: 30px auto 0 auto;
	border-radius: 50px;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
.btn a{
	width: 55%;
	height: auto;
	font-size: .9rem;
	line-height: 45px;
	padding: 0 0 4px 0;
}

.btn_mb{ margin-bottom: 120px;}
}

@media screen and (max-width: 767px) {
.btn_mb{ margin-bottom: 120px;}

.btn a{
	width: 90%;
	height: auto;
	font-size: .9rem;
	line-height: 45px;
	padding: 0 0 4px 0;
}
}

.btn a::before {
  content: "";
  width: 100%;
  position: absolute;
  top: 0;
  right: -65px;
  z-index: -1;
  border-right: 65px solid transparent;
  border-bottom: 65px solid #000;
  transform: translateX(-100%);
  transition: transform ease .3s;
}
.btn a::after{
	position: absolute;
	font: var(--fa-font-solid);
  	content: "\f105";
    display: inline-block;
    top: 50%;
	color: #d8263b;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    right: 24px;
    font-size: 85%;
}
.btn a:hover {
  color: #fff;
  border: 1px solid #fff;
}
.btn a:hover::before {
  transform: translateX(0);
}


@media screen and (max-width: 767px) {
#main_sub{
	height: 460px;
	width: 100%;
}
#main_sub img{
	width: 100%;
	margin: 0 auto;
	height: 460px;
	object-fit: cover;
}
}




.message_box{
	display: flex;
	align-items: center;
	justify-content: center;
   column-gap: 50px;
	width: 100%;
	max-width: 1900px;
	position: relative;
	margin: 0 auto 400px auto
}
.mb_first{
	margin-top: 200px;
}

.right_box{
	justify-content: flex-end
}

@media screen and (min-width:768px) and ( max-width:1024px) {
.message_box{
	max-width: 1024px;
	width: 95%;
	display:block;
	/*flex-direction: column;*/
}
.message_box img{
		width: 50%;
}
.message_box .yoko img {
	width: 100%;
}
}
@media screen and (max-width: 767px){
.message_box{
	display:block;
	max-width: 90%;
	margin: 0 auto 300px auto
}
.message_box img{
		width: 75%;
}
.message_box .yoko img {
	width: 100%;
}
.mb_first{
	margin-top: 100px;
}
}

.fujimura{
	position: absolute;
	left: 25%;
	z-index: 1;
}
.saito{
	right: 260px;
    position:relative;
	z-index: 1;
}
.takahashi{
	position: absolute;
	left: 32%;
	z-index: 1;
}
@media (min-width: 1025px) and (max-width: 1512px) {
.takahashi{
	left: 25%;
}
}


@media screen and (max-width: 1024px){
.fujimura,
.saito,
.takahashi{
	position: initial;
}
}

.btn_set{
	margin: 30px 0 0 0;
	display: flex;
	gap:10px;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
.btn_set{
	width: 100%;
	margin: 30px auto 0 auto;
	justify-content: center;
}
}
@media screen and (max-width:767px){
.btn_set{
	width: 80%;
	margin: 25px auto 0 auto;
    justify-content: center;
    flex-direction: column;
    gap: 0
}
}

.btn_set li a{
	border: 1px #fff solid;
	font-size: 13px;
	border-radius: 20px;
	margin: 13px 0;
	padding: 6px 0 7px 0;
	transition: ease-in-out .3s;
	display: block;
   position: relative;
   width: 230px
}
@media screen and (min-width:768px) and ( max-width:1024px) {
.btn_set li a{
	margin: 5px 0;
	font-size: 12px;
	width: 230px
}
}

@media screen and (max-width:767px){
.btn_set li a{
	margin: 7px 0;
	width: 100%;
	border: 1px #fff solid;
}
}


.btn_set li a:hover{
	background:#fff;
	color: #000
}

.btn_set li a:before{
   position: absolute;
    font: var(--fa-font-regular); /*テキスト*/
    content: "\f46d";
    display: inline-block;
    top: 50%;
    color: #fff;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    right: 34px;
    font-size: 100%;
}
.btn_set li a:hover:before{
   color: #000
}

.btn_set li a.comment:before{
   font: var(--fa-font-light);
   content: "\f4a6";
   right: 30px;
}
.btn_set li a.yt:before{
   font: var(--fa-font-light);
   content: "\f144";
   right: 30px;
}

.name{
   font-size: clamp(14px, 1vw, 16px);
   font-weight: 500;
   line-height: 1.6em;
   margin: 20px 0 0 0;
   letter-spacing: 0.1em;
	text-align: left
}
@media screen and (min-width:768px) and ( max-width:1024px) {
.name{
	text-align: center;
	font-size: clamp(14px, 2vw, 24px);
}
}

.name span{
   font-size: 140%
}

.messe{
	font-size: clamp(20px, 2rem, 42px);
	text-align: left;
}

@media screen and (min-width:768px) and ( max-width:1024px) {
.messe{
	text-align: center;
	font-size: clamp(20px, 2.5rem, 50px);
}
}
@media screen and (max-width: 767px){
.messe{
	font-size: clamp(20px, 2.3rem, 40px);
}
}


.gra_img{
   max-height: 600px;
   min-height: 300px;
   height: auto;
   padding-top: 22vh;
}

@media screen and (min-width:768px) and ( max-width:1024px) {
.gra_img{
   max-height: 500px;
   min-height: 240px;
   height: auto;
   padding-top: 30px;
   padding-bottom: 60px
}
}
@media screen and (max-width: 767px){
.gra_img{
   max-height: 380px;
    min-height: 200px;
    margin: 20px auto 60px auto;
	padding: 0
}
}


.data{
	width:auto;
	flex-grow: 0;
	flex-shrink: 0;
	padding: 0 2%
}
@media screen and (max-width: 1024px){
.data{
	padding: 0 40px;
	margin: 0 auto;
	width: 70%;
}	
}

@media screen and (max-width:768px){
.data{
	width: 90%;
	padding: 0;
	margin: 0 auto
}	
}


.data_last{
	width: 450px;
	flex-grow: 0;
	flex-shrink: 0;
	padding: 0 40px
}
@media screen and (max-width:768px){
.data_last{
	width: 73%;
	padding: 0 40px;
	margin: 0 auto;
	text-align: center
}
}


@media screen and (min-width:768px) and ( max-width:1024px) {
.data_img{
	width: 70%;
	max-width: 200px;
	margin: -40px 0 0 0;
	position: relative;
	filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, .9));
}
}
@media screen and (max-width:767px){
.data_img{
	width: 70%;
	margin: -50px 0 0 0;
	position: relative;
	filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, .9));
}
}

.data a img{
	margin: 14px 0 0 0
}
.photo{
	max-width: 1100px;
	min-width: 300px;
	position: relative;
   
}
@media screen and (min-width:768px) and ( max-width:1024px) {
.photo{
	max-width: 100%;
	min-width: 0px;
	margin-bottom: 20px;
}
}

@media screen and (max-width:768px){
.photo{
	max-width: 100%;
	min-width: 0px;
	margin-bottom: 20px;
}
}


.child1{
  order: 1;
}
.child2{
  order: 2;
}
.child3{
  order: 3;
}




#mesasge_last_bg{
	background: url("../img/message_last.webp") no-repeat;
    background-size: cover;
    background-position: bottom center;
    width: 100%;
    min-height: 100vh;
    display: flex;
	justify-content: center;
	align-items:flex-start;
	padding-top: 65%;
	position: relative;
	
}

@media screen and (min-width:768px) and ( max-width:1024px) {
#mesasge_last_bg{
    min-height: 58vh;
}
}

@media screen and (max-width:767px){
#mesasge_last_bg{
    min-height: 48vh;
}
}

#last_bg_text{
font-size: 2rem;
    writing-mode: vertical-rl;
    text-orientation: upright;
    font-feature-settings: initial;
	margin: 200px auto 0 auto;
}
@media (orientation: landscape) {
#last_bg_text{
	font-size: 2rem;
}
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#last_bg_text{
	font-size: 1.6rem;
}
}


@media screen and (max-width:767px){
#last_bg_text{
	font-size: 1.4rem;

}
}





/*******************フッター*******************/

#last{
	background: url("../img/footer_bg.jpg") no-repeat;
	background-size: cover;
	background-position: center center;
	color: #fff;
	padding: 150px 0 30px 0;
	filter: grayscale(20%);
}
@media screen and (max-width:768px){
#last{
	padding: 0px 0 30px 0
}
}


#last_message{
	font-family: "fot-tsukuaoldmin-pr6n", sans-serif;
    font-weight: 300;
    font-style: normal;
    letter-spacing: 0.2em;
    font-size: 2.3rem;
    padding-top: 20vh;
	margin-bottom: 200px
}
@media screen and (min-width:768px) and ( max-width:1024px) {
#last_message{
	font-size: 2rem;
	padding-top: 7vh;
    margin-bottom: 150px;
}
}

@media screen and (max-width:767px){
#last_message{
	font-size: 1.3rem;
	padding-top: 9vh;
    margin-bottom: 70px;
}
}



.shadow{
    text-shadow: #000 0 0 10px;
}
.shadow_white{
    text-shadow: #fff 0 0 10px,;
}

.img_shadow{
	 filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, .5));
}
.img_white_shadow{
	 filter: drop-shadow(0px 0px 5px #fff) drop-shadow(0px 0px 5px #fff) drop-shadow(0px 0px 5px #fff) drop-shadow(0px 0px 5px #fff) drop-shadow(0px 0px 10px #fff);
}

#footer_logo{
	width: 270px;
	display: flex;
	justify-content: space-between;
	margin: 100px auto 15px auto
}
@media screen and (max-width:767px){
#footer_logo{
	margin: 60px auto 15px auto
}
}

#footer_logo img{
	width: 100px
}


.kaisu{
	font-size: 12px;
	font-weight: 400;
  	margin-bottom: 7px;
   	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}
@media screen and (max-width:768px){
.kaisu{
	width: 95%;
	margin: 0 auto 7px auto;
	font-size: 11px;
	text-align: left
}
}

copy{
	font-size: 12px;
  	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;;
}
@media screen and (max-width:768px){
copy{
	font-size: 11px;
}
}

/* Anchor
---------------------------- */
a {
	outline: none;
	text-decoration: none;
	color: inherit;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-box-shadow: none;
	box-shadow: none;
}


/* Image
---------------------------- */
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-box-shadow: none;
	box-shadow: none;
}


/* Button
---------------------------- */
button {
	display: block;
	margin: 0;
	padding: 0;
	width: 100%;
	background: none;
	border: 0;
	outline: none;
	box-sizing: border-box;
	letter-spacing: inherit;
	cursor: pointer;
	font: inherit;
	color: inherit;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-box-shadow: none;
	box-shadow: none;
}









/* Break Line
---------------------------- */
.pc { display: block !important; }
.sp { display: none !important; }

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




.mb_gallery{
	margin-bottom: 15px
}
@media screen and (max-width:768px) {
.mb_gallery{
	margin-bottom: 0px
}
}

.mb30{
	margin-bottom: 30px
}
.mb60{
	margin-bottom: 60px
}