@charset "UTF-8";

.global-menu nav { font-family:"Poppins","游ゴシック Medium","Yu Gothic Medium","游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif,serif;}
.global-menu nav * { font-family:"Poppins","游ゴシック Medium","Yu Gothic Medium","游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif,serif;}
.global-menu nav .item-02 .main-01,
.sp-logo-01 { font-weight:100; font-family:"Poppins","游ゴシック Medium","Yu Gothic Medium","游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif,serif;}
.global-menu nav .item-02 .main-01 *,
.sp-logo-01 * { font-weight:100; font-family:"Poppins","游ゴシック Medium","Yu Gothic Medium","游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif,serif;}
.global-menu nav .item-02 .main-01>strong:nth-of-type(2) { font-weight:300; font-family:"Poppins","游ゴシック Medium","Yu Gothic Medium","游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif,serif;}
.global-menu nav .item-02 .main-01>strong:nth-of-type(2) * { font-weight:300; font-family:"Poppins","游ゴシック Medium","Yu Gothic Medium","游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif,serif;}
.global-menu .item-01 .sns { font-weight:400; font-family:"Poppins","游ゴシック Medium","Yu Gothic Medium","游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif,serif;}
.global-menu .item-01 .sns * { font-weight:400; font-family:"Poppins","游ゴシック Medium","Yu Gothic Medium","游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif,serif;}
body { overflow:scroll; -ms-overflow-style:none; scrollbar-width:none;}
body::-webkit-scrollbar { display:none;}
.display-w900 { display:none;}
.modaal-wrapper { overflow:scroll; -ms-overflow-style:none; scrollbar-width:none;}
.modaal-wrapper::-webkit-scrollbar { display:none;}
.modaal-container { background:rgba(255,255,255,0); box-shadow:none;}
.modaal-close { width:60px; height:60px;}
.modaal-close::before,
.modaal-close::after { background:#b3b3b3; width:1.4px; top:10px; left:29px; height:40px;}
.modaal-gallery-control { width:60px; height:60px;}
.modaal-gallery-control::before,
.modaal-gallery-control::after { width:1.4px; height:24px; background:#b3b3b3; transition:background 400ms;}
.modaal-gallery-prev::before,
.modaal-gallery-prev::after { left:28px;}
.modaal-gallery-prev::before { margin-top:10px;}
.modaal-gallery-prev::after { margin-top:-6px;}
.modaal-gallery-next::before,
.modaal-gallery-next::after { top:21px; left:32px;}
.modaal-gallery-next::before { margin-top:-11px;}
.scroll-bar { height:3.3333em; width:1px; position:relative; overflow:hidden;}
.scroll-bar span { display:block; background:#000; width:100%; height:100%; animation-name:scroll_bar; animation-duration:2500ms; animation-iteration-count:infinite; animation-timing-function:cubic-bezier(0.05, 0.9, 0.05); animation-fill-mode:none; animation-delay:0; animation-direction:normal;}
.drawer-menu-area { user-select:none; overflow:hidden; position:fixed; right:0; top:0; z-index:3; width:0; height:0;}
.drawer-menu-button { cursor:pointer; width:32px; height:32px; top:44px; right:37px; position:absolute;}
.drawer-menu-button>p { transition:transform 600ms; position:absolute; left:0; top:0; width:100%; height:100%;}
.drawer-menu-button span { display:block; background-color:#000; height:1.4px; width:100%; position:absolute; left:0; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%);}
.drawer-menu-button span:nth-of-type(1) { top:15%; transition:top 400ms,transform 500ms,background-color 400ms;}
.drawer-menu-button span:nth-of-type(2) { top:50%; transition:left 400ms,width 400ms,opacity 400ms,background-color 400ms;}
.drawer-menu-button span:nth-of-type(3) { top:85%; transition:top 400ms,transform 500ms,background-color 400ms;}
.drawer-menu-button.active>p { -webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); -ms-transform:rotate(360deg); -o-transform:rotate(360deg); transform:rotate(360deg);}
.drawer-menu-button.active span:nth-of-type(1) { transform:rotate(45deg); top:50%;}
.drawer-menu-button.active span:nth-of-type(2) { width:0; opacity:0; left:50%;}
.drawer-menu-button.active span:nth-of-type(3) { transform:rotate(-45deg); top:50%;}
.global-menu-bg { position:fixed; overflow:hidden; opacity:0; background-color:rgba(255,255,255,
.8); left:0; top:0; z-index:3;}
.global-menu-bg.active { opacity:1;}
.global-menu-bg.set { width:100%; height:100%; transition:opacity 400ms;}
.global-menu { height:100%; left:0; top:0; position:absolute; width:300px; overflow:scroll; -ms-overflow-style:none; scrollbar-width:none; user-select:none;}
.global-menu::-webkit-scrollbar { display:none;}
.global-menu .global-menu-items { width:100%; height:100%; position:relative;}
.global-menu .items-wrap { position:absolute; left:0; top:0; width:100%; height:100%;}
.global-menu .item-01 { width:calc(100% / 3); height:100%; position:absolute; left:0; top:0; padding-top:40px;}
.global-menu .item-01 .logo-01 { width:36%; overflow:hidden; margin-left:42%;}
.global-menu .item-01 .logo-01 a { display:block; width:100%; float:left; transition:opacity 400ms;}
.global-menu .item-01 .logo-01 img { width:100%; float:left;}
.global-menu .item-01 .sns { font-size:100px; position:absolute; bottom:50.7%; left:0; width:100%; transform:translateY(291px);}
.global-menu .item-01 .instagram,
.global-menu .item-01 .facebook { font-size:10px; height:10em; position:relative;}
.global-menu .item-01 .instagram>*,
.global-menu .item-01 .facebook>* { display:flex; justify-content:center; width:100%; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);}
.global-menu .item-01 .instagram .logo,
.global-menu .item-01 .facebook .logo { top:.1em; position:relative; width:1.6em; overflow:hidden; margin-right:1.4em;}
.global-menu .item-01 .instagram img,
.global-menu .item-01 .facebook img { width:100%; float:left; transform-origin:center; transform:rotate(90deg);}
.global-menu .item-01 .instagram a,
.global-menu .item-01 .facebook a { display:flex; width:fit-content; float:left; transform-origin:center; transform:rotate(-90deg);}
.global-menu .item-01 .instagram a strong,
.global-menu .item-01 .facebook a strong { letter-spacing:.05em; text-decoration:underline; text-decoration-color:#000; text-decoration-thickness:.8px; text-underline-offset:.2em; margin-bottom:.1em; display:block;}
.global-menu .item-01 .facebook { margin-top:3.7em;}
.global-menu nav { padding-top:50px; font-size:13px; line-height:1.4; position:absolute; right:0; top:0; width:60%; letter-spacing:.05em;}
.global-menu nav * { line-height:1.3;}
.global-menu nav.style-01 { height:100%; display:flex; flex-direction:column; padding-bottom:125px;}
.global-menu nav.style-01 .menu-01 { order:1;}
.global-menu nav.style-01 .scroll-bar { order:2;}
.global-menu nav.style-01>ul { order:3; padding-bottom:2em;}
.global-menu nav.style-01 .item-02 { order:4; margin-top:auto;}
.global-menu nav .menu-01 p { font-weight:600;}
.global-menu nav .menu-01 p * { font-weight:600;}
.global-menu nav .menu-01 p+p { margin-top:.65em;}
.global-menu nav .menu-01 p:not(.active) a::before { right:0; left:auto; transition:width 600ms; width:0; animation-timing-function:cubic-bezier(0.19, 1, 0.22, 1);}
.global-menu nav>.gallery-menu { font-weight:400;}
.global-menu nav>.gallery-menu * { font-weight:400;}
.global-menu nav>.gallery-menu li span { position:relative; cursor:pointer; display:inline-block; padding-bottom:.5em;}
.global-menu nav>.gallery-menu li span::before { content:""; display:block; background-color:#333; width:100%; transform:scaleY(0.5); height:1px; left:0; bottom:.5em; position:absolute;}
.global-menu nav>.gallery-menu li+li { margin-top:.65em;}
.global-menu nav>.gallery-menu li:not(.active) span::before { right:0; left:auto; transition:width 600ms; width:0; animation-timing-function:cubic-bezier(0.19, 1, 0.22, 1);}
.global-menu nav a { position:relative; padding-bottom:.5em; display:inline-block;}
.global-menu nav a::before { content:""; display:block; background-color:#333; transform:scaleY(0.5); width:100%; height:1px; left:0; bottom:.5em; position:absolute;}
.global-menu nav .item-02 .main-01 { font-size:26px;}
.global-menu nav .item-02 .main-01>strong { display:block;}
.global-menu nav .item-02 .main-01>strong:nth-of-type(1) { line-height:1em; margin-bottom:.3em;}
.global-menu nav .item-02 .main-01>strong:nth-of-type(2) { font-size:13px; line-height:1.4; letter-spacing:.03em;}
.global-menu .copyright { padding-bottom:10%; position:absolute; right:0; bottom:0; width:86.6667%;}
.copyright { font-size:10px; line-height:1.4; letter-spacing:.05em;}
.sp-logo-01 { font-size:20px; display:none; position:absolute; left:35px; top:37px;}
.sp-logo-01 a { display:flex; width:fit-content;}
.sp-logo-01 figure { width:1.9em; overflow:hidden; margin-right:0.9em;}
.sp-logo-01 figure img { width:100%; float:left;}
.sp-logo-01 .item-01 { display:flex; flex-direction:column; justify-content:center; padding-top:.1em;}
.sp-logo-01 .item-01>strong { display:block;}
.sp-logo-01 .item-01>strong:nth-of-type(1) { line-height:1.1;}
.sp-logo-01 .item-01>strong:nth-of-type(2) { font-weight:300; font-size:11px; line-height:1.3;}
.sample { width:50px; height:400px; background:rgba(204,0,0,0); transition:background 1000ms;}
.sample.a { background:#c00;}
.sample+.sample { margin-top:10px;}
.test-01 { width:calc(100vw - var(--scroll-bar-w)); height:20px; background:#ccc;}
.modal-wrapper { width:100%; height:0; opacity:0; transition:opacity 400ms; position:fixed; overflow:hidden; left:0; top:0; z-index:1;}
.modal-wrapper.set { height:100vh;}
.modal-wrapper.open { opacity:1;}
.modal-wrapper .modal-area { position:absolute; left:0; top:0; width:100%; height:100vh; background:#fff;}
.modal-wrapper .close { cursor:pointer; width:50px; height:50px; background:#ccc; position:absolute; right:20px; top:20px;}

@keyframes fade_in {
from { opacity:0;}
to { opacity:1;}
}

@keyframes fade_in_up {
from { opacity:0; transform:translate3d(0, 40%, 0);}
to { opacity:1; transform:none;}
}

@keyframes scroll_bar {
from { transform:translateY(-100%);}
49% { transform:translateY(0%);}
51% { transform:translateY(0%);}
to { transform:translateY(100%);}
}
.info-area { width:215px; font-size:11px; position:fixed; right:10px; bottom:10px; background-color:#ccc; text-align:left; padding-top:.7em; padding-bottom:.7em; z-index:10000; line-height:1.4em; display:none;}
.info-area * { font-size:1em; line-height:1.4em;}
.info-area p { width:calc(100% - 20px); font-weight:500; margin-right:auto; margin-left:auto;}

@media (max-width:1140px) {
.modaal-gallery-control { background:rgba(255,255,255,0); transform:translateY(150%);}
.modaal-gallery-prev { left:0;}
.modaal-gallery-next { right:0;}
.modaal-gallery-next-inner { margin-left:0;}
.modaal-gallery-prev-inner { margin-right:0;}
.modaal-inner-wrapper { padding-top:75px; padding-bottom:75px;}
}

@media (max-width:1100px) {
.global-menu { width:27.2727%;}
.global-menu .item-01 .sns { transform:translateY(26.4545vw);}
}

@media (max-width:1000px) {
.global-menu .item-01 .sns { transform:translateY(26.6vw);}
}

@media (max-width:950px) {
.global-menu .item-01 .sns { transform:translateY(26.7368vw);}
}

@media (max-width:900px) {
.hide-w900 { display:none;}
.display-w900 { display:block;}
.drawer-menu-area { overflow:visible;}
.global-menu { width:0; position:fixed; right:0; left:auto; z-index:3; height:100vh;}
.global-menu.set { transition:width 400ms;}
.global-menu.open { width:160px; overflow:hidden;}
body.sp .global-menu { height:100dvh;}
.global-menu .global-menu-items { background-color:#ededed; width:160px; overflow:scroll; -ms-overflow-style:none; scrollbar-width:none;}
.global-menu .global-menu-items::-webkit-scrollbar { display:none;}
.global-menu .items-wrap { padding-top:200px; min-height:700px; position:relative; left:auto; top:auto; display:flex; flex-direction:column;}
.global-menu .item-01 { height:auto; width:100%; padding-top:0; bottom:100px; top:auto;}
.global-menu .item-01 .logo-01 { display:none;}
.global-menu .item-01 .sns { position:relative; bottom:auto; left:auto; transform:translateY(0);}
.global-menu .item-01 .instagram,
.global-menu .item-01 .facebook { font-size:11px; height:auto;}
.global-menu .item-01 .instagram>*,
.global-menu .item-01 .facebook>* { overflow:hidden; display:block; position:relative; left:auto; top:auto; transform:translate(0, 0); width:calc(100% - 28px); margin-left:auto;}
.global-menu .item-01 .instagram .logo,
.global-menu .item-01 .facebook .logo { margin-right:1em;}
.global-menu .item-01 .instagram img,
.global-menu .item-01 .facebook img { transform:rotate(0);}
.global-menu .item-01 .instagram a,
.global-menu .item-01 .facebook a { transform:rotate(0);}
.global-menu .item-01 .facebook { margin-top:1.8182em;}
.global-menu nav { width:100%; padding-top:0; position:relative; right:auto; top:auto;}
.global-menu nav.style-01 { padding-bottom:0; height:auto;}
.global-menu nav.style-01>ul { padding-bottom:0;}
.global-menu nav .menu-01 p { width:calc(100% - 28px); margin-left:auto;}
.global-menu nav .menu-01 p+p { margin-top:1.1em;}
.global-menu nav>.gallery-menu { padding-top:65px; width:100%;}
.global-menu nav>.gallery-menu li { width:calc(100% - 28px); margin-left:auto;}
.global-menu nav>.gallery-menu li+li { margin-top:.9em;}
.global-menu nav .item-02 { display:none;}
.global-menu .copyright { display:none;}
.sp-logo-01 { display:block;}
}

@media (max-width:900px) and (max-height:926px) {
.global-menu .items-wrap { padding-top:21.5983vh;}
.global-menu nav>.gallery-menu { padding-top:7.0194vh;}
}

@media (max-width:900px) and (max-height:700px) {
.global-menu .items-wrap { padding-top:151.1879px;}
.global-menu nav>.gallery-menu { padding-top:49.1361px;}
}

@media (max-width:580px) {
.hide-w580 { display:none;}
}

@media (max-width:550px) {
.hide-w550 { display:none;}
}

@media (max-width:520px) {
.hide-w520 { display:none;}
}

@media (max-width:510px) {
.hide-w510 { display:none;}
}

@media (max-width:490px) {
.hide-w490 { display:none;}
}

@media (max-width:450px) {
.hide-w450 { display:none;}
}

@media (max-width:430px) {
.drawer-menu-button { top:10.2326vw; right:8.6047vw;}
.sp-logo-01 { left:8.1395vw; top:8.6047vw;}
}

@media (hover:hover) and (pointer:fine) {
.modaal-close:hover::before,
.modaal-close:hover::after { background:#8c8c8c;}
.modaal-gallery-control:hover::before,
.modaal-gallery-control:hover::after { background:#8c8c8c;}
.drawer-menu-button:hover span { background:gray;}
.global-menu .item-01 .logo-01.a a:hover { opacity:.7;}
.global-menu nav .menu-01 p:not(.active) a:hover::before { width:100%; right:auto; left:0;}
.global-menu nav>.gallery-menu li:not(.active) span:hover::before { width:100%; right:auto; left:0;}
.sp-logo-01 a { transition:opacity 400ms;}
.sp-logo-01 a:hover { opacity:.5;}
}

@media (max-height:1000px) {
.modaal-inner-wrapper { padding-top:75px; padding-bottom:75px;}
}