*, *::before, *::after { box-sizing: border-box; }

body { color: #fff; background: #192528; font-size: 1.5vw; letter-spacing: .1em; line-height: 1.6; font-family: noto-sans-cjk-jp, sans-serif; font-weight: 300; font-style: normal; font-feature-settings: "palt"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
@media screen and (max-width: 599px) { body { font-size: 3vw; } }

_:lang(x)::-ms-backdrop, .selector { font-family: "Segoe UI", Meiryo, sans-serif; }

.fnt-SSM6 { font-family: tot-shizukasmudgemin-stdn, sans-serif; font-weight: 600; font-style: normal; letter-spacing: normal; }

p { line-height: 1.8; }

img { border: 0; vertical-align: top; }

input, select { position: relative; top: 1px; }

table, th, td { border-collapse: collapse; border-spacing: 0; }

ul, li { list-style: none; }

a:link, a:visited { color: #fff; text-decoration: none; transition: opacity 0.5s; }
a:hover, a:active { opacity: .6; }

#cover { width: 100%; height: 100%; position: fixed; background: #192528; top: 0; left: 0; z-index: 10000; }

#loader { opacity: 0; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 300px; height: 250px; }
#loader img { width: 100%; height: auto; }
@media screen and (max-width: 599px) { #loader { width: 210px; height: 175px; } }

#wrapper { overflow: hidden; position: relative; }

#page-top { opacity: 0; position: fixed; bottom: 20px; right: 20px; z-index: 9000; width: 40px; pointer-events: none; }
#page-top img { width: 100%; height: auto; }
#page-top.fade { opacity: 1; transition: opacity .5s; pointer-events: auto; }

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

@media screen and (max-width: 599px) { .nn599 { display: none !important; } }

.fadeinS, .fadein1, .fadein2, .fadein3, .fadein4, .fadein5, .fadein6, .fadeinF { opacity: 0; transform: translateY(30px); transition: opacity 1s ease-in, transform 1s ease-out; }
.fadeinS.active, .fadein1.active, .fadein2.active, .fadein3.active, .fadein4.active, .fadein5.active, .fadein6.active, .fadeinF.active { opacity: 1; transform: translateY(0); }

#header { position: fixed; top: 0; left: 0; z-index: 900; padding: 2em 0 0 5%; }
@media screen and (max-width: 599px) { #header { padding: 1.5em 0 0 5%; } }
#header h1 { width: 20vw; filter: drop-shadow(2px 1px 0px rgba(0, 0, 0, 0.8)); }
@media screen and (max-width: 599px) { #header h1 { width: 55%; filter: drop-shadow(2px 1px 0px rgba(0, 0, 0, 0.5)); } }
#header h1 img { width: 100%; height: auto; }

main { position: relative; }
main section { position: relative; }
main section#topMainSct { background: url("../img/top_main_pic.webp") no-repeat center center/cover; height: 100vh; }
@media screen and (max-width: 599px) { main section#topMainSct { height: 90vh; background-position: 92% center; } }
main section#topMainSct .txtB { position: absolute; left: 7%; bottom: 4.5em; }
@media screen and (max-width: 599px) { main section#topMainSct .txtB { bottom: 4em; } }
main section#topMainSct .txtB .head { font-size: 470%; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); letter-spacing: -.03em; line-height: 1.6; }
@media screen and (max-width: 599px) { main section#topMainSct .txtB .head { font-size: 580%; line-height: 1.1; margin-bottom: .3em; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); } }
main section#topMainSct .txtB .txt { padding-left: .4em; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.9); }
@media screen and (max-width: 599px) { main section#topMainSct .txtB .txt { font-size: 120%; } }
main section#topAboutSct { background: url("../img/top_about_pic.webp") no-repeat center center/cover; height: 100vh; overflow: hidden; }
@media screen and (max-width: 599px) { main section#topAboutSct { height: 90vh; background-position: 77% center; } }
main section#topAboutSct .headB { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); writing-mode: vertical-rl; white-space: nowrap; }
@media screen and (max-width: 599px) { main section#topAboutSct .headB { transform: translateX(-50%) translateY(-95%); } }
main section#topAboutSct .headB .head { font-size: 12.5vh; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); letter-spacing: -.03em; line-height: 1.1; }
@media screen and (max-width: 599px) { main section#topAboutSct .headB .head { font-size: 12vw; } }
main section#topAboutSct .headB .head span { display: block; padding-top: 1.8em; }
@media screen and (max-width: 599px) { main section#topAboutSct .spBox { position: absolute; width: 100%; padding: 0 6%; bottom: 50%; transform: translateY(110%); font-size: 130%; } }
main section#topAboutSct .spBox .txt1 { position: absolute; left: 7%; top: 9em; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); }
@media screen and (max-width: 599px) { main section#topAboutSct .spBox .txt1 { position: relative; left: inherit; top: inherit; display: block; } }
main section#topAboutSct .spBox .txt2 { position: absolute; right: 7%; bottom: 7em; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); }
@media screen and (max-width: 599px) { main section#topAboutSct .spBox .txt2 { position: relative; right: inherit; bottom: auto; display: block; } }
main section#topAboutSct .wind1 { position: absolute; z-index: 50; top: -3em; left: -30%; width: 170%; }
@media screen and (max-width: 599px) { main section#topAboutSct .wind1 { top: -3.9em; left: -141%; width: 415%; } }
main section#topAboutSct .wind1 img { width: 100%; height: auto; }
main section#topAboutSct .wind2 { position: absolute; z-index: 50; bottom: -1em; left: -48%; width: 170%; }
@media screen and (max-width: 599px) { main section#topAboutSct .wind2 { bottom: -1.3em; left: -185%; width: 415%; } }
main section#topAboutSct .wind2 img { width: 100%; height: auto; }
main section#topAreaSct { padding: 7em 0 2.5em; background: url("../img/top_area_bg.webp") no-repeat center top/100%; }
@media screen and (max-width: 599px) { main section#topAreaSct { padding: 6em 0 2em; background-image: url("../img/top_area_bg-sp.webp"); } }
main section#topAreaSct .head { position: relative; z-index: 5; display: block; font-size: 325%; line-height: 1.4; margin: 0 0 1.5em 7%; }
@media screen and (max-width: 599px) { main section#topAreaSct .head { font-size: 270%; white-space: nowrap; margin: 0 0 1em 7%; } }
main section#topAreaSct .head span { display: block; padding-left: 1.4em; }
main section#topAreaSct .areaB { position: relative; z-index: 5; margin-bottom: 4em; }
@media screen and (max-width: 599px) { main section#topAreaSct .areaB { margin-bottom: 5em; } }
main section#topAreaSct .areaB .txtB { display: flex; margin: 0 10% 1.4em; }
@media screen and (max-width: 599px) { main section#topAreaSct .areaB .txtB { display: block; margin: 0 6% 1.8em 15%; } }
main section#topAreaSct .areaB .txtB .area { font-size: 230%; white-space: nowrap; line-height: 1.4; padding-right: .5em; }
@media screen and (max-width: 599px) { main section#topAreaSct .areaB .txtB .area { font-size: 270%; letter-spacing: .05em; margin-bottom: .1em; } }
main section#topAreaSct .areaB .txtB .detail { font-size: 80%; }
@media screen and (max-width: 599px) { main section#topAreaSct .areaB .txtB .detail { font-size: 130%; line-height: 1.7; } }
main section#topAreaSct .areaB .galleryB { position: relative; }
main section#topAreaSct .areaB .galleryB ul { margin-left: 10%; width: 110%; }
@media screen and (max-width: 599px) { main section#topAreaSct .areaB .galleryB ul { margin-left: 15%; width: 155%; } }
main section#topAreaSct .areaB .galleryB ul li { width: 50%; }
main section#topAreaSct .areaB .galleryB ul li img { width: 97%; height: auto; }
main section#topAreaSct .areaB .galleryB ul .slick-next-A { position: absolute; left: -4%; top: 50%; transform: translateY(-50%); width: 2em; height: 2em; }
@media screen and (max-width: 599px) { main section#topAreaSct .areaB .galleryB ul .slick-next-A { left: -6.5%; width: 2.6em; height: 2.6em; } }
main section#topAreaSct .areaB .galleryB ul .slick-next-A img { width: 100%; height: auto; }
main section#topConnectSct { padding: 5.5em 0 7em; background: #fffdf8; color: #000; }
@media screen and (max-width: 599px) { main section#topConnectSct { padding: 4.5em 0 7em; } }
main section#topConnectSct .headB { padding-left: 7%; margin-bottom: 4.5em; background: url("../img/illst_wave.svg") no-repeat 106% 3em/53%; }
@media screen and (max-width: 599px) { main section#topConnectSct .headB { padding: 0 0 6em 8%; background-position: 330% bottom; background-size: 97.5%; } }
main section#topConnectSct .headB .head { color: #aa9871; font-size: 250%; line-height: 1.6; white-space: nowrap; }
main section#topConnectSct .headB .head span { position: relative; left: -.5em; margin-right: -.7em; font-size: 110%; }
main section#topConnectSct .inner { position: relative; padding: 0 12%; }
@media screen and (max-width: 599px) { main section#topConnectSct .inner { padding: 0 6%; } }
main section#topConnectSct .inner .ifaLogo { width: 50%; margin: 0 auto 4em; }
@media screen and (max-width: 599px) { main section#topConnectSct .inner .ifaLogo { width: 94%; } }
main section#topConnectSct .inner .ifaLogo img { width: 100%; height: auto; }
main section#topConnectSct .inner .txt { display: block; font-size: 110%; text-align: justify; text-justify: inter-ideograph; margin-bottom: .5em; }
@media screen and (max-width: 599px) { main section#topConnectSct .inner .txt { font-size: 130%; } }
main section#topConnectSct .inner .mvBox { margin: 4em auto 7em; width: 70%; aspect-ratio: 16 / 9; }
@media screen and (max-width: 599px) { main section#topConnectSct .inner .mvBox { width: 100%; } }
main section#topConnectSct .inner .mvBox iframe { width: 100%; height: 100%; }
main section#topConnectSct .inner .ttl { text-align: center; font-size: 135%; margin-bottom: 2em; }
@media screen and (max-width: 599px) { main section#topConnectSct .inner .ttl { font-size: 155%; } }
main section#topConnectSct .inner .ttl2 { color: #aa9871; text-align: center; font-size: 135%; margin: 4em auto 2em; }
@media screen and (max-width: 599px) { main section#topConnectSct .inner .ttl2 { font-size: 155%; } }
main section#topConnectSct .inner .ifaLogo2 { width: 32%; margin: 8em auto 2em; }
@media screen and (max-width: 599px) { main section#topConnectSct .inner .ifaLogo2 { width: 70%; } }
main section#topConnectSct .inner .ifaLogo2 img { width: 100%; height: auto; }
main section#topConnectSct .inner .cateL { position: relative; display: flex; flex-wrap: wrap; margin-bottom: 4em; }
main section#topConnectSct .inner .cateL li { width: 31%; margin: 0 3% 1.5em 0; }
@media screen and (max-width: 599px) { main section#topConnectSct .inner .cateL li { width: 48%; margin: 0 4% 1.5em 0; }
  main section#topConnectSct .inner .cateL li:nth-child(2n) { margin-right: 0 !important; } }
main section#topConnectSct .inner .cateL li:nth-child(3n) { margin-right: 0; }
@media screen and (max-width: 599px) { main section#topConnectSct .inner .cateL li:nth-child(3n) { margin-right: 4%; } }
main section#topConnectSct .inner .cateL li a { position: relative; display: block; height: 6em; border: 1px solid #aa9871; border-radius: .5em; background: url("../img/icn_mark.svg") no-repeat 93% center/1.6em; }
main section#topConnectSct .inner .cateL li a span { position: absolute; left: 0; top: 50%; transform: translateY(-50%); display: inline-block; background: #aa9871; font-size: 125%; line-height: 2; padding: .2em 0 .1em 1em; width: 65%; }
main section#topConnectSct .inner .cateL li a span.l2 { line-height: 1; }
main section#topConnectSct .inner .btn { text-align: center; margin-top: 5em; }
main section#topConnectSct .inner .btn a { position: relative; display: inline-block; text-align: center; font-size: 110%; line-height: 1.1; background: #aa9871; padding: .75em 3.5em; border-radius: 2em; box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.1); }
@media screen and (max-width: 599px) { main section#topConnectSct .inner .btn a { font-size: 145%; } }

#footer { position: relative; }
#footer .andB { position: relative; }
#footer .andB .imgBg { display: block; }
#footer .andB .imgBg img { width: 100%; height: auto; }
#footer .andB .head { position: absolute; z-index: 5; top: 1em; right: 2.8%; font-size: 550%; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); letter-spacing: 0; line-height: 1.1; }
@media screen and (max-width: 599px) { #footer .andB .head { font-size: 450%; white-space: nowrap; top: 50%; left: 50%; right: inherit; transform: translateX(-45%) translateY(-54%); } }
#footer .andB .head span { display: block; padding-left: 2.1em; }
#footer .andB .txtB { position: absolute; z-index: 5; top: 20.6em; left: 56%; }
@media screen and (max-width: 599px) { #footer .andB .txtB { top: inherit; bottom: 3em; left: 7%; font-size: 150%; } }
#footer .andB .txtB .txt1 { font-size: 105%; line-height: 1.5; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); margin-bottom: .5em; }
#footer .andB .txtB .txt1 span { display: block; text-align: right; }
@media screen and (max-width: 599px) { #footer .andB .txtB .txt1 span { text-align: left; } }
#footer .andB .txtB .txt2 { font-size: 90%; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); }
#footer .corpB { padding: 4em 0; text-align: center; }
#footer .corpB .logo { width: 15vw; margin: 0 auto 2em; }
@media screen and (max-width: 599px) { #footer .corpB .logo { width: 40%; } }
#footer .corpB .logo a { display: block; }
#footer .corpB .logo a img { width: 100%; height: auto; }
#footer .corpB .add { font-size: 80%; }
@media screen and (max-width: 599px) { #footer .corpB .add { font-size: 125%; } }
#footer .corpB .tel { font-size: 80%; }
@media screen and (max-width: 599px) { #footer .corpB .tel { font-size: 125%; } }
#footer .cpr { background: #fffdf8; padding: 1em 0; text-align: center; color: #000; font-size: 80%; letter-spacing: .02em; }
