@charset "UTF-8";
:root{--blue:#0755a4;--deep:#032c5a;--navy:#031f40;--sky:#e9f3fc;--red:#e3342f;--ink:#14263a;--cream:#fffaf0;--beige:#f2eadb;--white:#fff;--gray:#f4f6f8;--pad:clamp(22px,5vw,84px)}
*,*::before,*::after{box-sizing:border-box}
html{width:100%;max-width:100%;scroll-behavior:smooth;overflow-x:hidden}
body{width:100%;max-width:100%;margin:0;color:var(--ink);background:#fff;font-family:"Helvetica Neue","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.8;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%}
button{font:inherit}
.hero{min-height:680px;height:calc(100svh - 88px);max-height:850px;position:relative;display:grid;grid-template-columns:1fr .9fr;align-items:center;gap:clamp(30px,6vw,100px);padding:70px var(--pad);overflow:hidden;background:linear-gradient(120deg,#f8fbff 0%,#f8fbff 57%,var(--cream) 57%,var(--cream) 100%)}
.hero::before{content:"";width:1px;height:100%;position:absolute;left:57%;top:0;background:rgba(7,85,164,.1)}
.hero-decoration{position:absolute;border:1px solid rgba(7,85,164,.1);border-radius:50%}
.hero-decoration--one{width:460px;height:460px;right:-170px;top:-180px}
.hero-decoration--two{width:260px;height:260px;left:-130px;bottom:-130px}
.hero-copy{position:relative;z-index:2}
.hero-en{margin:0 0 15px;color:var(--blue);font:900 clamp(20px,2.6vw,38px)/1 Arial,sans-serif;letter-spacing:.06em}
.hero h1{margin:0;font-size:clamp(44px,6vw,88px);line-height:1.2;letter-spacing:.04em}
.hero h1 em{color:var(--red);font-style:normal}
.hero-lead{margin:28px 0 0;color:#526478;font-size:clamp(15px,1.25vw,18px);font-weight:700;letter-spacing:.04em}
.hero-link{min-height:58px;margin-top:34px;padding:12px 20px;display:inline-flex;align-items:center;gap:35px;color:#fff;background:var(--blue);font-size:14px;font-weight:800;transition:transform .25s ease,background .25s ease}
.hero-link:hover{transform:translateY(-3px);background:var(--deep)}
.hero-photo{width:min(100%,560px);position:relative;z-index:2;justify-self:center}
.hero-photo-frame{aspect-ratio:4/5;padding:13px;position:relative;overflow:hidden;border-radius:48% 48% 18px 18px;background:#fff;box-shadow:0 30px 70px rgba(3,44,90,.18)}
.hero-photo-frame::before{content:"";position:absolute;inset:14px;z-index:1;border:1px solid rgba(255,255,255,.65);border-radius:48% 48% 10px 10px;pointer-events:none}
.hero-photo-frame img{width:100%;height:100%;display:block;border-radius:48% 48% 10px 10px;object-fit:cover;background:var(--beige)}
.hero-photo p{margin:17px 0 0;text-align:right;font-weight:800}
.hero-photo p span{margin-right:14px;color:var(--red);font:800 11px Arial,sans-serif;letter-spacing:.14em}
.scroll{position:absolute;left:var(--pad);bottom:25px;display:flex;align-items:center;gap:15px;color:#738294;font:700 10px Arial,sans-serif;letter-spacing:.18em}
.scroll i{width:80px;height:1px;position:relative;overflow:hidden;background:#c8d3dd}
.scroll i::after{content:"";width:100%;height:100%;position:absolute;left:-100%;top:0;background:var(--blue);animation:scroll-line 2s infinite}
@keyframes scroll-line{to{left:100%}}
.section{padding:clamp(80px,10vw,150px) var(--pad)}
.section-heading{margin-bottom:clamp(55px,7vw,90px);position:relative}
.section-heading-large{margin:0;color:#dce9f5;font:900 clamp(58px,9vw,140px)/.76 Arial,sans-serif;letter-spacing:-.06em}
.section-heading>div{position:absolute;right:0;bottom:0;text-align:right}
.section-heading span,.group-heading span{color:var(--red);font:800 14px Arial,sans-serif;letter-spacing:.18em}
.section-heading h2{margin:10px 0 0;font-size:clamp(30px,4.4vw,61px);line-height:1.28}
.introduction-grid{display:grid;grid-template-columns:.85fr 1fr;gap:clamp(45px,8vw,130px)}
.introduction-lead{margin:0;color:var(--deep);font-size:clamp(25px,3vw,43px);font-weight:800;line-height:1.55}
.introduction-text{color:#637180;font-size:17px}
.introduction-text p{margin:0 0 20px}
.members{background:var(--gray)}
.group-heading{margin-bottom:48px;padding-bottom:18px;display:flex;align-items:end;justify-content:space-between;border-bottom:1px solid #c8d3dd}
.group-heading h2{margin:6px 0 0;font-size:clamp(33px,4vw,56px);line-height:1.2}
.group-heading>p{margin:0;color:#7790a6;font:800 13px Arial,sans-serif;letter-spacing:.12em}
.member-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.member-card{min-width:0;overflow:hidden;background:#fff;box-shadow:0 12px 35px rgba(3,31,64,.07);transition:transform .35s ease,box-shadow .35s ease}
.member-card:hover{transform:translateY(-7px);box-shadow:0 22px 48px rgba(3,31,64,.13)}
.member-photo{aspect-ratio:4/4;position:relative;overflow:hidden;background:var(--beige)}
.member-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 65%,rgba(3,31,64,.3))}
.member-photo img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .55s ease}
.member-card:hover .member-photo img{transform:scale(1.04)}
.member-photo>span{position:absolute;right:18px;bottom:12px;z-index:2;color:#fff;font:900 34px Arial,sans-serif}
.member-body{padding:28px 30px 34px}
.member-role{margin:0 0 4px;color:var(--red);font-size:16px;font-weight:800;letter-spacing:.12em}
.member-body h3{margin:0 0 22px;color:var(--deep);font-size:clamp(29px,2.6vw,42px);line-height:1.25}
.member-body h3 small{margin-left:9px;color:#778899;font-size:14px;font-weight:700}
.member-body dl{margin:0}
.member-body dl div{padding:10px 0;display:grid;grid-template-columns:82px 1fr;gap:12px;border-top:1px solid #e2e7ec}
.member-body dt{color:#7b8998;font-size:16px;font-weight:700}
.member-body dd{margin:0;font-size:16px;font-weight:700}
.member-body dd small{font-weight:500}
.message{position:relative;color:#fff;background:linear-gradient(120deg,rgba(3,31,64,.96),rgba(7,85,164,.88)),url("images/dog_01.jpg") center/cover no-repeat;text-align:center}
.message::before{content:"";position:absolute;inset:24px;border:1px solid rgba(255,255,255,.2);pointer-events:none}
.message-inner{position:relative;z-index:1}
.message p{margin:0;color:#82c5ff;font:800 13px Arial,sans-serif;letter-spacing:.2em}
.message h2{margin:16px 0 32px;font-size:clamp(30px,4.4vw,62px);line-height:1.5}
.message a{padding:14px 20px;display:inline-flex;align-items:center;gap:30px;border:1px solid rgba(255,255,255,.45);font-weight:800}
.footer{padding:clamp(80px,10vw,150px) var(--pad) 32px;color:#fff;background:var(--navy);border-top:1px solid #fff}
.footer-main{display:grid;grid-template-columns:1fr minmax(320px,.55fr);gap:clamp(60px,8vw,130px)}
.footer-brand p,.footer-contact>p:first-child{margin:0;font:800 16px Arial,sans-serif;letter-spacing:.18em}
.footer-brand p{color:rgba(255,255,255,.45)}
.footer-brand h2{margin:14px 0 0;font-size:clamp(34px,4vw,60px);line-height:1.3}
.footer-contact>p:first-child{color:var(--red)}
.footer-contact>p:nth-child(2){margin:18px 0 26px}
.footer-contact>a{padding:20px 0;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.25);border-bottom:1px solid rgba(255,255,255,.25);font-weight:800}
.footer-contact>a b{width:56px;height:56px;display:grid;place-items:center;border-radius:50%;background:var(--red)}
.footer-shops{margin-top:clamp(70px,9vw,130px);display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:rgba(255,255,255,.2)}
.footer-shop{padding:clamp(32px,4vw,55px);display:grid;grid-template-columns:minmax(100px,.6fr) 1.3fr auto;align-items:center;gap:25px;background:#063465}
.footer-shop h3{margin:0;font-size:30px}
.footer-shop p{margin:0;font-size:14px}
.footer-shop a{font:800 15px Arial,sans-serif;white-space:nowrap}
.footer-bottom{margin-top:55px;display:flex;align-items:center;justify-content:space-between}
.footer-bottom small{color:rgba(255,255,255,.5);font:700 10px Arial,sans-serif;letter-spacing:.15em}
.footer-bottom a{display:flex;align-items:center;gap:15px;font:700 10px Arial,sans-serif;letter-spacing:.18em}
.footer-bottom b{width:48px;height:48px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.35);border-radius:50%}
.js-reveal{opacity:0;transform:translateY(28px);transition:opacity .75s ease,transform .75s ease}
.js-reveal.is-visible{opacity:1;transform:none}
.image-placeholder{display:grid!important;place-items:center;color:transparent;background:linear-gradient(145deg,#f7efe0,#dce9f5)!important}
.image-placeholder::before{content:"PHOTO";color:rgba(7,85,164,.3);font:900 24px Arial,sans-serif;letter-spacing:.18em}
@media(max-width:1050px){.member-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-shop{grid-template-columns:1fr;gap:10px}}
@media(max-width:800px){.hero{height:auto;min-height:0;padding-top:70px;padding-bottom:100px;grid-template-columns:1fr;background:linear-gradient(160deg,#f8fbff 0%,#f8fbff 50%,var(--cream) 50%)}.hero::before{display:none}.hero-photo{width:min(90%,520px)}.scroll{display:none}.introduction-grid{grid-template-columns:1fr}.footer-main{grid-template-columns:1fr}.footer-shops{grid-template-columns:1fr}}
@media(max-width:640px){.hero{padding-top:55px}.hero h1{font-size:42px}.hero-lead br{display:none}.hero-photo-frame{border-radius:45% 45% 12px 12px}.section-heading{padding-top:20px}.section-heading>div{position:relative;margin-top:25px;text-align:left}.section-heading h2{font-size:29px}.group-heading{align-items:flex-start}.group-heading>p{display:none}.member-grid{grid-template-columns:1fr}.member-body{padding:25px 24px 30px}.message::before{inset:12px}.footer-brand h2{font-size:32px}.footer-shops{margin-right:calc(var(--pad)*-1);margin-left:calc(var(--pad)*-1)}.footer-shop{padding:34px var(--pad)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.scroll i::after{animation:none}.js-reveal{opacity:1;transform:none;transition:none}.member-card,.member-photo img{transition:none}}
.hero-dogs{width:min(100%,620px);position:relative;z-index:2;justify-self:center}
.dog-collage{width:100%;aspect-ratio:1/1;position:relative;isolation:isolate}
.dog-collage::before{content:"";width:78%;height:78%;position:absolute;left:11%;top:11%;z-index:-2;border-radius:50%;background:linear-gradient(145deg,#fff,#f2eadb);box-shadow:0 30px 70px rgba(3,44,90,.13)}
.dog-collage::after{content:"OUR TEAM";position:absolute;left:50%;top:50%;z-index:-1;color:rgba(7,85,164,.07);font:900 clamp(52px,7vw,92px)/1 Arial,sans-serif;letter-spacing:-.06em;white-space:nowrap;transform:translate(-50%,-50%) rotate(-12deg)}
.dog-photo{width:29%;height:34%;margin:0;padding:7px;position:absolute;overflow:hidden;border:1px solid rgba(7,85,164,.08);border-radius:46% 46% 18px 18px;background:#fff;box-shadow:0 16px 35px rgba(3,44,90,.2);transition:transform .35s ease,box-shadow .35s ease}
.dog-photo:hover{z-index:20;box-shadow:0 24px 48px rgba(3,44,90,.27)}
.dog-photo img{width:100%;height:100%;display:block;border-radius:44% 44% 12px 12px;object-fit:cover;background:#f2eadb}
.dog-photo figcaption{min-width:56px;padding:4px 10px;position:absolute;left:50%;bottom:8px;color:#fff;border-radius:20px;background:rgba(3,31,64,.8);font-size:11px;font-weight:800;text-align:center;white-space:nowrap;transform:translateX(-50%)}
.dog-photo--01{left:35.5%;top:1%;z-index:3;transform:rotate(-2deg)}
.dog-photo--02{right:3%;top:24%;z-index:4;transform:rotate(6deg)}
.dog-photo--03{right:15%;bottom:2%;z-index:5;transform:rotate(-5deg)}
.dog-photo--04{left:15%;bottom:2%;z-index:5;transform:rotate(5deg)}
.dog-photo--05{left:3%;top:24%;z-index:4;transform:rotate(-6deg)}
.dog-photo--06{width:31%;height:37%;left:34.5%;top:34%;z-index:10;transform:rotate(1deg)}
.dog-photo--01:hover{transform:rotate(0) translateY(-7px) scale(1.04)}
.dog-photo--02:hover{transform:rotate(2deg) translateY(-7px) scale(1.04)}
.dog-photo--03:hover{transform:rotate(-2deg) translateY(-7px) scale(1.04)}
.dog-photo--04:hover{transform:rotate(2deg) translateY(-7px) scale(1.04)}
.dog-photo--05:hover{transform:rotate(-2deg) translateY(-7px) scale(1.04)}
.dog-photo--06:hover{transform:rotate(0) translateY(-7px) scale(1.04)}
.hero-dogs-caption{margin:12px 0 0;text-align:center;font-weight:800}
.hero-dogs-caption span{margin-right:14px;color:#e3342f;font:800 11px Arial,sans-serif;letter-spacing:.14em}
@media(max-width:640px){.hero-dogs{width:110%;margin-left:-5%}.dog-collage{aspect-ratio:1/1.04}.dog-photo{padding:5px}.dog-photo figcaption{min-width:45px;padding:2px 7px;bottom:5px;font-size:9px}.hero-dogs-caption{margin-top:5px;font-size:14px}.hero-dogs-caption span{display:block;margin:0 0 2px}}
@media(prefers-reduced-motion:reduce){.dog-photo{transition:none}}