@charset "UTF-8";
/* Scss Document */
/* Scss Document */
@import url("https://fonts.googleapis.com/css2?family=Alegreya+Sans:wght@300;400&family=Baskervville&family=Noto+Serif+JP&family=Roboto+Condensed:wght@300&display=swap");
/*layout*/
.mt0 { margin-top: 0px !important; }

.mb0 { margin-bottom: 0px !important; }

.pt0 { padding-top: 0px !important; }

.pl0 { padding-left: 0px !important; }

.pb0 { padding-bottom: 0px !important; }

.mt5 { margin-top: 5px !important; }

.mb5 { margin-bottom: 5px !important; }

.pt5 { padding-top: 5px !important; }

.pl5 { padding-left: 5px !important; }

.pb5 { padding-bottom: 5px !important; }

.mt10 { margin-top: 10px !important; }

.mb10 { margin-bottom: 10px !important; }

.pt10 { padding-top: 10px !important; }

.pl10 { padding-left: 10px !important; }

.pb10 { padding-bottom: 10px !important; }

.mt15 { margin-top: 15px !important; }

.mb15 { margin-bottom: 15px !important; }

.pt15 { padding-top: 15px !important; }

.pl15 { padding-left: 15px !important; }

.pb15 { padding-bottom: 15px !important; }

.mt20 { margin-top: 20px !important; }

.mb20 { margin-bottom: 20px !important; }

.pt20 { padding-top: 20px !important; }

.pl20 { padding-left: 20px !important; }

.pb20 { padding-bottom: 20px !important; }

.mt25 { margin-top: 25px !important; }

.mb25 { margin-bottom: 25px !important; }

.pt25 { padding-top: 25px !important; }

.pl25 { padding-left: 25px !important; }

.pb25 { padding-bottom: 25px !important; }

.mt30 { margin-top: 30px !important; }

.mb30 { margin-bottom: 30px !important; }

.pt30 { padding-top: 30px !important; }

.pl30 { padding-left: 30px !important; }

.pb30 { padding-bottom: 30px !important; }

.mt35 { margin-top: 35px !important; }

.mb35 { margin-bottom: 35px !important; }

.pt35 { padding-top: 35px !important; }

.pl35 { padding-left: 35px !important; }

.pb35 { padding-bottom: 35px !important; }

.mt40 { margin-top: 40px !important; }

.mb40 { margin-bottom: 40px !important; }

.pt40 { padding-top: 40px !important; }

.pl40 { padding-left: 40px !important; }

.pb40 { padding-bottom: 40px !important; }

.mt45 { margin-top: 45px !important; }

.mb45 { margin-bottom: 45px !important; }

.pt45 { padding-top: 45px !important; }

.pl45 { padding-left: 45px !important; }

.pb45 { padding-bottom: 45px !important; }

.mt50 { margin-top: 50px !important; }

.mb50 { margin-bottom: 50px !important; }

.pt50 { padding-top: 50px !important; }

.pl50 { padding-left: 50px !important; }

.pb50 { padding-bottom: 50px !important; }

.mt55 { margin-top: 55px !important; }

.mb55 { margin-bottom: 55px !important; }

.pt55 { padding-top: 55px !important; }

.pl55 { padding-left: 55px !important; }

.pb55 { padding-bottom: 55px !important; }

.mt60 { margin-top: 60px !important; }

.mb60 { margin-bottom: 60px !important; }

.pt60 { padding-top: 60px !important; }

.pl60 { padding-left: 60px !important; }

.pb60 { padding-bottom: 60px !important; }

.mt65 { margin-top: 65px !important; }

.mb65 { margin-bottom: 65px !important; }

.pt65 { padding-top: 65px !important; }

.pl65 { padding-left: 65px !important; }

.pb65 { padding-bottom: 65px !important; }

.mt70 { margin-top: 70px !important; }

.mb70 { margin-bottom: 70px !important; }

.pt70 { padding-top: 70px !important; }

.pl70 { padding-left: 70px !important; }

.pb70 { padding-bottom: 70px !important; }

.mt75 { margin-top: 75px !important; }

.mb75 { margin-bottom: 75px !important; }

.pt75 { padding-top: 75px !important; }

.pl75 { padding-left: 75px !important; }

.pb75 { padding-bottom: 75px !important; }

.mt80 { margin-top: 80px !important; }

.mb80 { margin-bottom: 80px !important; }

.pt80 { padding-top: 80px !important; }

.pl80 { padding-left: 80px !important; }

.pb80 { padding-bottom: 80px !important; }

.mt85 { margin-top: 85px !important; }

.mb85 { margin-bottom: 85px !important; }

.pt85 { padding-top: 85px !important; }

.pl85 { padding-left: 85px !important; }

.pb85 { padding-bottom: 85px !important; }

.mt90 { margin-top: 90px !important; }

.mb90 { margin-bottom: 90px !important; }

.pt90 { padding-top: 90px !important; }

.pl90 { padding-left: 90px !important; }

.pb90 { padding-bottom: 90px !important; }

.mt95 { margin-top: 95px !important; }

.mb95 { margin-bottom: 95px !important; }

.pt95 { padding-top: 95px !important; }

.pl95 { padding-left: 95px !important; }

.pb95 { padding-bottom: 95px !important; }

.mt100 { margin-top: 100px !important; }

.mb100 { margin-bottom: 100px !important; }

.pt100 { padding-top: 100px !important; }

.pl100 { padding-left: 100px !important; }

.pb100 { padding-bottom: 100px !important; }

/* special-notice
----------------------------------------------- */
/*#special-notice{
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 1;
	.notice-block{
		background-color: $color-03;
		text-align: center;
		+ .notice-block{
			border-top: 1px solid #fff;
		}
	}
	a{
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100%;
		padding: 10px;
		box-sizing: border-box;
		color: #fff;
		font-size: 14px;
		@media (max-width:767px){
			font-size: 12px;
		}
		p{
			line-height: 1;
			width: 100%;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}
	}
}*/
/* special-notice大き目ver　元の大きさに戻す際、こちらをコメントに上記をコメント外す
----------------------------------------------- */
#special-notice { position: absolute; width: 100%; top: 0; left: 0; z-index: 1; }
#special-notice .notice-block { background-color: #969696; text-align: center; }
#special-notice .notice-block + .notice-block { border-top: 1px solid #fff; }
#special-notice a { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; padding: 14px; box-sizing: border-box; color: #fff; font-size: 18px; font-weight: bold; }
@media (max-width: 767px) { #special-notice a { font-size: 14px; } }
#special-notice a p { line-height: 1; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* main_visual
----------------------------------------------- */
#main_visual { width: 100%; position: relative; height: 100vh; overflow: hidden; }
#main_visual #index-kv-slider { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: -1; }
#main_visual .video-wrap { overflow: hidden; position: relative; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; }
#main_visual .video-wrap video { position: absolute; top: 50%; left: 50%; display: block; width: 172.4137931034vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */ height: 58vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */ min-width: 100%; min-height: 100%; transform: translate(-50%, -50%); }
#main_visual .video-wrap video.is-sp { width: 46.20535714285714vh; /* 207：448 の幅→207 ÷ 448＝ 46.20535714285714% */ height: 216.4251207729469vw; /* 207：448の幅 → 448 ÷ 207 = 216.4251207729469% */ }
#main_visual #mv-logo { width: 100%; position: absolute; top: 50%; left: 0; transform: translateY(-50%); z-index: 1; text-align: center; }
@media (max-height: 666px) { #main_visual #mv-logo img { height: 30vh; } }

/* header
----------------------------------------------- */
@media (min-width: 960px) { #header { position: absolute; z-index: 2; margin-top: -150px; transition: all .3s; height: 150px; }
  #header .header-menu { background: rgba(0, 0, 0, 0.7); background: -webkit-linear-gradient(rgba(0, 0, 0, 0) 27%, rgba(0, 0, 0, 0.7) 62%); background: -ms-linear-gradient(rgba(0, 0, 0, 0) 27%, rgba(0, 0, 0, 0.7) 62%); /* IE */ }
  #header.fixed { position: fixed; margin-top: 0; height: 80px; }
  #header.fixed .header-menu { background: rgba(0, 0, 0, 0.7); } }

#fixed-buttons { bottom: 140px; transition: 1s; }

/* contents
----------------------------------------------- */
#contents { position: relative; z-index: 1; }

/* main
----------------------------------------------- */
main { position: relative; z-index: 1; background-color: #fff; }

/* セクション
----------------------------------------------- */
.index-bg-white { margin-top: 150vh; background-color: #fff; padding-bottom: 200px; overflow: hidden; }
.index-bg-white section { position: relative; z-index: 1; }
@media (max-width: 1024px) { .index-bg-white { margin-top: 100vh; } }
@media (max-width: 959px) { .index-bg-white { padding-bottom: 60px; } }
@media (max-height: 500px) { .index-bg-white { margin-top: 0; } }
@media (max-width: 479px) { .index-bg-white { padding-bottom: 100px; } }

/* IE10 & IE11 */
_:-ms-input-placeholder, :root .index-bg-white { margin-top: 0; }

.index-tit-01 { color: #000; font-family: "游明朝", "Yu Mincho", YuMincho, "Hiragino Mincho Pro", "Noto Serif JP", serif; font-size: 45px; font-weight: normal; line-height: 1.5555555556em; letter-spacing: 50/1000; }
@media (max-width: 767px) { .index-tit-01 { font-size: 26px; } }

.essence { font-family: "Baskerville Old Face", "Baskervville", serif; color: #969696; letter-spacing: 100/1000; font-size: 48px; line-height: 1; }
.essence .number { font-family: "游明朝", "Yu Mincho", YuMincho, "Hiragino Mincho Pro", "Noto Serif JP", serif; letter-spacing: 0; font-size: 80px; display: inline-block; margin-left: .1em; color: #000; font-weight: normal; }

#index-01 { position: -webkit-sticky; position: sticky; top: 0; z-index: -1; display: flex; flex-direction: column; justify-content: center; overflow: hidden; background-color: #FFF; }
@media (min-height: 501px) { #index-01 { min-height: 100vh; } }
@media (max-width: 767px) { #index-01 { /**/ padding-top: 60px; padding-bottom: 60px; } }
@media (max-height: 500px) { #index-01 { position: relative; padding-top: 60px; padding-bottom: 60px; } }
#index-01 .com-container-01 { width: 100%; position: relative; box-sizing: border-box; }
@media (min-width: 768px) { #index-01 .com-container-01 { display: flex; align-items: center; } }
@media (max-width: 1430px) and (min-width: 960px) { #index-01 .com-container-01 { padding-right: 115px; } }
@media (max-width: 1430px) and (min-width: 768px) { #index-01 .com-container-01 .index-tit-01 { font-size: 36px; } }
#index-01 .com-container-01 .text { position: relative; z-index: 2; margin-right: 0; margin-left: auto; width: 44.1666666667%; /*@media (max-width:989px){
	padding-top: 0;
}*/ }
@media (max-width: 1024px) { #index-01 .com-container-01 .text { padding-top: 0; } }
@media (min-width: 768px) and (max-width: 959px) { #index-01 .com-container-01 .text { width: 75%; } }
@media (max-width: 1430px) and (min-width: 960px) and (max-height: 1023px) { #index-01 .com-container-01 .text { width: 53.75%; } }
@media (min-width: 768px) { #index-01 .com-container-01 .text { order: 2; } }
@media (max-width: 767px) { #index-01 .com-container-01 .text { width: 100%; } }
#index-01 .com-container-01 .text .txt { margin-top: 5.0505050505vh; }
@media (min-height: 990px) { #index-01 .com-container-01 .text .txt { margin-top: 50px; } }
@media (max-width: 374px) and (max-height: 666px) { #index-01 .com-container-01 .text .txt { margin-top: 40px; } }
#index-01 .com-container-01 .com-btn-01 { margin-right: 0; margin-left: auto; margin-top: 9.0909090909vh; }
@media (min-height: 990px) { #index-01 .com-container-01 .com-btn-01 { margin-top: 90px; } }
@media (max-width: 767px) { #index-01 .com-container-01 .com-btn-01 { margin-top: 0; } }
@media (max-width: 374px) and (max-height: 666px) { #index-01 .com-container-01 .com-btn-01 { margin-top: 30px; } }
#index-01 .animation-contents { position: relative; z-index: 0; height: 100%; }
@media (min-width: 768px) { #index-01 .animation-contents { display: flex; align-items: center; margin-right: -50%; order: 1; } }
@media (max-width: 767px) { #index-01 .animation-contents { margin-bottom: 2em; } }
@media (max-width: 374px) and (max-height: 666px) { #index-01 .animation-contents { /*position: absolute;
left: 0;
bottom: 30px;*/ margin-top: -33vh; margin-bottom: 0; } }
#index-01 .bg-illust { position: relative; }
#index-01 figure { position: relative; z-index: -1; width: 99.75%; left: -13.3333333333%; }
@media (max-width: 767px) { #index-01 figure { width: 100%; left: -6.518904824%; } }
@media (max-width: 767px) and (min-width: 501px) and (max-height: 829px) { #index-01 figure { width: 70%; margin-left: auto; margin-right: auto; } }
#index-01 figure > img { width: 100%; /*@media (min-width: 960px){
	max-height: calc(100vh - 80px);
}
@media (max-width: 959px){
	max-height: calc(100vh - 55px);
}*/ transition: opacity 4s ease; transition-delay: 1s; }
@media (min-width: 768px) { #index-01 figure > img { height: 100%; object-fit: contain; object-position: left center; font-family: 'object-fit: contain;object-position: left center;'; } }
#index-01 figure > img.gray { opacity: 1; position: absolute; top: 0; left: 0; z-index: 1; }
#index-01 figure > img.gray.inview { opacity: 0; }
#index-01 figure > img.color.inview { opacity: 1; }
#index-01 figure .clouds { position: absolute; top: 0; left: 0; z-index: -2; width: 100%; height: 100%; filter: grayscale(100%); /* モノクロにする */ -webkit-filter: grayscale(100%); /* モノクロにする */ transition: 4s ease; transition-delay: 1s; }
#index-01 figure .clouds.inview { filter: grayscale(0%); /* モノクロ解除 */ -webkit-filter: grayscale(0%); /* モノクロ解除 */ }
#index-01 figure .clouds > div.cloud01 { margin-left: 58.4795321637%; width: 23.4753550543%; }
#index-01 figure .clouds > div.cloud02 { margin-top: 1.3280212483%; margin-left: 2.5062656642%; width: 21.1361737678%; }
#index-01 figure .clouds > div.cloud03 { margin-top: 0.6640106242%; margin-left: 75.1879699248%; width: 13.1161236424%; }
#index-01 figure .clouds > div.cloud04 { margin-top: 0.6640106242%; width: 7.2681704261%; }
#index-01 figure .bike { position: absolute; bottom: -6%; left: 50%; width: 14%; -webkit-animation: bike linear infinite; -webkit-animation-duration: 37.5s; animation: bike linear infinite; animation-duration: 37.5s; }
@media (max-width: 959px) { #index-01 figure .bike { -webkit-animation-duration: 15s; animation-duration: 15s; } }
@media (max-width: 767px) { #index-01 figure .bike { -webkit-animation-duration: 20s; animation-duration: 20s; } }
#index-01 .animate-airplane { position: absolute; transition: .3s; right: 0; bottom: 40%; z-index: 0; width: 63px; opacity: 0; }
@media (min-width: 960px) { #index-01 .animate-airplane { transform: translate(63px, 21px); } }
@media (max-width: 959px) and (min-width: 768px) { #index-01 .animate-airplane { width: 40px; } }
@media (max-width: 479px) { #index-01 .animate-airplane { width: 25px; transform: translate(25px, 8px); } }
@media (min-width: 960px) { #index-01 .animate-airplane.inview { -webkit-animation: airplane linear infinite; -webkit-animation-duration: 37.5s; animation: airplane linear infinite; animation-duration: 37.5s; } }
@media (max-width: 959px) and (min-width: 768px) { #index-01 .animate-airplane.inview { -webkit-animation: airplane linear infinite; -webkit-animation-duration: 30s; animation: airplane linear infinite; animation-duration: 30s; } }
@media (max-width: 767px) { #index-01 .animate-airplane.inview { -webkit-animation: airplaneTAB linear infinite; -webkit-animation-duration: 20s; animation: airplaneTAB linear infinite; animation-duration: 20s; } }

@-webkit-keyframes airplane { 0% { opacity: 0; bottom: 40%; }
  1% { opacity: 1; }
  99% { opacity: 1; }
  100% { opacity: 0; transform: translate(-100vw, 0); bottom: 160%; } }
@keyframes airplane { 0% { opacity: 0; bottom: 40%; }
  1% { opacity: 1; }
  99% { opacity: 1; }
  100% { opacity: 0; transform: translate(-100vw, 0); bottom: 160%; } }
@-webkit-keyframes airplaneTAB { 0% { opacity: 0; bottom: 40%; }
  1% { opacity: 1; }
  99% { opacity: 1; }
  100% { opacity: 0; transform: translate(-100vw, 0); bottom: 140%; } }
@keyframes airplaneTAB { 0% { opacity: 0; bottom: 40%; }
  1% { opacity: 1; }
  99% { opacity: 1; }
  100% { opacity: 0; transform: translate(-100vw, 0); bottom: 140%; } }
@-webkit-keyframes bike { 0% { opacity: 0; bottom: -6%; left: 50%; width: 14%; }
  0% { opacity: 1; }
  99% { opacity: 1; }
  100% { opacity: 0; bottom: 10%; left: 100%; width: 5%; } }
@keyframes bike { 0% { opacity: 0; bottom: -6%; left: 50%; width: 14%; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { opacity: 0; bottom: 10%; left: 100%; width: 5%; } }
.index-bg-01 { position: relative; padding-top: 40px; width: 100%; }
.index-bg-01:before { content: ''; display: block; width: 100%; max-width: 2000px; height: 1099px; background: url("../images/index/inndex-bg-01.png") no-repeat center top/contain; position: absolute; z-index: -1; top: 0; right: 0; }
@media (max-width: 959px) { .index-bg-01:before { width: 179.2%; right: auto; left: -10.6666666667%; } }
@media (max-width: 479px) { .index-bg-01:before { max-width: 479px; height: 414px; right: 0; left: auto; background: url("../images/index/inndex-bg-01_sp.png") no-repeat center center/contain; } }

.index-panel-01 .index-panel-01-inner { position: relative; max-width: 1700px; margin-right: 0; margin-left: auto; padding-left: 5.8823529412%; }
@media (max-width: 959px) { .index-panel-01 .index-panel-01-inner { padding-right: 16px; padding-left: 16px; } }
@media (min-width: 960px) { .index-panel-01 .flex { display: flex; flex-wrap: wrap; } }
@media (min-width: 960px) { .index-panel-01 .image { width: 58.8235294118%; } }
.index-panel-01 .btn { width: 100%; margin-top: 120px; }
@media (min-width: 960px) { .index-panel-01 .btn { text-align: right; padding-right: 70px; } }
@media (max-width: 959px) { .index-panel-01 .btn { margin-top: 40px; text-align: center; /*padding-right: 16px;
padding-left: 16px;*/ } }
.index-panel-01 .essence { width: 100%; margin-bottom: 30px; }
@media (max-width: 959px) { .index-panel-01 .essence { margin-bottom: 10px; } }
@media (min-width: 960px) { .index-panel-01 .text { width: 41.1764705882%; padding-right: 5.8823529412%; padding-top: 20px; } }
@media (max-width: 959px) { .index-panel-01 .text { margin-bottom: 40px; } }
.index-panel-01 .text h2 { position: relative; z-index: 1; width: 100%; margin-bottom: 60px; /*@media (max-width:767px){
	margin-bottom: 40px;
}*/ }
@media (max-width: 959px) { .index-panel-01 .text h2 { margin-bottom: 30px; } }
.index-panel-01 .animate-from-left { transform: translateX(-5%); transition: .7s ease-in; }
.index-panel-01 .animate-from-left.inview { transform: translateX(0); opacity: 1; }
.index-panel-01 .animate-from-right { transform: translateX(5%); transition: .7s ease-in; }
.index-panel-01 .animate-from-right.inview { transform: translateX(0); opacity: 1; }
.index-panel-01 .animate-from-bottom { transform: translateY(5%); transition: .7s ease-in; }
.index-panel-01 .animate-from-bottom.inview { transform: translateX(0); opacity: 1; }
.index-panel-01 .animate-from-top { transform: translateY(-5%); transition: .7s ease-in; }
.index-panel-01 .animate-from-top.inview { transform: translateX(0); opacity: 1; }

.index-panel-02-container { position: relative; }

.index-panel-02-grid { display: flex; flex-wrap: wrap; }
.index-panel-02-grid > * { width: 33.3332%; border-right: 1px solid #fff; }
.index-panel-02-grid > *:last-child { border-right: none; }
@media (max-width: 959px) { .index-panel-02-grid > * { width: 100%; border-right: none; border-bottom: 1px; }
  .index-panel-02-grid > *:last-child { border-bottom: none; } }

.index-panel-02-item { position: relative; height: 800px; display: flex; justify-content: center; flex-direction: column; padding-top: 12.5%; padding-bottom: 8.75%; }
@media (max-width: 1199px) { .index-panel-02-item { height: 700px; } }
@media (max-width: 959px) { .index-panel-02-item { height: 350px; padding: 8.5714285714% 0; } }
@media (max-width: 767px) { .index-panel-02-item { height: 260px; } }
.index-panel-02-item .header { padding: 0 10.4947526237%; margin-bottom: 2.5vw; }
@media (max-width: 959px) { .index-panel-02-item .header { padding-left: 16px; padding-right: 16px; } }
.index-panel-02-item .header p { opacity: .6; line-height: 1; margin-bottom: 1em; color: #fff; }
@media (max-width: 959px) { .index-panel-02-item .header p { display: none; } }
.index-panel-02-item .header .tit { color: #595656; font-size: 4vw; font-family: "Baskerville Old Face", "Baskervville", serif; line-height: 0.8125; opacity: .35; font-weight: bold; color: #fff; }
@media (max-width: 959px) { .index-panel-02-item .header .tit { font-size: 40px; } }
.index-panel-02-item .bottom { text-align: right; margin-top: auto; margin-bottom: 0; padding: 0 4.4977511244%; }
.index-panel-02-item .lead { opacity: 0; transition: .5s; padding: 0 10.4947526237%; color: #fff; }
@media (max-width: 959px) { .index-panel-02-item .lead { display: none; padding-left: 16px; padding-right: 16px; } }
.index-panel-02-item .btn { background: transparent; border: 1px solid #fff; color: #fff; font-size: 16px; width: 260px; height: 40px; display: inline-flex; flex-direction: column; justify-content: flex-start; align-items: center; overflow: hidden; position: relative; text-decoration: none; transition: all 0.5s; }
.index-panel-02-item .btn:after { content: ''; display: block; width: 15px; height: 1px; background: #fff; transition: all 0.5s; position: absolute; left: calc(100% - 15px); top: 50%; }
.index-panel-02-item .btn span { line-height: 40px; transition: .3s; }
.index-panel-02-item .btn .jp { font-family: "Baskerville Old Face", "Baskervville", serif; }
.index-panel-02-item .btn .en { font-family: "Baskerville Old Face", "Baskervville", serif; }
.index-panel-02-item .bg { transition: 1s; opacity: 1; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: -1; }
.index-panel-02-item .bg img { position: absolute; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; max-width: none; object-fit: cover; font-family: 'object-fit: cover'; }
.index-panel-02-item .bg:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; content: ''; background: rgba(255, 255, 255, 0.26); }
.index-panel-02-item:hover .header p, .index-panel-02-item:hover .header .tit { opacity: 1; }
.index-panel-02-item:hover .header p { text-shadow: 0 0 5px rgba(0, 0, 0, 0.5); }
.index-panel-02-item:hover .header .tit { text-shadow: 0 0 10px rgba(0, 0, 0, 0.25); }
.index-panel-02-item:hover .btn { border-color: #000 !important; background-color: #000; }
.index-panel-02-item:hover .btn:after { width: 0; }
.index-panel-02-item:hover .btn span { transform: translateY(-40px); }
@media (min-width: 960px) { body:not(.is-touchdevice) .index-panel-02-item:hover .lead, .index-panel-02-item.hover .lead { opacity: 1; text-shadow: 0 0 5px rgba(0, 0, 0, 0.5); } }
body:not(.is-touchdevice) .index-panel-02-item:hover .btn, .index-panel-02-item.hover .btn { border-color: #fff; }
body:not(.is-touchdevice) .index-panel-02-item:hover .btn::before, .index-panel-02-item.hover .btn::before { height: 0; }

.index-panel-02-nav li { transition: 1s; /*a{
	cursor: default;
}*/ }
.index-panel-02-nav:hover { /*li.transparent {
	@media (min-width: 960px) {
		.index-panel-02-item header{
			p{
				opacity: .6;
			}
			.tit{
				opacity: .35;
			}
		}
	}
}*/ }
@media (min-width: 960px) { .index-panel-02-nav:hover .bg { opacity: 0; } }

.index-panel-02-contents { overflow: hidden; z-index: -2; position: absolute; top: 0; left: 0; width: 100%; height: 100%; /*&:after {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	content:'';
	background: rgba(#fff,.26);
}*/ }
.index-panel-02-contents > div { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: 1s; opacity: 0; }
@media (min-width: 960px) { .index-panel-02-contents > div.active { display: block; opacity: 1; } }
.index-panel-02-contents video { position: absolute; object-fit: cover; width: 100%; height: 100%; font-family: 'object-fit: cover'; 		/*
		max-width: none;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);     		z-index: 1;
		*/ }
@media (max-width: 1199px) { .index-panel-02-contents video { min-height: 500px; } }
@media (max-width: 959px) { .index-panel-02-contents video { min-height: 350px; } }
.index-panel-02-contents figure { position: absolute; width: 100%; height: 100%; }
.index-panel-02-contents figure img { position: absolute; width: 100%; height: 100%; object-fit: cover; font-family: "object-fit: cover;"; }

.index-panel-03 .bg-area { position: relative; padding-top: 50px; padding-bottom: 50px; }
.index-panel-03 .bg-area:before { content: ''; display: block; width: 77.25%; height: 100%; background: #f3efee; position: absolute; z-index: -1; left: 0; top: 0; }
@media (max-width: 767px) { .index-panel-03 .bg-area:before { width: 100%; } }
@media (min-width: 768px) { .index-panel-03 .image-links { display: flex; justify-content: space-around; } }
.index-panel-03 .image-links .image-links-panel { display: block; text-align: center; }
@media (min-width: 768px) { .index-panel-03 .image-links .image-links-panel { max-width: 25%; transition: .5s; } }
@media (max-width: 767px) { .index-panel-03 .image-links .image-links-panel { max-width: 400px; margin-left: auto; margin-right: auto; }
  .index-panel-03 .image-links .image-links-panel + .image-links-panel { margin-top: 30px; } }
.index-panel-03 .image-links .image-links-panel .tit { font-family: "Baskerville Old Face", "Baskervville", serif; font-size: 40px; line-height: 1; margin-top: 10px; text-align: right; }
.index-panel-03 .image-links .image-links-panel .tit span { display: inline-block; border-bottom: 2px solid #000; }
.index-panel-03 .image-links .image-links-panel:hover { transform: scale(1.05); }
@media (min-width: 768px) { .index-panel-03 .image-links .image-links-panel:nth-child(2) { margin-top: 120px; }
  .index-panel-03 .image-links .image-links-panel:nth-child(3) { margin-top: -135px; } }
@media (min-width: 1025px) { .index-panel-03 .text { max-width: 1300px; display: flex; align-items: flex-end; } }
@media (max-width: 1024px) { .index-panel-03 .text { width: 100%; margin-top: 40px; } }
@media (min-width: 1025px) { .index-panel-03 .text header { flex-shrink: 0; flex-grow: 0; margin-right: 4.6153846154%; } }
@media (max-width: 1024px) { .index-panel-03 .text header { margin-bottom: 30px; }
  .index-panel-03 .text header .essence { margin-bottom: 30px; } }
@media (max-width: 959px) { .index-panel-03 .text header .essence { margin-bottom: 10px; } }
@media (min-width: 1025px) { .index-panel-03 .text p { padding-top: 80px; } }
.index-panel-03 .buttons { margin-top: 50px; text-align: right; }
@media (max-width: 767px) { .index-panel-03 .buttons { text-align: center; } }
.index-panel-03 .buttons a + a { margin-left: 35px; }
@media (max-width: 767px) { .index-panel-03 .buttons a + a { margin-left: 0; margin-top: 30px; } }

.index-panel-04 * { box-sizing: border-box; }
@media (min-width: 768px) { .index-panel-04 .text { display: flex; align-items: center; justify-content: space-between; margin-bottom: 70px; } }
@media (max-width: 767px) { .index-panel-04 .text { margin-bottom: 40px; } }
@media (min-width: 768px) { .index-panel-04 .text h2 { width: 37.75%; } }
@media (max-width: 767px) { .index-panel-04 .text h2 { text-align: center; margin-bottom: 30px; } }
@media (min-width: 768px) { .index-panel-04 .text p { padding: 0 50px; width: 100%; max-width: 690px; } }

#journal-feed { display: flex; justify-content: space-between; flex-wrap: wrap; }
#journal-feed .journal-box { border: 10px solid #ebecee; width: 22.9166666667%; }
@media (max-width: 767px) { #journal-feed .journal-box { width: calc(50% - 8px); margin-top: 16px; }
  #journal-feed .journal-box:nth-of-type(-n+2) { margin-top: 0; } }
#journal-feed .journal-box a { position: relative; display: block; }
#journal-feed .journal-box a figure { position: relative; }
#journal-feed .journal-box a figure img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; font-family: "object-fit: cover;"; }
#journal-feed .journal-box a figure:before { content: ''; display: block; padding-top: 100%; }
#journal-feed .journal-box a .txt { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); color: #fff; font-size: 17px; line-height: 28/17; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; font-family: "Baskerville Old Face", "Baskervville", serif; opacity: 0; transition: .3s; }
#journal-feed .journal-box a:hover img { opacity: 1; }
#journal-feed .journal-box a:hover .txt { opacity: 1; }

#index-05 { /*padding-top: 270px;
@media (max-width: 767px){
	padding-top: 50px;
}*/ }
#index-05 .essence { margin-bottom: 50px; }
@media (max-width: 959px) { #index-05 .essence { margin-bottom: 10px; } }

/* ニュースフィード
----------------------------------------------- */
#news { position: relative; z-index: 2; }
@media (max-width: 959px) { #news { margin-bottom: 50px; } }
@media (max-width: 767px) { #news { height: auto; } }
#news .news-bg { background-color: #f3efee; }
#news .flex { display: flex; flex-wrap: wrap; align-items: flex-start; }
@media (min-width: 960px) { #news .flex > div { min-width: 0; flex: 1; } }
@media (max-width: 959px) { #news .flex > div { width: 100%; } }
#news h3 { font-family: "Baskerville Old Face", "Baskervville", serif; font-size: 20px; flex-shrink: 0; padding-right: 60px; margin-right: 10px; position: relative; line-height: 40px; }
#news h3:after { content: ''; display: block; width: 50px; height: 1px; background-color: #000; position: absolute; top: 50%; right: 0; }
@media (max-width: 767px) { #news h3:after { width: 20px; } }
#news a { display: flex; align-items: center; line-height: 40px; }
#news a .date { display: inline-block; margin-right: 2em; font-family: "Baskerville Old Face", "Baskervville", serif; }
#news a .title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-left: 0; margin-right: auto; width: 100%; }
#news a .more { flex-grow: 0; flex-shrink: 0; margin-right: 0; margin-left: 20px; display: block; position: relative; text-align: right; font-size: 18px; font-family: "Baskerville Old Face", "Baskervville", serif; line-height: 1.2; }
@media (max-width: 767px) { #news a .more { width: 90px; font-size: 15px; } }
#news a .more:after { content: ''; display: block; width: 100%; height: 2px; background-color: #000; position: absolute; left: 0; bottom: 0; }
#news a .more:hover:after { animation: newsLine .3s ease-out forwards; }

.kv-news-list.visible-all li:nth-child(n + 2) { height: auto; max-height: 1000px; opacity: 1; }
.kv-news-list.visible-all li + li { margin-top: 8px; }
.kv-news-list li:nth-child(n + 2) { transition: .4s; height: 0; max-height: 0; opacity: 0; overflow: hidden; }

.js-news-more-btn { cursor: pointer; font-family: "Baskerville Old Face", "Baskervville", serif; width: 100px; margin: auto; text-align: center; position: relative; }
.js-news-more-btn:before { content: ''; display: block; width: 50px; height: 50px; border-right: 1px solid #f3efee; border-bottom: 1px solid #f3efee; position: absolute; transform-origin: center center; transform: rotate(45deg) translate(-7px, -7px); transition: .3s; left: 0; right: 0; top: 0; margin: auto; }
.js-news-more-btn:hover:before { transform: rotate(45deg) translate(-3px, -3px); border-color: #9d9da3; }
.js-news-more-btn.active:before { display: none; }

@keyframes newsLine { 0% { width: 0; }
  100% { width: 65px; } }
@keyframes newsLineSP { 0% { width: 0; }
  100% { width: 20px; } }
/* プラン
----------------------------------------------- */
#plan .plan-bg { position: relative; padding-bottom: 50px; }
#plan .plan-bg:before { position: absolute; z-index: 0; bottom: 0; left: 0; content: ''; display: block; width: 100%; height: 50%; background-color: #ebecee; }
@media (max-width: 1240px) { #plan .plan-bg:before { height: calc(100% - 105px - ((206/1240*100)/6)*5vw); } }
@media (max-width: 767px) { #plan .plan-bg:before { height: calc(100% - 73px - ((336/767*100)/6)*5vw); } }
@media (max-width: 480px) { #plan .plan-bg:before { height: calc(100% - 73px - ((175/480*100)/6)*5vw); } }
#plan .plan-list-container { position: relative; z-index: 1; }
@media (max-width: 767px) { #plan .plan-list-container { display: none; }
  #plan .plan-list-container.initialized { display: block; } }
@media (min-width: 768px) { #plan .plan-list-container .plan-list { display: flex; flex-wrap: wrap; margin-left: -40px; }
  #plan .plan-list-container .plan-list > * { width: 100%; box-sizing: border-box; }
  #plan .plan-list-container .plan-list > * { padding-left: 40px; flex: 1; } }
@media (max-width: 767px) { #plan .plan-list-container .plan-list { overflow: hidden; }
  #plan .plan-list-container .plan-list .slick-slide { padding: 0 10px; }
  #plan .plan-list-container .plan-list .slick-slide img { width: 100%; } }
#plan .plan-list-container .plan-list p { padding: 1em 1em 0; }
@media (max-width: 479px) { #plan .plan-list-container .plan-list p { padding: 1em 1.5em 0; } }
#plan .com-btn-01 { position: relative; z-index: 1; }

/* footer
----------------------------------------------- */
footer { margin-top: 0; }

/*20250724追記*/
.attention { padding: 10px; }

.attention p { max-width: 700px; text-align: center; /*border: 1px solid #000000;*/ padding: 40px 10px; margin: 30px auto; font-size: 20px; font-weight: bold; line-height: 30px; background-color: #f3efee; }
@media (max-width: 767px) { .attention p { font-size: 18px; } }

/* デフォルトでは非表示 */
.sp-only { display: none; }

/* スマホ時のみ表示 */
@media screen and (max-width: 768px) { .sp-only { display: inline; } }

/*# sourceMappingURL=index.css.map */