@charset "utf-8";



/*reset*/
/*******************************************************************/
html{box-sizing:border-box;overflow-y:scroll;-webkit-text-size-adjust:100%}
*,:after,:before{background-repeat:no-repeat;box-sizing:inherit}
:after,:before{text-decoration:inherit;vertical-align:inherit}
*{padding:0;margin:0}
audio:not([controls]){display:none;height:0}
hr{overflow:visible}
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}
summary{display:list-item}
small{font-size:80%}
[hidden],template{display:none}
abbr[title]{border-bottom:1px dotted;text-decoration:none}
a{background-color:transparent;-webkit-text-decoration-skip:objects}
a:active,a:hover{outline-width:0}
code,kbd,pre,samp{font-family:monospace,monospace}
b,strong{font-weight:bolder}
dfn{font-style:italic}
mark{background-color:#ff0;color:#000}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-.25em}
sup{top:-.5em}
input{border-radius:0}
[role=button],[type=button],[type=reset],[type=submit],button{cursor:pointer}
[disabled]{cursor:default}
[type=number]{width:auto}
[type=search]{-webkit-appearance:textfield}
[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}
textarea{overflow:auto;resize:vertical}
button,input,optgroup,select,textarea{font:inherit}
optgroup{font-weight:700}
button{overflow:visible}
[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:0;padding:0}
[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button:-moz-focusring{outline:1px dotted ButtonText}
[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}
button,select{text-transform:none}
button,input,select,textarea{background-color:transparent;border-style:none;color:inherit}
select{-moz-appearance:none;-webkit-appearance:none}
select::-ms-expand{display:none}
select::-ms-value{color:currentColor}
legend{border:0;color:inherit;display:table;max-width:100%;white-space:normal}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
img{width:auto;max-width:100%;height:auto;border-style:none;vertical-align:middle}
i{vertical-align:middle}
progress{vertical-align:baseline}
svg:not(:root){overflow:hidden}
audio,canvas,progress,video{display:inline-block}
@media screen{[hidden~=screen]{display:inherit}
[hidden~=screen]:not(:active):not(:focus):not(:target){position:absolute!important;clip:rect(0 0 0 0)!important}}
[aria-busy=true]{cursor:progress}
[aria-controls]{cursor:pointer}
[aria-disabled]{cursor:default}
::-moz-selection{background-color:#b3d4fc;color:#000;text-shadow:none}
::selection{background-color:#b3d4fc;color:#000;text-shadow:none}
ul,ol{list-style:none}
i{font-style:normal}
a { color: #222; transition: all .2s ease-out; text-decoration: none;}
a:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); opacity: 0.6;}
:focus-visible { outline: 2px solid #42365C; outline-offset: 4px;}


/*LAYOUT*/
/*******************************************************************/
html { font-size: 62.5%;}
body { -webkit-text-size-adjust: 100%; -webkit-overflow-scrolling: touch; height: 100%; font-family: 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; font-size: 1.6rem; color: #222;}
#container { width: 100%;}
#loading { z-index: 100000; position: fixed; top: 0; left: 0; right: 0; bottom: 0; margin: auto; background: #000 url("../img/loading.svg") center center no-repeat;}
.serif { font-family: 'Noto Serif JP', serif; font-weight: 600;}
i, #nav { font-family: 'Marcellus', serif; font-weight: 400;}


/*HEADER*/
/*******************************************************************/
#header { display: flex; justify-content: space-between; align-items: flex-end; width: 100%; height: 100vh; z-index: 200; opacity: 0; transition: opacity 2s linear; transition-delay: 2s;}
body.start #header { opacity: 1;}
#logo { padding: 48px;}
#nav li a { color: #FFF;}
#nav li:last-child a { display: block; padding: 8px 16px 8px 40px; border: 1px solid #FFF; background: url("../img/mail.svg") 16px center no-repeat;}
@media only screen and (min-width: 1281px){
#nav { padding: 48px;}
#nav ul { display: flex; align-items: center;}
#nav li { margin-left: 1.6vw;}
#nav li a { font-size: 1.4rem;}
#open { display: none;}
}


/*FOOTER*/
/*******************************************************************/
#footer { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; height: 50vh; padding: 80px 30px; text-align: center;}
#footer address { display: block; margin-top: 24px; font-size: 1.1rem; font-style: normal; color: #FFF;}


/*CONTENTS*/
/*******************************************************************/
article { position: relative; padding: 120px 4.8vw;}
article header { max-width: 1200px; margin: 0 auto 64px; text-align: center;}
article header h2 { display: flex; align-items: center;}
article header h2 i { display: inline-block; padding: 0 24px; font-size: 7.2rem; white-space: nowrap;}
article header h2::before, article header h2::after { content: ''; display: inline-block; width: 100%; height: 3px; background: #000;}
article header p { margin-top: 64px; font-size: 2.4rem;}
section { position: relative; width: 100%; max-width: 1200px; margin: 0 auto;}
section + section { margin-top: 120px;}
article p { line-height: 2;}
article p:not(:last-child) { margin-bottom: 24px;}
figure { position: relative;}
figure:not(.nofit) img { width: 100%; max-width: initial;}
figure.nofit { text-align: center;}
.center { text-align: center;}
.right { text-align: right;}
.row { display: flex; flex-wrap: wrap; margin: -32px;}
.row > * { width: calc(50% - 64px); margin: 32px;}
.row > * a { display: block;}
.reverse { flex-direction: row-reverse;}
.btn { text-align: center;}
.btn a { position: relative; display: inline-block; padding: 16px 40px; background: rgb(108,203,150); background: linear-gradient(0deg, rgba(108,203,150,1) 0%, rgba(60,179,113,1) 100%); border-radius: 40px; font-size: 1.8rem; font-weight: 500; color: #FFF; box-shadow: 10px 10px 20px rgba(0,0,0,.08);}
.sp { display: none;}
.fadeInUp{ -webkit-animation-name: fadeInUp; animation-name: fadeInUp;}
@-webkit-keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0);} to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);} }
@keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0);} to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);} }
.animated { opacity: 0; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}
.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}
.animated.delay1{-webkit-animation-delay:0.2s;animation-delay:0.2s}
.animated.delay2{-webkit-animation-delay:0.4s;animation-delay:0.4s}
.animated.delay3{-webkit-animation-delay:0.6s;animation-delay:0.6s}
.animated.delay4{-webkit-animation-delay:0.8s;animation-delay:0.8s}
.animated.delay5{-webkit-animation-delay:1s;animation-delay:1s}
.animated.fast{-webkit-animation-duration:.8s;animation-duration:.8s}
.animated.faster{-webkit-animation-duration:.5s;animation-duration:.5s}
.animated.slow{-webkit-animation-duration:2s;animation-duration:2s}
.animated.slower{-webkit-animation-duration:3s;animation-duration:3s}

.char-fade .char-parts { display: inline-block; min-width: .25em; opacity: 0; -webkit-transform: translate3d(-1em, 0, 0) scale(0.8); transform: translate3d(-1em, 0, 0) scale(0.8); -webkit-transform-origin: left; transform-origin: left; -webkit-transition: opacity 2s linear, -webkit-transform 2s cubic-bezier(0, .6, .2, 1); transition: opacity 2s linear, transform 2s cubic-bezier(0, .6, .2, 1);}
.char-fade.inview .char-parts { opacity: 1; -webkit-transform: translateZ(0) scale(1); transform: translateZ(0) scale(1);}
.char-fade .char-parts:nth-of-type(1) { transition-delay: 0ms;}
.char-fade .char-parts:nth-of-type(2) { transition-delay: 45ms;}
.char-fade .char-parts:nth-of-type(3) { transition-delay: 90ms;}
.char-fade .char-parts:nth-of-type(4) { transition-delay: 135ms;}
.char-fade .char-parts:nth-of-type(5) { transition-delay: 180ms;}
.char-fade .char-parts:nth-of-type(6) { transition-delay: 225ms;}
.char-fade .char-parts:nth-of-type(7) { transition-delay: 270ms;}
.char-fade .char-parts:nth-of-type(8) { transition-delay: 315ms;}
.char-fade .char-parts:nth-of-type(9) { transition-delay: 360ms;}
.char-fade .char-parts:nth-of-type(10) { transition-delay: 405ms;}
.char-fade .char-parts:nth-of-type(11) { transition-delay: 450ms;}
.char-fade .char-parts:nth-of-type(12) { transition-delay: 495ms;}
.char-fade .char-parts:nth-of-type(13) { transition-delay: 540ms;}
.char-fade .char-parts:nth-of-type(14) { transition-delay: 585ms;}
.char-fade .char-parts:nth-of-type(15) { transition-delay: 630ms;}
.char-fade .char-parts:nth-of-type(16) { transition-delay: 675ms;}
.char-fade .char-parts:nth-of-type(17) { transition-delay: 720ms;}
.char-fade .char-parts:nth-of-type(18) { transition-delay: 765ms;}
.char-fade .char-parts:nth-of-type(19) { transition-delay: 810ms;}
.char-fade .char-parts:nth-of-type(20) { transition-delay: 855ms;}
.char-fade .char-parts:nth-of-type(21) { transition-delay: 900ms;}
.char-fade .char-parts:nth-of-type(22) { transition-delay: 945ms;}
.char-fade .char-parts:nth-of-type(23) { transition-delay: 990ms;}
.char-fade .char-parts:nth-of-type(24) { transition-delay: 1035ms;}
.char-fade .char-parts:nth-of-type(25) { transition-delay: 1080ms;}
.char-fade .char-parts:nth-of-type(26) { transition-delay: 1125ms;}
.char-fade .char-parts:nth-of-type(27) { transition-delay: 1170ms;}
.char-fade .char-parts:nth-of-type(28) { transition-delay: 1215ms;}
.char-fade .char-parts:nth-of-type(29) { transition-delay: 1260ms;}
.char-fade .char-parts:nth-of-type(30) { transition-delay: 1305ms;}

.slideimg { position: relative; display: inline-block; overflow: hidden;}
.slideimg > * { display: inline-block; opacity: 0; transform: translateX(-50px);}
.slideimg::after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: -100%; background: #222; transform-origin: left top; transition: left 1.6s cubic-bezier(0.375, 0.82, 0.165, 1) 0.2s;}
.slideimg.inview:after { left: 100%;}
.slideimg.inview > * { opacity: 1; transform: translateX(0); transition: opacity 0.1s linear 0.5s, transform 1.6s cubic-bezier(0.075, 0.82, 0.165, 1) 0.4s;}

#mv { position: fixed; top: 0; left: 0; display: flex; width: 100%; height: 100vh; padding: 0; background: #000; z-index: -1;}
#video { width: 100%; height: 100%; padding: 20px; object-fit: cover; opacity: 0; transition: opacity 2s linear; transition-delay: 0.5s;}
#mv h2 { position: absolute; bottom: 160px; right: 48px; width: 40%; text-align: right; opacity: 0; transition: opacity 2s linear; transition-delay: 2.4s;}
#scroll { position: absolute; left: 50%; bottom: 48px; transform: translateX(-50%); opacity: 0; transition: opacity 2s linear; transition-delay: 2.4s;}
#scroll a { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100px; height: 100px; border: 1px solid #FFF; border-radius: 50%;}
#scroll i { font-size: 1.2rem; white-space: nowrap; color: #FFF;}
#scroll span { opacity: 0; position: relative; display: block; width: 13px; height: 11px; margin-top: 3px; background: url("../img/down.svg") center no-repeat; animation: scroll 2s 1s infinite cubic-bezier(0.67, 0.15, 0.35, 0.72);}
@keyframes scroll { 0% { opacity: 0; transform: translateY(-10px);} 60% { opacity: 1; transform: translateY(10px);} 90% { opacity: 1; transform: translateY(10px);} 100% { opacity: 0; transform: translateY(10px);}}
body.start #video, body.start #mv h2, body.start #scroll { opacity: 1;}

#work { display: flex; justify-content: space-between; background: url("../img/bg.jpg") center top repeat-y; background-size: 100% auto; border-top: 20px solid #000;}
#work header { position: relative; width: 20%;}
#work header h2 { position: absolute; top: 0; left: 50%; transform-origin: left top; transform: rotate(90deg) translateY(-50%);}
#work header h2 i { font-size: 20rem; line-height: 1; color: #CCC;}
#work section { max-width: initial;}
#work figure { width: 100%; padding-top: calc(720 / 1280 * 100%);}
#work figure img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.more { width: 160px; margin: 40px auto 0; padding: 8px 48px 8px 24px; text-align: center; background: #000 url("../img/down.svg") right 24px center no-repeat; border-radius: 4px; line-height: 1; color: #FFF; cursor: pointer;}
.more + * { display: none;}

#about { padding-bottom: 0; background: url("../img/bg.jpg") center top repeat-y; background-size: 100% auto;}
#about li { position: relative; display: flex; margin: 0 0 0 calc(50% - 50vw);}
#about li div { position: absolute; top: 50%; right: 0; transform: translateY(-50%); background: #FFF; font-size: 2.4vw}
#about li div span { color: #E60012;}
#about li:nth-child(even) { justify-content: flex-end; margin-left: auto; margin-right: calc(50% - 50vw); text-align: right;}
#about li:nth-child(even) figure {}
#about li:nth-child(even) div { right: auto; left: 0;}

#business { background: rgba(0,0,0,.8); color: #FFF;}
#business header h2::before, #business header h2::after { background-color: #FFF;}
.summary { display: flex; justify-content: space-between; align-items: center; text-align: center;}
.summary li:not(:first-child) { position: relative; padding-left: 40px;}
.summary li:not(:first-child)::before { content: ''; position: absolute; top: 28%; left: 16px; display: inline-block; width: 16px; height: 24px; vertical-align: middle; background: url("../img/arr.svg") center no-repeat;}
.case h3 { margin-bottom: 64px; text-align: center; font-size: 4.8rem; color: #E60012;}
.case h4 { margin-bottom: 24px; font-size: 2rem;}
.case .row { margin: 0 -32px; align-items: center;}

#company { padding-bottom: 0; background: #FFF;}
#company .fr { float: right; margin-left: 40px;}
#company table { width: 100%; max-width: 960px; margin: 0 auto; border-collapse: collapse;}
#company tr { border-bottom: 1px solid #C0BDB4;}
#company th { width: 25%; padding: 24px 40px 24px 0; text-align: left; vertical-align: top; font-weight: 400;}
#company td { padding: 24px 0; text-align: left; font-weight: 400;}
.map { width: 100vw; max-width: initial; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);}

#contact { background: #F4F4F4;}
.form { max-width: 960px; margin: 0 auto; font-size: 1.6rem;}
.form dt { clear: both; float: left; width: 28%; padding-top: 16px; text-align: left; font-weight: 700;}
.form dd { padding: 0 0 48px 32%; text-align: left; line-height: 1.5em;}
.form input[type="text"], .form input[type="tel"], .form input[type="email"], .form input[type="date"] { display: inline-block; width: 100%; padding: 12px; background: #FFF; border: 1px solid #DDDDDD; border-radius: 3px; vertical-align: middle;}
.form select { padding: 16px; background: #FFF;  border: 1px solid #DDDDDD; border-radius: 3px;}
.form textarea { width: 100%; min-height: 280px; padding: 12px; background: #FFF;  border: 1px solid #DDDDDD; border-radius: 3px;}
.form label { display: flex; margin: 8px 32px 8px 0; align-items: center;}
.form label input { margin-right: 8px;}
.form input[type="checkbox"] { display: none;}
.form input[type="checkbox"] + span { position: relative; display: block; padding: 4px 0 4px 24px; line-height: 1;}
.form input[type="checkbox"] + span::before { content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 16px; height: 16px; background: #FFF; border: 1px solid #CCC;}
.form input[type="checkbox"]:checked + span::before { background: #19AA94;}
.form input[type="radio"] { display: none;}
.form input[type="radio"] + span { position: relative; display: block; padding: 4px 0 4px 24px; line-height: 1;}
.form input[type="radio"] + span::before { content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 16px; height: 16px; background: #FFF; border: 1px solid #CCC; border-radius: 50%;}
.form input[type="radio"]:checked + span::before { background: #19AA94;}
.submit { margin: 40px 0; text-align: center;}
.submit input[type="submit"] { display: inline-block; padding: 16px 64px 16px 48px; background: #42365C url("../img/arr.svg") right 24px center no-repeat; background-size: 10px auto; border-radius: 40px; font-size: 1.8rem; font-weight: 500; color: #FFF; box-shadow: 10px 10px 20px rgba(0,0,0,.08); line-height: 1;}
.submit input[type="submit"]:disabled {background-color: #aaa; cursor:not-allowed;}
.submit input[type="submit"]:not(.disabled):hover { opacity: 0.7;}
.submit input[type="button"] { display: inline-block; margin: 0 16px; padding: 24px 80px; background: #999; border-radius: 32px; font-weight: 700; color: #FFF;}
.must { float: right; margin-left: 16px; padding: 2px 4px; background: #42365C; font-size: 1.1rem; font-weight: 700; color: #FFF;}
.form ::-webkit-input-placeholder { font-weight: 700; color: #BABABA;}
.form ::-moz-placeholder { font-weight: 700; color: #BABABA;}
.form :-ms-input-placeholder { font-weight: 700; color: #BABABA;}
.g-recaptcha > div { margin: 0 auto;}
.thanks { background: #000;}
.thanks #header { height: auto; text-align: center; opacity: 1;}
.thanks #footer { height: auto; padding: 40px;}
#thanks { background: url("../img/bg.jpg") center top repeat-y; background-size: 100% auto;}
#thanks header { text-align: center;}
#thanks section { text-align: center;}
#thanks h3 { font-size: 2.4rem; margin-bottom: 24px;}




@media only screen and (max-width: 1280px){
#nav { pointer-events: none; opacity: 0; transform: scale(0.9); position: fixed; top: 0; left: 0; display: flex; justify-content: center; align-items: center; width: 100%; max-width: 100%; height: 100vh; margin: 0; background: rgba(0,0,0,.9); overflow: auto; z-index: 200; -webkit-transition: .8s cubic-bezier(.19,1,.22,1); transition: .8s cubic-bezier(.19,1,.22,1);}
#nav li { opacity: 0; -webkit-transform: translateY(-50px); transform: translateY(-50px); padding: 12px 0; text-align: center; -webkit-transition: .6s cubic-bezier(.19,1,.22,1); transition: .6s cubic-bezier(.19,1,.22,1);}
#nav li:nth-of-type(1) { -webkit-transition-delay: .14s; transition-delay: .14s;}
#nav li:nth-of-type(2) { -webkit-transition-delay: .18s; transition-delay: .18s;}
#nav li:nth-of-type(3) { -webkit-transition-delay: .22s; transition-delay: .22s;}
#nav li:nth-of-type(4) { -webkit-transition-delay: .26s; transition-delay: .26s;}
#nav li:nth-of-type(5) { -webkit-transition-delay: .30s; transition-delay: .30s;}
#nav li:nth-of-type(6) { -webkit-transition-delay: .34s; transition-delay: .34s;}
#nav li a { font-size: 2rem; color: #FFF;}
#open { position: fixed; top: 20px; right: 20px; display: block; width: 50px; height: 50px; text-align: center; background: #FFF; cursor: pointer; z-index: 9999;}
#open div { position: relative; display: block; width: 26px; height: 26px; margin: 6px 12px; transition: .2s linear;}
#open span { position: absolute; left: 0; display: block; width: 26px; height: 2px; background: #000; transition: .2s linear;}
#open span:nth-child(1) { top: 8px;}
#open span:nth-child(2) { top: 16px;}
#open span:nth-child(3) { top: 24px;}
.open #open span:nth-child(1) { top: 16px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg);}
.open #open span:nth-child(2) { width: 0; left: -24px;}
.open #open span:nth-child(3) { top: 16px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg);}
.open #nav { pointer-events: auto; opacity: 1; transform: scale(1);}
.open #nav li { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);}
#footer { padding: 56px 4vw;}
#mv h2 { bottom: auto; top: 72px; right: auto; left: 24px; width: calc(100% - 48px); max-width: 480px; text-align: left;}
#scroll { bottom: 48px; left: auto; right: 48px; transform: translateX(0);}
#scroll a { width: 88px; height: 88px; font-size: 1rem;}
}



@media only screen and (max-width: 1024px){
article { position: relative; padding: 64px 4vw;}
article header { margin: 0 auto 40px;}
article header h2 i { font-size: 3.2rem;}
article header p { margin-top: 40px; text-align: left; font-size: 1.8rem;}
section + section { margin-top: 64px;}
.row { display: block; margin: 0 0 -32px;}
.row > * { width: auto; margin: 0 0 32px;}
.sp { display: block;}
.pc { display: none;}
#scroll { bottom: 20vh; right: 24px;}

#work p { line-height: 1.6;}
#about li div { font-size: 4vw}

.summary { display: block;}
.summary li { max-width: 165px; margin: 0 auto;}
.summary li:not(:first-child) { margin-top: 16px; padding: 48px 0 0;}
.summary li:not(:first-child)::before { top: 0; left: calc(50% - 12px); transform: rotate(90deg);}
.case h3 { font-size: 3.2rem;}
.case h4 { font-size: 1.8rem;}
.case .row { margin: 0 0 48px;}

#company .fr { float: none; margin: 0 0 16px; text-align: center;}
#company th { display: block; width: auto; padding: 24px 0 0; font-weight: 700;}
#company td { display: block;}
.map { width: 100vw; max-width: initial; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);}

.form dt { float: none; width: auto; padding: 0;}
.form dd { padding: 16px 0 40px;}
}




@media print {
#container { width: 1024px;}
}
/* WordPress / Contact Form 7: existing design and accessible controls */
#header { height: 100svh;}
#mv { height: 100svh;}
.page-top:not(.start) #video, .page-top:not(.start) #mv h2, .page-top:not(.start) #scroll { opacity: 1;}
.page-top.past-hero #mv h2 { visibility: hidden;}
#open { border: 0; padding: 0;}
#nav a:focus-visible, #scroll a:focus-visible { outline-color: #FFF;}
.more { display: block; font-family: inherit; font-size: inherit; border: 0;}
.more[hidden] { display: none;}
.more + .is-expanded { display: block;}
.page-top #contact .form label { display: inline; margin: 0;}
.page-top #contact .form label input { margin-right: 0;}
.page-top #contact .wpcf7-form-control-wrap { display: block; min-width: 0;}
.page-top #contact .wpcf7-not-valid-tip { margin-top: 8px; font-size: 1.4rem;}
.page-top #contact .wpcf7-response-output { max-width: 960px; margin: 24px auto 0; padding: 12px; line-height: 1.6;}
.page-top #contact .submit { position: relative;}
.page-top #contact .wpcf7-spinner { position: absolute; top: 50%; margin: -12px 0 0 16px;}
.page-top #contact .wpcf7-form.submitting input[type="submit"] { cursor: wait;}
.page-top #contact .wpcf7-form p { margin: 0;}
.page-top .map iframe { border: 0;}
.page-top #work section { min-width: 0;}
.page-standard { background: #000;}
.page-standard #header { height: auto;}
.page-standard #main { background: #FFF;}
.page-standard #footer { height: auto;}
@media only screen and (min-width: 1281px) {
body.admin-bar #mv { top: 32px; height: calc(100svh - 32px);}
}
@media only screen and (max-width: 1024px) {
article header h2 i { font-size: clamp(2.4rem, 8.54vw, 3.2rem);}
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; transition-delay: 0ms !important;}
}
