@charset "UTF-8";
   html {
line-height: 1.15; -webkit-text-size-adjust: 100%; }  body {
margin: 0;
} main {
display: block;
} h1 {
font-size: 2em;
margin: 0.67em 0;
}  hr {
box-sizing: content-box; height: 0; overflow: visible; } pre {
font-family: monospace, monospace; font-size: 1em; }  a {
background-color: transparent;
} abbr[title] {
border-bottom: none; text-decoration: underline; text-decoration: underline dotted; } b,
strong {
font-weight: bolder;
} code,
kbd,
samp {
font-family: monospace, monospace; font-size: 1em; } small {
font-size: 80%;
} sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}  img {
border-style: none;
}  button,
input,
optgroup,
select,
textarea {
font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button,
input { overflow: visible;
} button,
select { text-transform: none;
} button,
[type=button],
[type=reset],
[type=submit] {
-webkit-appearance: button;
} button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
border-style: none;
padding: 0;
} button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
outline: 1px dotted ButtonText;
} fieldset {
padding: 0.35em 0.75em 0.625em;
} legend {
box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress {
vertical-align: baseline;
} textarea {
overflow: auto;
} [type=checkbox],
[type=radio] {
box-sizing: border-box; padding: 0; } [type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
height: auto;
} [type=search] {
-webkit-appearance: textfield; outline-offset: -2px; } [type=search]::-webkit-search-decoration {
-webkit-appearance: none;
} ::-webkit-file-upload-button {
-webkit-appearance: button; font: inherit; }  details {
display: block;
} summary {
display: list-item;
}  template {
display: none;
} [hidden] {
display: none;
}
a, span, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, div, main, article, section, header, footer, aside, nav, input, button, select, textarea, body, table, tr, th, td, figure, *::before, *::after {
margin: 0;
padding: 0;
box-sizing: border-box;
font-feature-settings: "palt" 1;
word-break: normal;
line-break: strict;
word-wrap: break-word;
overflow-wrap: break-word;
}
html {
overflow: auto;
height: 100%;
}
body {
font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", "Meiryo", sans-serif;
-webkit-font-smoothing: antialiased;
color: #212121;
}
body.is-noscroll {
height: 100%;
overflow: hidden;
}
img, svg {
max-width: 100%;
height: auto;
vertical-align: top;
}
::selection {
background-color: #2D2D2D;
color: #DCDDDD;
}
a, .a {
cursor: pointer;
transition-duration: 0.5s;
}
a:hover, .a:hover {
cursor: pointer;
}
svg {
vertical-align: top;
}
#loading {
z-index: 2; }
#wrap {
z-index: 1; }
#header {
z-index: 5; }
#index-main-fixed {
z-index: 4; }
#luxy {
z-index: 3; }
#page-contents {
z-index: 2;
position: relative; }
#foot-contents {
z-index: 1;
position: relative; }
#footer {
z-index: 1;
position: relative; }
#wrap {
position: relative;
background: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/body-bg@2x.jpg) repeat top left;
background-size: 500px;
overflow: hidden;
}
@media screen and (max-width: 768px) {
#wrap {
padding-top: 74px;
}
}
@media screen and (min-width: 769px) {
#wrap {
padding-top: 160px;
min-width: 1176px;
margin: 0 auto;
}
}
@media screen and (min-width: 769px) {
#luxy {
min-width: 1176px;
margin: 0 auto;
}
}
@media screen and (min-width: 769px) {
#minwidth {
min-width: 1176px;
margin: 0 auto;
height: 1px;
}
}
.l-loading {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background-color: #212121;
transform-origin: bottom center;
transition-duration: 2s;
transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}
.l-loading.is-loaded {
transform: scale(1, 0);
}
#header {
position: fixed;
top: 0;
left: 0;
width: 100%;
}
@media screen and (min-width: 769px) {
#header {
min-width: 1176px;
margin: 0 auto;
}
}
.l-header {
position: relative;
}
.l-header::before {
content: "";
display: block;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/body-bg@2x.jpg) repeat top left;
background-size: 500px;
z-index: 1;
transition-duration: 0.5s;
}
#header.is-scrolled .l-header::before {
opacity: 0.95;
}
.l-header__inner {
position: relative;
z-index: 2;
}
@media screen and (max-width: 768px) {
.l-header__inner {
padding: 0px 20px;
height: 74px;
display: flex;
align-items: center;
justify-content: space-between;
}
}
@media screen and (min-width: 769px) {
.l-header__inner {
padding: 0px 50px;
}
}
@media screen and (max-width: 768px) {
.l-header__main {
position: relative;
z-index: 1;
}
}
@media screen and (min-width: 769px) {
.l-header__main {
height: 108px;
display: flex;
align-items: center;
transition-duration: 0.5s;
}
}
@media screen and (min-width: 769px) {
#header.is-scrolled .l-header__main {
height: 90px;
}
}
@media screen and (max-width: 768px) {
.l-header__menu {
position: relative;
z-index: 3;
}
}
@media screen and (min-width: 769px) {
.l-header__menu {
display: none;
}
}
@media screen and (max-width: 768px) {
.l-header__nav {
position: absolute;
top: 0;
left: 0;
width: 100%;
display: none;
z-index: 2;
}
}
@media screen and (min-width: 769px) {
.l-header__nav {
display: block !important;
border-top: 1px solid rgba(89, 89, 89, 0.25);
transition-duration: 0.5s;
height: 52px;
}
}
@media screen and (min-width: 769px) {
#header.is-scrolled .l-header__nav {
border-top: none;
height: 0px;
}
}
@media screen and (max-width: 768px) {
.l-header__nav::after {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/body-bg@2x.jpg) repeat top left;
background-size: 500px;
opacity: 0.95;
}
}
@media screen and (max-width: 768px) {
.l-hdr_main__logo {
width: 133px;
}
}
.l-hdr_main__link {
display: flex;
align-items: center;
}
@media screen and (min-width: 769px) {
.l-hdr_main__link {
overflow: hidden;
}
}
.l-hdr_main__link:hover {
opacity: 0.7;
}
@media screen and (max-width: 768px) {
.l-hdr_main__link img:first-child {
flex-basis: 31px;
max-width: 31px;
min-width: 31px;
}
}
@media screen and (max-width: 768px) {
.l-hdr_main__link img:last-child {
margin-left: 9px;
flex-basis: 93px;
max-width: 93px;
min-width: 93px;
display: block !important;
}
}
@media screen and (min-width: 769px) {
.l-hdr_main__link img:last-child {
margin-left: 13px;
}
}
@media screen and (max-width: 768px) {
.c-menu_button {
width: 35px;
height: 11px;
position: relative;
cursor: pointer;
}
}
@media screen and (max-width: 768px) {
.c-menu_button::before, .c-menu_button::after {
content: "";
display: block;
width: 100%;
height: 1px;
background-color: #DCDDDD;
position: absolute;
left: 50%;
transition-duration: 0.2s;
transform-origin: center;
}
}
@media screen and (max-width: 768px) {
.c-menu_button::before {
top: 0px;
transform: translate(-50%, 0) rotate(0deg);
}
}
@media screen and (max-width: 768px) {
.c-menu_button::after {
top: calc(100% - 1px);
transform: translate(-50%, 0) rotate(0deg);
}
}
@media screen and (max-width: 768px) {
.c-menu_button.is-step1::before, .c-menu_button.is-step1::after {
top: 50%;
transform: translate(-50%, -50%) rotate(0deg);
}
}
@media screen and (max-width: 768px) {
.c-menu_button.is-open::before {
top: 50%;
transform: translate(-50%, -50%) rotate(15deg);
}
}
@media screen and (max-width: 768px) {
.c-menu_button.is-open::after {
top: 50%;
transform: translate(-50%, -50%) rotate(-15deg);
}
}
@media screen and (max-width: 768px) {
.l-hdr_nav {
padding-top: 90px;
padding-bottom: 50px;
position: relative;
z-index: 2;
height: 100vh;
z-index: 2;
overflow: scroll;
}
}
@media screen and (max-width: 768px) {
.l-hdr_nav__global {
display: block !important;
}
}
@media screen and (min-width: 769px) {
.l-hdr_nav__global.is-scrollheader-step2 {
position: absolute;
top: 0;
right: 420px;
}
}
@media screen and (min-width: 769px) {
.l-hdr_nav__sub {
position: absolute;
top: 0;
right: 50px;
}
}
@media screen and (min-width: 769px) {
.l-hdr_nav_global {
display: flex;
align-items: center;
justify-content: center;
}
}
.l-hdr_nav_global__item {
list-style: none;
font-weight: bold;
letter-spacing: 0.1em;
font-size: 15px;
}
@media screen and (max-width: 768px) {
.l-hdr_nav_global__item {
margin-top: 50px;
display: flex;
justify-content: center;
}
}
@media screen and (min-width: 769px) {
.l-hdr_nav_global__item {
padding: 0 14px;
}
}
.l-hdr_nav_global__item--home {
letter-spacing: 0.18em;
}
@media screen and (max-width: 768px) {
.l-hdr_nav_global__item:first-child {
margin-top: 0;
}
}
.l-hdr_nav_global__link {
text-decoration: none;
color: #DCDDDD;
position: relative;
}
@media screen and (min-width: 769px) {
.l-hdr_nav_global__link {
display: flex;
align-items: center;
height: 52px;
transition-duration: 0s;
}
}
@media screen and (min-width: 769px) {
#header-nav-global.is-scrollheader-step1 .l-hdr_nav_global__link {
height: 0px;
}
}
@media screen and (min-width: 769px) {
#header-nav-global.is-scrollheader-step3 .l-hdr_nav_global__link {
height: 90px;
}
}
@media screen and (min-width: 769px) {
#header-nav-global.is-scrollheader-backready .l-hdr_nav_global__link {
height: 108px;
}
}
@media screen and (min-width: 769px) {
#header-nav-global.is-child-link-transition .l-hdr_nav_global__link {
transition-duration: 0.5s;
}
}
.l-hdr_nav_global__link::after {
content: "";
display: block;
position: absolute;
left: 0;
width: 100%;
color: #DCDDDD;
opacity: 0;
}
@media screen and (max-width: 768px) {
.l-hdr_nav_global__link::after {
bottom: -10px;
}
}
@media screen and (min-width: 769px) {
.l-hdr_nav_global__link::after {
bottom: 0;
height: 0;
transition-duration: 0.5s;
}
}
@media screen and (min-width: 769px) {
.l-hdr_nav_global__link.is-current, .l-hdr_nav_global__link:hover {
color: #C6AA80;
}
}
@media screen and (min-width: 769px) {
.l-hdr_nav_global__link.is-current::after, .l-hdr_nav_global__link:hover::after {
height: 3px;
background-color: #C6AA80;
opacity: 1;
}
}
@media screen and (max-width: 768px) {
.l-hdr_nav_global__link.is-current {
color: #C6AA80;
}
}
@media screen and (max-width: 768px) {
.l-hdr_nav_global__link.is-current::after {
height: 3px;
background-color: #C6AA80;
opacity: 1;
}
}
@media screen and (max-width: 768px) {
.l-hdr_nav_sub {
max-width: 280px;
margin: 50px auto 0;
}
}
@media screen and (min-width: 769px) {
.l-hdr_nav_sub {
height: 108px;
display: flex;
align-items: center;
flex-direction: row-reverse;
transition-duration: 0.5s;
}
}
@media screen and (min-width: 769px) {
#header.is-scrolled .l-hdr_nav_sub {
height: 90px;
}
}
.l-hdr_nav_sub__item {
list-style: none;
}
@media screen and (min-width: 769px) {
.l-hdr_nav_sub__item {
margin-left: 20px;
}
}
@media screen and (min-width: 769px) {
.l-hdr_nav_sub__item--btn {
width: 180px;
transition-duration: 0.5s;
}
}
@media screen and (min-width: 769px) {
#header.is-scrolled .l-hdr_nav_sub__item--btn {
width: 166px;
}
}
.l-hdr_nav_sub__item--ymd {
letter-spacing: 0.1em;
font-size: 12px;
}
@media screen and (max-width: 768px) {
.l-hdr_nav_sub__item--ymd {
margin-top: 40px;
padding-top: 40px;
border-top: 1px solid rgba(89, 89, 89, 0.25);
text-align: center;
}
}
.l-hdr_nav_sub__textlnk, .l-hdr_nav_sub__btn {
text-decoration: none;
color: #DCDDDD;
}
.l-hdr_nav_sub__textlnk:hover {
opacity: 0.7;
}
@media screen and (max-width: 768px) {
.l-hdr_nav_sub__btn svg {
margin-right: 5px;
}
}
@media screen and (min-width: 769px) {
.l-hdr_nav_sub__btn svg {
margin-right: 5px;
}
}
#page-contents {
background-color: #F0F0F0;
}
#page-contents.is-dark {
background: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/body-bg@2x.jpg) repeat top left;
background-size: 500px;
}
.l-contact {
position: relative;
}
.l-contact__link {
color: #DCDDDD;
text-decoration: none;
display: block;
}
.l-contact__bgarea {
overflow: hidden;
z-index: 1;
}
.l-contact__bg {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
position: relative;
will-change: transform;
transition-duration: 0.5s;
will-change: transform;
transform: scale(1);
}
@media screen and (max-width: 768px) {
.l-contact__bg {
height: 283px;
}
}
@media screen and (min-width: 769px) {
.l-contact__bg {
height: 309px;
}
}
@media screen and (min-width: 769px) {
.l-contact__link:hover .l-contact__bg {
transform: scale(1.015);
}
}
.l-contact__bg img {
display: none;
}
.l-contact__bg::after {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
transition-duration: 0.5s;
}
@media screen and (min-width: 769px) {
.l-contact__link:hover .l-contact__bg::after {
background-color: rgba(0, 0, 0, 0.8);
}
}
.l-contact__main {
z-index: 2;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 100%;
}
@media screen and (min-width: 769px) {
.l-contact__inner {
display: flex;
align-items: center;
justify-content: center;
}
}
@media screen and (min-width: 769px) {
.l-contact__head {
display: flex;
align-items: center;
margin-right: 125px;
}
}
.l-contact__en {
font-family: "Philosopher", sans-serif;
letter-spacing: 0.05em;
position: relative;
}
@media screen and (max-width: 768px) {
.l-contact__en {
font-size: 30px;
text-align: center;
}
}
@media screen and (min-width: 769px) {
.l-contact__en {
font-size: 44px;
margin-right: 105px;
}
}
.l-contact__en::after {
content: "";
display: block;
background-color: #DCDDDD;
}
@media screen and (max-width: 768px) {
.l-contact__en::after {
width: 1px;
height: 40px;
margin: 5px auto 0;
}
}
@media screen and (min-width: 769px) {
.l-contact__en::after {
width: 80px;
height: 1px;
position: absolute;
top: 50%;
left: 100%;
transform: translateX(10px);
}
}
.l-contact__ttl {
font-family: vdl-v7mincho, sans-serif;
font-weight: 500;
letter-spacing: 0.18em;
}
@media screen and (max-width: 768px) {
.l-contact__ttl {
font-size: 13px;
display: flex;
align-items: center;
justify-content: center;
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.l-contact__ttl {
font-size: 15px;
display: flex;
align-items: center;
}
}
@media screen and (max-width: 768px) {
.l-contact__ttl svg {
margin-right: 5px;
width: 12px;
}
}
@media screen and (min-width: 769px) {
.l-contact__ttl svg {
margin-right: 10px;
}
}
.l-contact__ttl path {
stroke: #DCDDDD;
}
.l-contact__txt {
font-weight: bold;
letter-spacing: 0;
}
@media screen and (max-width: 768px) {
.l-contact__txt {
font-size: 13px;
line-height: calc(21.7/13);
margin-top: 25px;
text-align: center;
}
}
@media screen and (min-width: 769px) {
.l-contact__txt {
font-size: 15px;
line-height: calc(22/15);
}
}
.l-footer_main {
background: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/body-bg@2x.jpg) repeat top left;
background-size: 500px;
}
@media screen and (max-width: 768px) {
.l-footer_main {
padding: 35px 0;
}
}
@media screen and (min-width: 769px) {
.l-footer_main {
padding: 90px 0 140px;
}
}
@media screen and (max-width: 768px) {
.l-footer_main__logo {
width: 89px;
margin: 0 auto;
}
}
@media screen and (min-width: 769px) {
.l-footer_main__logo {
text-align: center;
}
}
.l-footer_main__logo a {
display: block;
}
@media screen and (min-width: 769px) {
.l-footer_main__logo a:hover {
opacity: 0.7;
}
}
@media screen and (min-width: 769px) {
.l-footer_main__menu {
display: none;
}
}
@media screen and (max-width: 768px) {
.l-footer_main__menu_btn {
display: flex;
align-items: center;
justify-content: center;
margin-top: 30px;
}
}
@media screen and (max-width: 768px) {
.l-footer_main__menu_txt {
font-family: "Philosopher", sans-serif;
text-align: center;
color: #DCDDDD;
letter-spacing: 0.05em;
font-size: 11px;
margin-top: 8px;
}
}
@media screen and (min-width: 769px) {
.l-footer_main__menu_txt {
display: none;
}
}
@media screen and (max-width: 768px) {
.l-footer_main__nav {
display: none;
}
}
@media screen and (min-width: 769px) {
.l-footer_main__nav {
margin-top: 45px;
}
}
@media screen and (min-width: 769px) {
.l-footer_main_nav {
display: flex;
align-items: center;
justify-content: center;
}
}
.l-footer_main_nav__item {
list-style: none;
}
@media screen and (min-width: 769px) {
.l-footer_main_nav__item {
padding: 0 13px;
}
}
.l-footer_main_nav__link {
color: #DCDDDD;
text-decoration: none;
}
@media screen and (min-width: 769px) {
.l-footer_main_nav__link:hover {
opacity: 0.7;
}
}
.l-footer_group {
background-color: #fff;
}
@media screen and (min-width: 769px) {
.l-footer_group {
padding: 0 30px;
}
}
.l-footer_group__row {
display: flex;
align-items: center;
}
@media screen and (max-width: 768px) {
.l-footer_group__row {
height: 88px;
justify-content: center;
}
}
@media screen and (min-width: 769px) {
.l-footer_group__row {
height: 120px;
justify-content: space-between;
flex-direction: row-reverse;
}
}
@media screen and (max-width: 768px) {
.l-footer_group__logo {
flex-basis: 54px;
max-width: 54px;
min-width: 54px;
margin-right: 10px;
}
}
@media screen and (min-width: 769px) {
.l-footer_group__info {
flex-basis: calc(100% - 90px);
max-width: calc(100% - 90px);
min-width: calc(100% - 90px);
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: row-reverse;
}
}
.l-footer_group__txt {
color: #555555;
letter-spacing: 0.08em;
}
@media screen and (max-width: 768px) {
.l-footer_group__txt {
font-size: 11px;
line-height: calc(19/11);
}
}
@media screen and (min-width: 769px) {
.l-footer_group__txt {
font-size: 12px;
}
}
.l-footer_group__copyright {
font-family: "Philosopher", sans-serif;
letter-spacing: 0.05em;
color: #898989;
}
@media screen and (max-width: 768px) {
.l-footer_group__copyright {
font-size: 10px;
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.l-footer_group__copyright {
font-size: 10px;
}
}
@media screen and (max-width: 768px) {
.c-inner-default-sp {
padding: 0 30px;
margin: 0 auto;
}
}
@media screen and (max-width: 768px) {
.c-inner-full-sp {
padding: 0;
}
}
@media screen and (min-width: 769px) {
.c-inner-default-pc {
width: 1126px;
padding: 0;
margin: 0 auto;
}
}
@media screen and (min-width: 769px) {
.c-inner-wide-pc {
min-width: 1176px;
max-width: 1356px;
padding: 0 25px;
margin: 0 auto;
}
}
@media screen and (min-width: 769px) {
.c-inner-narrow-pc {
width: 720px;
padding: 0;
margin: 0 auto;
}
}
@media screen and (min-width: 769px) {
.c-inner-full-pc {
width: 100%;
max-width: none;
padding: 0;
}
}
@media screen and (min-width: 769px) {
.c-minwidth {
min-width: 1176px;
margin: 0 auto;
}
}
.c-btn {
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
color: #C6AA80;
font-weight: bold;
letter-spacing: 0.08em;
position: relative;
transition-duration: 0.5s; }
@media screen and (max-width: 768px) {
.c-btn {
height: 58px;
font-size: 16px;
}
}
@media screen and (min-width: 769px) {
.c-btn {
height: 64px;
font-size: 15px;
width: 224px;
}
}
.c-btn.is-hover-step3 {
background-color: #C6AA80;
color: #fff; }
.c-btn--bg_alphawhite {
background-color: rgba(255, 255, 255, 0.6);
}
.c-btn--bg_alphawhite.is-outview {
background-color: rgba(255, 255, 255, 0);
}
.c-btn--bg_alphawhite.is-outview.is-inview-btn-step3 {
background-color: rgba(255, 255, 255, 0.6);
}
@media screen and (min-width: 769px) {
.c-btn--autowidth {
width: 100%;
}
}
.c-btn--header {
color: #DCDDDD;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.c-btn--header {
font-size: 15px;
height: 58px;
}
}
@media screen and (min-width: 769px) {
.c-btn--header {
font-size: 15px;
height: 44px;
}
}
@media screen and (min-width: 769px) {
#header.is-scrolled .c-btn--header {
font-size: 13px;
height: 40px;
}
}
.c-btn--header.is-hover-step3 {
background-color: rgba(220, 221, 221, 0.1);
color: #DCDDDD;
}
@media screen and (min-width: 769px) {
.c-btn--works_single {
height: 54px;
}
}
.c-btn--works_single svg {
margin-right: 15px;
}
.c-btn__left, .c-btn__top, .c-btn__right, .c-btn__bottom {
background-color: #C6AA80;
transition-duration: 0.7s; position: absolute;
}
.c-btn--header .c-btn__left, .c-btn--header .c-btn__top, .c-btn--header .c-btn__right, .c-btn--header .c-btn__bottom {
background-color: rgba(220, 221, 221, 0.3);
}
.c-btn__left, .c-btn__right {
width: 1px;
height: 100%;
transform: scale(1, 1);
}
.is-outview.is-inview-btn-step1 .c-btn__left, .is-outview.is-inview-btn-step1 .c-btn__right {
transform: scale(1, 1);
transition-duration: 0.2s; }
.c-btn__top, .c-btn__bottom {
width: 100%;
height: 1px;
transform: scale(1, 1);
}
.is-outview.is-inview-btn-step2 .c-btn__top, .is-outview.is-inview-btn-step2 .c-btn__bottom {
transform: scale(1, 1);
transition-duration: 0.5s; }
.c-btn__left {
top: 0;
left: 0;
transform-origin: center bottom;
}
.is-hover-step1 .c-btn__left {
transform: scale(1, 0);
transition-duration: 0.2s; }
.is-outview .c-btn__left {
transform: scale(1, 0);
transition-duration: 0s;
}
.c-btn__top {
top: 0;
left: 0;
transform-origin: left center;
}
.is-hover-step2 .c-btn__top {
transform: scale(0, 1);
transition-duration: 0.5s; }
.is-outview .c-btn__top {
transform: scale(0, 1);
transition-duration: 0s;
}
.c-btn__right {
top: 0;
right: 0;
transform-origin: center top;
}
.is-hover-step1 .c-btn__right {
transform: scale(1, 0);
transition-duration: 0.2s; }
.is-outview .c-btn__right {
transform: scale(1, 0);
transition-duration: 0s;
}
.c-btn__bottom {
bottom: 0;
left: 0;
transform-origin: right center;
}
.is-hover-step2 .c-btn__bottom {
transform: scale(0, 1);
transition-duration: 0.5s; }
.is-outview .c-btn__bottom {
transform: scale(0, 1);
transition-duration: 0s;
}
.c-vertical_head__main {
overflow: hidden;
}
.c-vertical_head__ttl {
font-family: vdl-v7mincho, sans-serif;
font-weight: 500;
line-height: calc(20/15);
text-align: center;
}
@media screen and (max-width: 768px) {
.c-vertical_head__ttl {
font-size: 16px;
padding-bottom: 20px;
}
}
@media screen and (min-width: 769px) {
.c-vertical_head__ttl {
font-size: 21px;
padding-bottom: 20px;
}
}
.c-vertical_head__ttl span {
display: block;
}
.c-vertical_head.is-outview .c-vertical_head__ttl {
transform: translateY(100%);
}
.c-vertical_head.is-inview-verthead-step2 .c-vertical_head__ttl {
transform: translateY(0);
transition-duration: 1.5s;
transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}
.c-vertical_head__bar {
margin: 0 auto;
height: 1px;
background-color: #898989;
}
@media screen and (max-width: 768px) {
.c-vertical_head__bar {
width: 86px;
}
}
@media screen and (min-width: 769px) {
.c-vertical_head__bar {
width: 110px;
}
}
.c-vertical_head.is-outview .c-vertical_head__bar {
transform: scale(0, 1);
}
.c-vertical_head.is-inview-verthead-step1 .c-vertical_head__bar {
transform: scale(1, 1);
transition-duration: 1.5s;
transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}
.c-vertical_head__sub {
overflow: hidden;
}
.c-vertical_head__en {
font-family: "Philosopher", sans-serif;
letter-spacing: 0.05em;
color: #C6AA80;
text-align: center;
transform: translateY(0);
}
@media screen and (max-width: 768px) {
.c-vertical_head__en {
font-size: 13px;
padding-top: 11px;
}
}
@media screen and (min-width: 769px) {
.c-vertical_head__en {
font-size: 15px;
padding-top: 17px;
}
}
.c-vertical_head.is-outview .c-vertical_head__en {
transform: translateY(100%);
}
.c-vertical_head.is-inview-verthead-step2 .c-vertical_head__en {
transform: translateY(0);
transition-duration: 1.5s;
transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}
.js-inview-fadeup.is-outview,
.js-inview-fadeup-repeat.is-outview,
.js-inview-fadeup-firstview.is-outview {
opacity: 0;
transform: translateY(30px);
transition-duration: 1.5s;
}
.js-inview-fadeup.is-outview.is-inview-fadeup-step1,
.js-inview-fadeup-repeat.is-outview.is-inview-fadeup-step1,
.js-inview-fadeup-firstview.is-outview.is-inview-fadeup-step1 {
opacity: 1;
transform: translateY(0px);
transition-duration: 1.5s;
}
.js-inview-faderight.is-outview,
.js-inview-faderight-repeat.is-outview,
.js-inview-faderight-firstview.is-outview {
opacity: 0;
transform: translateX(-30px);
transition-duration: 1.5s;
}
.js-inview-faderight.is-outview.is-inview-fadeup-step1,
.js-inview-faderight-repeat.is-outview.is-inview-fadeup-step1,
.js-inview-faderight-firstview.is-outview.is-inview-fadeup-step1 {
opacity: 1;
transform: translateY(0px);
transition-duration: 1.5s;
}
.js-inview-fadein.is-outview,
.js-inview-fadein-repeat.is-outview,
.js-inview-fadein-firstview.is-outview {
opacity: 0;
transition-duration: 1.5s;
}
.js-inview-fadein.is-outview.is-inview-fadeup-step1,
.js-inview-fadein-repeat.is-outview.is-inview-fadeup-step1,
.js-inview-fadein-firstview.is-outview.is-inview-fadeup-step1 {
opacity: 1;
transition-duration: 1.5s;
}
.js-contact-hide {
display: none;
}
.c-zoom_hero__contents {
position: relative;
z-index: 1; }
.c-zoom_hero__scroll {
position: relative;
z-index: 2; }
.c-zoom_hero__main {
position: relative;
z-index: 3; }
.c-zoom_hero {
position: relative;
overflow: hidden;
}
.c-zoom_hero__parent_position {
position: absolute;
}
@media screen and (max-width: 768px) {
.c-zoom_hero__parent_position {
top: -74px;
}
}
@media screen and (min-width: 769px) {
.c-zoom_hero__parent_position {
top: -160px;
}
}
.c-zoom_hero__contents {
position: relative;
}
.c-zoom_hero__contents::before {
content: "";
display: block;
position: absolute;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.25);
z-index: 2;
}
.c-zoom_hero__scroll {
position: absolute;
right: 30px;
bottom: 0;
z-index: 2;
}
.c-zoom_hero__figure {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
position: relative;
z-index: 1;
}
.c-zoom_hero__main {
position: absolute;
left: 0;
width: 100%;
}
@media screen and (max-width: 768px) {
.c-zoom_hero__main {
bottom: calc(50vh - 37px);
}
}
@media screen and (min-width: 769px) {
.c-zoom_hero__main {
bottom: calc(50vh - 45px);
min-width: 1176px;
margin: 0 auto;
}
}
.c-zoom_hero_scroll_fixed {
position: fixed;
right: 30px;
bottom: 0;
z-index: 1;
}
.c-zoom_hero_scroll {
position: relative;
z-index: 2;
}
.c-zoom_hero_scroll.is-fixed {
position: fixed;
right: 30px;
bottom: 0;
}
.c-zoom_hero_scroll__contents {
position: relative;
}
.c-zoom_hero_scroll__txt {
position: absolute;
top: -50%;
left: 50%;
color: #fff;
font-family: "Philosopher", sans-serif;
letter-spacing: 0.18em;
white-space: nowrap;
}
@media screen and (max-width: 768px) {
.c-zoom_hero_scroll__txt {
font-size: 11px;
transform: translate(-50%, -10px) rotate(90deg);
}
}
@media screen and (min-width: 769px) {
.c-zoom_hero_scroll__txt {
font-size: 13px;
transform: translate(-50%, -12px) rotate(90deg);
}
}
.c-zoom_hero_scroll__bar {
background-color: rgba(255, 255, 255, 0.3);
width: 1px;
margin: 0 auto;
}
@media screen and (max-width: 768px) {
.c-zoom_hero_scroll__bar {
height: 70px;
}
}
@media screen and (min-width: 769px) {
.c-zoom_hero_scroll__bar {
height: 100px;
}
}
.c-zoom_hero_scroll__bar::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #C6AA80;
animation: scrollbar 2s infinite cubic-bezier(0.77, 0, 0.18, 1);
}
.c-zoom_hero_main__fixed {
position: fixed;
left: 0;
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-zoom_hero_main__fixed {
top: calc(50% + 37px);
}
}
@media screen and (min-width: 769px) {
.c-zoom_hero_main__fixed {
top: calc(50% + 45px);
}
}
.c-zoom_hero_main__contents.is-fixed {
position: fixed;
left: 0;
transform: translateY(-50%);
width: 100%;
}
@media screen and (max-width: 768px) {
.c-zoom_hero_main__contents.is-fixed {
top: calc(50% + 37px);
}
}
@media screen and (min-width: 769px) {
.c-zoom_hero_main__contents.is-fixed {
top: calc(50% + 45px);
min-width: 1176px;
margin: 0 auto;
}
}
.c-zoom_hero_main__en {
color: #C6AA80;
text-align: center;
font-family: "Philosopher", sans-serif;
letter-spacing: 0.05em;
font-size: 13px;
}
.c-zoom_hero_main__ttl {
font-family: vdl-v7mincho, sans-serif;
letter-spacing: 0.35em;
color: #fff;
text-align: center;
font-weight: 500;
margin-top: 15px;
}
@media screen and (max-width: 768px) {
.c-zoom_hero_main__ttl {
font-size: 20px;
}
}
@media screen and (min-width: 769px) {
.c-zoom_hero_main__ttl {
font-size: 22px;
}
}
.c-bread {
position: absolute;
top: 0;
width: 100%;
z-index: 9999999;
}
@media screen and (max-width: 768px) {
.c-bread {
padding-top: 13px;
padding-right: 15px;
padding-left: 15px;
}
}
@media screen and (min-width: 769px) {
.c-bread {
padding-top: 20px;
}
}
.c-bread__list {
display: flex;
justify-content: flex-end;
}
.c-bread__item {
list-style: none;
font-size: 11px;
letter-spacing: 0.05em;
color: #898989;
display: flex;
}
.c-bread__link {
font-weight: bold;
color: #898989;
text-decoration: none;
display: flex;
}
@media screen and (min-width: 769px) {
.c-bread__link:hover {
opacity: 0.7;
}
}
@media screen and (max-width: 768px) {
.c-page_head {
padding-top: 100px;
}
}
@media screen and (min-width: 769px) {
.c-page_head {
padding-top: 150px;
}
}
.c-page_head__lead {
text-align: center;
letter-spacing: 0.08em;
}
@media screen and (max-width: 768px) {
.c-page_head__lead {
font-size: 13px;
line-height: calc(30/13);
margin-top: 45px;
}
}
@media screen and (min-width: 769px) {
.c-page_head__lead {
font-size: 16px;
line-height: calc(38/16);
margin-top: 55px;
}
}
@media screen and (max-width: 768px) {
.c-pager {
padding-top: 60px;
}
}
@media screen and (min-width: 769px) {
.c-pager {
padding-top: 180px;
}
}
@media screen and (max-width: 768px) {
.c-pager--quality {
padding-top: 120px;
}
}
.c-pager--bgwhite {
background-color: #fff;
}
.c-pager__row {
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #DCDDDD;
}
@media screen and (max-width: 768px) {
.c-pager__row {
padding: 15px 15px 80px;
}
}
@media screen and (min-width: 769px) {
.c-pager__row {
padding: 35px 0 170px;
}
}
@media screen and (max-width: 768px) {
.c-pager--quality .c-pager__row {
padding-bottom: 60px;
}
}
@media screen and (min-width: 769px) {
.c-pager--quality .c-pager__row {
padding-bottom: 65px;
}
}
.c-pager__item {
font-family: "Philosopher", sans-serif;
letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
.c-pager__item {
font-size: 16px;
}
}
@media screen and (min-width: 769px) {
.c-pager__item {
font-size: 19px;
}
}
.c-pager__link {
color: #898989;
text-decoration: none;
display: flex;
align-items: center;
}
@media screen and (max-width: 768px) {
.c-pager__link svg {
width: 28px;
}
}
@media screen and (min-width: 769px) {
.c-pager__link:hover {
opacity: 0.7;
}
}
@media screen and (max-width: 768px) {
.c-pager__link--nolink {
opacity: 0;
}
}
@media screen and (min-width: 769px) {
.c-pager__link--nolink {
opacity: 0;
}
}
@media screen and (max-width: 768px) {
.c-pager__link--nolink:hover {
opacity: 0;
}
}
@media screen and (min-width: 769px) {
.c-pager__link--nolink:hover {
opacity: 0;
}
}
.c-pager__bars {
position: relative;
}
@media screen and (max-width: 768px) {
.c-pager__bars {
width: 28px;
height: 9px;
margin-right: 10px;
}
}
@media screen and (min-width: 769px) {
.c-pager__bars {
width: 28px;
height: 9px;
margin-right: 10px;
}
}
.c-pager__bars::before, .c-pager__bars::after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 1px;
left: 0;
background-color: #898989;
}
.c-pager__bars::before {
top: 0;
}
.c-pager__bars::after {
bottom: 0;
}
.index-hero {
background-color: #000;
position: relative;
}
.index-hero__slider {
position: relative;
z-index: 1;
}
.index-hero__item {
position: relative;
}
.index-hero__item::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 2;
}
.index-hero__figurearea {
overflow: hidden;
height: 150vh;
}
.index-hero__figure {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
transform: scale(1);
will-change: transform;
height: 150vh;
}
.index-hero__figure.is-transition {
transition-duration: 14s;
transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
}
.index-hero__figure img {
display: none;
}
.index-hero__item.is-fadein .index-hero__figure {
transform: scale(1.2);
}
@keyframes scrollbar {
0% {
height: 0;
}
45% {
height: 100%;
}
55% {
height: 100%;
top: 0;
}
100% {
height: 0;
top: 100%;
}
}
#index-hero-pager-area {
position: absolute;
z-index: 9999999;
z-index: 2;
}
@media screen and (max-width: 768px) {
#index-hero-pager-area {
left: 20px;
bottom: 20px;
}
}
@media screen and (min-width: 769px) {
#index-hero-pager-area {
left: 50px;
bottom: 40px;
}
}
#index-hero-pager-area #index-hero-pager-fixed {
position: fixed;
z-index: 1;
}
@media screen and (max-width: 768px) {
#index-hero-pager-area #index-hero-pager-fixed {
left: 20px;
bottom: 20px;
}
}
@media screen and (min-width: 769px) {
#index-hero-pager-area #index-hero-pager-fixed {
left: 50px;
bottom: 40px;
}
}
#index-hero-pager-area .bx-wrapper {
position: relative;
}
@media screen and (min-width: 769px) {
#index-hero-pager-area .bx-viewport {
overflow: visible !important;
}
}
#index-hero-pager-area .bx-pager {
display: flex;
align-items: center;
justify-content: center;
}
#index-hero-pager-area .bx-pager.is-fixed {
position: fixed;
}
@media screen and (max-width: 768px) {
#index-hero-pager-area .bx-pager.is-fixed {
left: 20px;
bottom: 20px;
}
}
@media screen and (min-width: 769px) {
#index-hero-pager-area .bx-pager.is-fixed {
left: 50px;
bottom: 40px;
}
}
#index-hero-pager-area .bx-pager-item {
display: flex;
align-items: center;
height: 3px;
}
@media screen and (max-width: 768px) {
#index-hero-pager-area .bx-pager-item {
margin: 0 3px;
}
}
@media screen and (min-width: 769px) {
#index-hero-pager-area .bx-pager-item {
margin: 0 8px;
}
}
#index-hero-pager-area .bx-pager-link {
display: block;
text-indent: -999999px;
position: relative;
height: 3px;
}
@media screen and (max-width: 768px) {
#index-hero-pager-area .bx-pager-link {
width: 38px;
}
}
@media screen and (min-width: 769px) {
#index-hero-pager-area .bx-pager-link {
width: 70px;
}
}
#index-hero-pager-area .bx-pager-link::after {
content: "";
display: block;
position: absolute;
top: 50%;
left: 0;
width: 100%;
height: 3px;
background-color: rgba(137, 137, 137, 0.35);
transition-duration: 0.5s;
transform: translate(0, -50%) scale(1, 0.333);
will-change: transform;
}
@media screen and (min-width: 769px) {
#index-hero-pager-area .bx-pager-link:hover::after {
transform: translate(0, -50%) scale(1, 1);
}
}
#index-hero-pager-area .bx-pager-link.active::after {
transform: translate(0, -50%) scale(1, 1);
background-color: #c6aa80;
}
.index-main {
background: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/body-bg@2x.jpg) repeat top left;
background-size: 500px;
position: relative;
z-index: 2;
}
@media screen and (max-width: 768px) {
.index-main {
padding-top: 90px;
padding-bottom: 120px;
}
}
@media screen and (min-width: 769px) {
.index-main {
padding-top: 160px;
padding-bottom: 160px;
}
}
.index-main__head {
position: relative;
z-index: 2;
}
.index-main__inner {
position: relative;
}
@media screen and (max-width: 768px) {
.index-main__inner {
margin-top: 45px;
}
}
@media screen and (min-width: 769px) {
.index-main__inner {
margin-top: 95px;
}
}
.index-main__inner::before {
content: "";
display: block;
background-image: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/bg-logo@2x.png);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
position: absolute;
left: 50%;
transform: translateX(-50%);
}
@media screen and (max-width: 768px) {
.index-main__inner::before {
width: 278px;
height: 322px;
top: 0px;
}
}
@media screen and (min-width: 769px) {
.index-main__inner::before {
width: 409px;
height: 472px;
top: -45px;
}
}
.index-main__txt {
position: relative;
z-index: 2;
}
@media screen and (max-width: 768px) {
.index-main__txt {
font-family: vdl-v7mincho, sans-serif;
font-size: 13px;
letter-spacing: 0.05em;
line-height: calc(30/13);
color: #fff;
}
}
.index-main__txt_image {
position: relative;
z-index: 2;
}
@media screen and (min-width: 769px) {
.index-main__txt_image {
text-align: center;
}
}
.index-main_fixed_position {
position: fixed;
left: 0;
z-index: 0;
width: 100%;
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.index-main_fixed_position {
top: calc(50% + 37px);
}
}
@media screen and (min-width: 769px) {
.index-main_fixed_position {
top: calc(50% + 45px);
min-width: 1176px;
margin: 0 auto;
}
}
.index-main_copy.is-fixed {
position: fixed;
left: 0;
z-index: 2;
width: 100%;
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.index-main_copy.is-fixed {
top: calc(50% + 37px);
}
}
@media screen and (min-width: 769px) {
.index-main_copy.is-fixed {
top: calc(50% + 45px);
min-width: 1176px;
margin: 0 auto;
}
}
.index-main_copy__en {
font-family: "Philosopher", sans-serif;
color: #C6AA80;
text-align: center;
letter-spacing: 0.15em;
}
@media screen and (max-width: 768px) {
.index-main_copy__en {
font-size: 13px;
line-height: calc(20/13);
}
}
@media screen and (min-width: 769px) {
.index-main_copy__en {
font-size: 18px;
}
}
.index-main_copy__ttl {
text-align: center;
}
@media screen and (max-width: 768px) {
.index-main_copy__ttl {
margin: 12px auto 0;
width: 306px;
}
}
@media screen and (min-width: 769px) {
.index-main_copy__ttl {
margin-top: 30px;
}
}
.index-section {
position: relative;
z-index: 2;
}
.index-section--bg_noise {
background: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/body-bg@2x.jpg) repeat top left;
background-size: 500px;
}
@media screen and (max-width: 768px) {
.index-section__head {
padding-top: 90px;
padding-bottom: 90px;
}
}
@media screen and (min-width: 769px) {
.index-section__head {
padding-top: 200px;
padding-bottom: 180px;
}
}
@media screen and (min-width: 769px) {
.index-section__head--haslead {
padding-bottom: 80px;
}
}
@media screen and (max-width: 768px) {
.index-section__lead {
display: none;
}
}
@media screen and (min-width: 769px) {
.index-section__lead {
font-size: 16px;
letter-spacing: 0.08em;
line-height: calc(38/16);
text-align: center;
margin-top: 50px;
}
}
.index-quality {
position: relative;
}
@media screen and (max-width: 768px) {
.index-quality__bgarea {
overflow: hidden;
}
}
@media screen and (min-width: 769px) {
.index-quality__bgarea {
overflow: hidden;
}
}
.index-quality__bg {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
position: relative;
}
@media screen and (max-width: 768px) {
.index-quality__bg {
height: 480px;
}
}
@media screen and (min-width: 769px) {
.index-quality__bg {
height: 966px;
}
}
.index-quality__bg img {
display: none;
}
@media screen and (max-width: 768px) {
.index-quality__bg::before {
content: "";
display: block;
width: 100%;
height: 101%;
position: absolute;
top: 0;
left: 0;
backdrop-filter: blur(15px);
}
}
.index-quality__main {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
}
@media screen and (min-width: 769px) {
.index-quality__main {
justify-content: center;
}
}
@media screen and (max-width: 768px) {
.index-quality__board {
padding: 0 50px;
}
}
@media screen and (min-width: 769px) {
.index-quality__board {
width: 738px;
padding: 130px 0 140px;
backdrop-filter: blur(15px);
}
}
.index-quality__lead {
letter-spacing: 0.08em;
}
@media screen and (max-width: 768px) {
.index-quality__lead {
font-size: 13px;
line-height: calc(30/13);
text-align: justify;
}
}
@media screen and (min-width: 769px) {
.index-quality__lead {
font-size: 16px;
line-height: calc(38/16);
text-align: center;
}
}
@media screen and (max-width: 768px) {
.index-quality__more {
margin-top: 50px;
}
}
@media screen and (min-width: 769px) {
.index-quality__more {
margin-top: 60px;
}
}
@media screen and (max-width: 768px) {
.index-works {
padding-bottom: 90px;
}
}
@media screen and (min-width: 769px) {
.index-works {
padding-bottom: 160px;
}
}
@media screen and (max-width: 768px) {
.index-works__inner {
padding-bottom: 105px;
}
}
@media screen and (min-width: 769px) {
.index-works__inner {
margin-right: -34px;
margin-left: -34px;
padding-bottom: 52px;
}
}
.index-works__slider {
position: relative;
}
@media screen and (min-width: 769px) {
.index-works__item {
padding: 0 34px;
}
}
@media screen and (max-width: 768px) {
.index-works__more {
margin-top: 60px;
padding: 0 50px;
}
}
@media screen and (min-width: 769px) {
.index-works__more {
margin-top: 100px;
}
}
.index-works .js-slick-prev,
.index-works .js-slick-next {
cursor: pointer;
z-index: 2;
display: flex;
align-items: center;
height: 20px;
position: absolute;
}
@media screen and (max-width: 768px) {
.index-works .js-slick-prev,
.index-works .js-slick-next {
bottom: -60px;
}
}
@media screen and (min-width: 769px) {
.index-works .js-slick-prev,
.index-works .js-slick-next {
top: 50%;
transform: translateY(-50%);
}
}
.index-works .js-slick-prev line,
.index-works .js-slick-next line {
stroke: #C6AA80;
}
.index-works .js-slick-prev path,
.index-works .js-slick-next path {
fill: #C6AA80;
}
@media screen and (max-width: 768px) {
.index-works .js-slick-prev {
right: 50%;
transform: translateX(-20px);
}
}
@media screen and (min-width: 769px) {
.index-works .js-slick-prev {
left: -14px;
right: inherit;
}
}
@media screen and (max-width: 768px) {
.index-works .js-slick-next {
left: 50%;
transform: translateX(20px);
}
}
@media screen and (min-width: 769px) {
.index-works .js-slick-next {
left: inherit;
right: -14px;
}
}
.index-works .js-slick-dots {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
left: 50%;
transform: translateX(-50%);
width: 100%;
}
@media screen and (max-width: 768px) {
.index-works .js-slick-dots {
bottom: -105px;
}
}
@media screen and (min-width: 769px) {
.index-works .js-slick-dots {
bottom: -52px;
}
}
.index-works .js-slick-dots li {
list-style: none;
position: relative;
height: 3px;
width: auto;
opacity: 1;
display: flex;
align-items: center;
}
@media screen and (max-width: 768px) {
.index-works .js-slick-dots li {
flex-basis: 38px;
margin: 0 3px;
}
}
@media screen and (min-width: 769px) {
.index-works .js-slick-dots li {
flex-basis: 70px;
margin: 0 8px;
}
}
.index-works .js-slick-dots button {
flex-grow: 1;
text-indent: -999999px;
border: none;
height: 3px;
background-color: rgba(137, 137, 137, 0.35);
transition-duration: 0.5s;
transform: scale(1, 0.333);
will-change: transform;
cursor: pointer;
outline: none;
}
.index-works .js-slick-dots li.slick-active button {
transform: scale(1, 1);
background-color: #c6aa80;
}
.index-works .slick-list {
overflow: visible;
z-index: 1;
}
.index-works_article {
overflow: hidden;
}
.index-works_article__link {
display: block;
text-decoration: none;
}
@media screen and (min-width: 769px) {
.index-works_article__link {
position: relative;
}
}
@media screen and (min-width: 769px) {
.index-works_article__bgarea {
background-color: #000;
overflow: hidden;
}
}
.index-works_article__bg {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
will-change: transform;
transition-duration: 0.7s;
transform: scale(1);
opacity: 1;
}
@media screen and (max-width: 768px) {
.index-works_article__bg {
padding-bottom: 61.866%;
}
}
@media screen and (min-width: 769px) {
.index-works_article__bg {
height: 696px;
}
}
.index-works_article__bg img {
display: none;
}
@media screen and (min-width: 769px) {
.index-works_article__link:hover .index-works_article__bg {
transform: scale(1.02);
opacity: 0.5;
}
}
@media screen and (max-width: 768px) {
.index-works_article__main {
margin-top: 20px;
}
}
@media screen and (min-width: 769px) {
.index-works_article__main {
position: absolute;
bottom: 30px;
left: 50px;
}
}
.index-works_info__head {
display: flex;
}
.index-works_info__category {
border: 1px solid #C6AA80;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
letter-spacing: 0.15em;
color: #C6AA80;
}
@media screen and (max-width: 768px) {
.index-works_info__category {
height: 19px;
font-size: 11px;
padding: 0 7px;
margin-right: 10px;
}
}
@media screen and (min-width: 769px) {
.index-works_info__category {
height: 23px;
font-size: 12px;
padding: 0 10px;
margin-right: 15px;
}
}
.index-works_info__tags {
display: flex;
flex-wrap: wrap;
}
@media screen and (min-width: 769px) {
.index-works_info__tags {
padding-top: 3px;
}
}
.index-works_info__tag {
list-style: none;
color: #898989;
letter-spacing: 0;
margin-right: 1em;
line-height: calc(17/11);
}
@media screen and (max-width: 768px) {
.index-works_info__tag {
font-size: 11px;
}
}
@media screen and (min-width: 769px) {
.index-works_info__tag {
font-size: 12px;
}
}
@media screen and (max-width: 768px) {
.index-works_info__body {
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.index-works_info__body {
margin-top: 15px;
}
}
.index-works_info__ttl {
font-weight: 500;
letter-spacing: 0.15em;
line-height: calc(27/15);
}
@media screen and (max-width: 768px) {
.index-works_info__ttl {
font-size: 15px;
color: #212121;
}
}
@media screen and (min-width: 769px) {
.index-works_info__ttl {
font-size: 22px;
color: #fff;
transition-duration: 0.5s;
}
}
@media screen and (min-width: 769px) {
.index-works_article__link:hover .index-works_info__ttl {
opacity: 0.5;
}
}
@media screen and (max-width: 768px) {
.index-architects {
padding-bottom: 90px;
}
}
@media screen and (min-width: 769px) {
.index-architects {
padding-bottom: 180px;
}
}
@media screen and (max-width: 768px) {
.index-architects__main {
padding-bottom: 105px;
width: 176px;
margin: 0 auto;
}
}
@media screen and (min-width: 769px) {
.index-architects__main {
padding-bottom: 52px;
}
}
@media screen and (max-width: 768px) {
.index-architects__more {
margin-top: 60px;
padding: 0 50px;
}
}
@media screen and (min-width: 769px) {
.index-architects__more {
margin-top: 80px;
}
}
.index-architects .js-slick-prev,
.index-architects .js-slick-next {
cursor: pointer;
z-index: 2;
display: flex;
align-items: center;
height: 20px;
position: absolute;
}
@media screen and (max-width: 768px) {
.index-architects .js-slick-prev,
.index-architects .js-slick-next {
bottom: -60px;
}
}
@media screen and (min-width: 769px) {
.index-architects .js-slick-prev,
.index-architects .js-slick-next {
top: 50%;
transform: translateY(-50%);
display: none !important;
}
}
.index-architects .js-slick-prev line,
.index-architects .js-slick-next line {
stroke: #C6AA80;
}
.index-architects .js-slick-prev path,
.index-architects .js-slick-next path {
fill: #C6AA80;
}
@media screen and (max-width: 768px) {
.index-architects .js-slick-prev {
right: 50%;
transform: translateX(-20px);
}
}
@media screen and (min-width: 769px) {
.index-architects .js-slick-prev {
left: -14px;
right: inherit;
}
}
@media screen and (max-width: 768px) {
.index-architects .js-slick-next {
left: 50%;
transform: translateX(20px);
}
}
@media screen and (min-width: 769px) {
.index-architects .js-slick-next {
left: inherit;
right: -14px;
}
}
.index-architects .js-slick-dots {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
left: 50%;
transform: translateX(-50%);
width: 100%;
}
@media screen and (max-width: 768px) {
.index-architects .js-slick-dots {
bottom: -105px;
width: 100vw;
}
}
@media screen and (min-width: 769px) {
.index-architects .js-slick-dots {
bottom: -52px;
}
}
.index-architects .js-slick-dots li {
list-style: none;
position: relative;
height: 3px;
width: auto;
opacity: 1;
display: flex;
align-items: center;
}
@media screen and (max-width: 768px) {
.index-architects .js-slick-dots li {
flex-basis: 38px;
margin: 0 3px;
}
}
@media screen and (min-width: 769px) {
.index-architects .js-slick-dots li {
flex-basis: 70px;
margin: 0 8px;
}
}
.index-architects .js-slick-dots button {
flex-grow: 1;
text-indent: -999999px;
border: none;
height: 3px;
background-color: rgba(137, 137, 137, 0.35);
transition-duration: 0.5s;
transform: scale(1, 0.333);
will-change: transform;
cursor: pointer;
outline: none;
}
.index-architects .js-slick-dots li.slick-active button {
transform: scale(1, 1);
background-color: #c6aa80;
}
.index-architects .slick-list {
overflow: visible;
z-index: 1;
}
.index-architects_slider {
position: relative;
}
@keyframes loopSolider {
0% {
transform: translateX(200%);
}
to {
transform: translateX(-100%);
}
}
@keyframes loopSolider2 {
0% {
transform: translateX(100%);
}
to {
transform: translateX(-200%);
}
}
@keyframes loopSolider3 {
0% {
transform: translateX(0%);
}
to {
transform: translateX(-300%);
}
}
@media screen and (max-width: 768px) {
.index-architects_article {
width: 176px;
padding: 0 8px;
}
}
@media screen and (min-width: 769px) {
.index-architects_article {
width: 232px;
padding: 0 17px;
}
}
.index-architects_article__link {
text-decoration: none;
}
@media screen and (min-width: 769px) {
.index-architects_article__figurearea {
overflow: hidden;
}
}
@media screen and (min-width: 769px) {
.index-architects_article__figure {
transition-duration: 0.5s;
will-change: transform;
transform: scale(1);
transform-origin: bottom center;
}
}
@media screen and (min-width: 769px) {
.index-architects_article__link:hover .index-architects_article__figure {
transform: scale(1.08);
}
}
.index-architects_article__main {
text-align: center;
}
@media screen and (max-width: 768px) {
.index-architects_article__main {
padding-top: 10px;
}
}
@media screen and (min-width: 769px) {
.index-architects_article__main {
padding-top: 20px;
transition-duration: 0.5s;
opacity: 1;
}
}
@media screen and (min-width: 769px) {
.index-architects_article__link:hover .index-architects_article__main {
opacity: 0.5;
}
}
.index-architects_article__position {
letter-spacing: 0.05em;
color: #DCDDDD;
}
@media screen and (max-width: 768px) {
.index-architects_article__position {
font-size: 11px;
}
}
@media screen and (min-width: 769px) {
.index-architects_article__position {
font-size: 13px;
}
}
.index-architects_article__name {
font-weight: bold;
letter-spacing: 0.05em;
color: #DCDDDD;
}
@media screen and (max-width: 768px) {
.index-architects_article__name {
font-size: 15px;
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.index-architects_article__name {
font-size: 18px;
margin-top: 15px;
}
}
.index-architects_article__en {
font-family: "Philosopher", sans-serif;
letter-spacing: 0.08em;
color: #898989;
}
@media screen and (max-width: 768px) {
.index-architects_article__en {
font-size: 10px;
margin-top: 5px;
}
}
@media screen and (min-width: 769px) {
.index-architects_article__en {
font-size: 12px;
margin-top: 7px;
}
}
@media screen and (max-width: 768px) {
.index-project {
padding-bottom: 90px;
}
}
@media screen and (min-width: 769px) {
.index-project {
padding-bottom: 180px;
}
}
@media screen and (max-width: 768px) {
.index-project--archive {
margin-top: 70px;
}
}
@media screen and (min-width: 769px) {
.index-project--archive {
margin-top: 110px;
}
}
@media screen and (min-width: 769px) {
.index-project__row {
display: flex;
margin-right: -50px;
flex-wrap: wrap;
margin-top: -50px;
}
}
@media screen and (max-width: 768px) {
.index-project .alm-reveal {
margin-top: 30px;
}
}
@media screen and (min-width: 769px) {
.index-project .alm-reveal {
margin-right: -50px;
display: flex;
flex-wrap: wrap;
}
}
@media screen and (max-width: 768px) {
.index-project__item {
margin-top: 30px;
}
}
@media screen and (min-width: 769px) {
.index-project__item {
padding-right: 50px;
margin-top: 50px;
}
}
@media screen and (min-width: 769px) {
.index-project__item--full {
flex-basis: 100%;
max-width: 100%;
min-width: 100%;
}
}
@media screen and (min-width: 769px) {
.index-project__item--half {
flex-basis: 50%;
max-width: 50%;
min-width: 50%;
}
}
@media screen and (max-width: 768px) {
.index-project__item:first-child {
margin-top: 0;
}
}
@media screen and (max-width: 768px) {
.index-project__more {
margin-top: 40px;
padding: 0 50px;
}
}
@media screen and (min-width: 769px) {
.index-project__more {
margin-top: 75px;
}
}
@media screen and (max-width: 768px) {
.index-project .alm-btn-wrap {
margin-top: 40px;
}
}
@media screen and (min-width: 769px) {
.index-project .alm-btn-wrap {
margin-top: 80px;
}
}
.index-project_article--full {
border: 1px solid #DFDFDF;
}
.index-project_article__link {
display: block;
color: #212121;
text-decoration: none;
}
.index-project_article--full .index-project_article__link {
background-color: #fff;
}
@media screen and (min-width: 769px) {
.index-project_article--full .index-project_article__link {
display: flex;
align-items: center;
}
}
@media screen and (min-width: 769px) {
.index-project_article__figurearea {
background-color: #000;
overflow: hidden;
}
}
@media screen and (min-width: 769px) {
.index-project_article--full .index-project_article__figurearea {
flex-basis: 50%;
max-width: 50%;
min-width: 50%;
}
}
@media screen and (min-width: 769px) {
.index-project_article__figure {
transition-duration: 0.5s;
will-change: transform;
transform: scale(1);
}
}
@media screen and (min-width: 769px) {
.index-project_article__link:hover .index-project_article__figure {
transform: scale(1.03);
opacity: 0.95;
}
}
@media screen and (max-width: 768px) {
.index-project_article--half .index-project_article__main {
padding-top: 15px;
}
}
@media screen and (min-width: 769px) {
.index-project_article--half .index-project_article__main {
padding-top: 20px;
}
}
@media screen and (max-width: 768px) {
.index-project_article--full .index-project_article__main {
padding: 20px 20px 30px;
}
}
@media screen and (min-width: 769px) {
.index-project_article--full .index-project_article__main {
flex-basis: 50%;
max-width: 50%;
min-width: 50%;
padding: 10px 70px 10px 50px;
}
}
.index-project_article__en {
font-family: "Philosopher", sans-serif;
letter-spacing: 0.05em;
color: #C6AA80;
}
@media screen and (max-width: 768px) {
.index-project_article__en {
font-size: 12px;
}
}
@media screen and (min-width: 769px) {
.index-project_article__en {
font-size: 15px;
}
}
.index-project_article__ttl {
letter-spacing: 0.05em;
font-weight: 500;
}
@media screen and (max-width: 768px) {
.index-project_article__ttl {
font-size: 15px;
line-height: calc(23/15);
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.index-project_article__ttl {
font-size: 20px;
line-height: calc(31/20);
margin-top: 15px;
transition-duration: 0.5s;
opacity: 1;
}
}
@media screen and (min-width: 769px) {
.index-project_article__link:hover .index-project_article__ttl {
opacity: 0.5;
}
}
.index-project_article__txt {
letter-spacing: 0.08em;
text-align: justify;
}
@media screen and (max-width: 768px) {
.index-project_article__txt {
display: none;
}
}
@media screen and (min-width: 769px) {
.index-project_article__txt {
font-size: 14px;
line-height: calc(25.4/14);
margin-top: 35px;
}
}
.index-news {
background-color: #fff;
position: relative;
z-index: 2;
}
@media screen and (max-width: 768px) {
.index-news {
padding-top: 60px;
padding-bottom: 60px;
}
}
@media screen and (min-width: 769px) {
.index-news {
padding-top: 100px;
padding-bottom: 120px;
}
}
.index-news__en {
font-family: "Philosopher", sans-serif;
color: #C6AA80;
letter-spacing: 0.15em;
}
@media screen and (max-width: 768px) {
.index-news__en {
font-size: 13px;
}
}
@media screen and (min-width: 769px) {
.index-news__en {
font-size: 15px;
}
}
.index-news__ttl {
font-family: vdl-v7mincho, sans-serif;
letter-spacing: 0.3em;
font-weight: 500;
}
@media screen and (max-width: 768px) {
.index-news__ttl {
font-size: 18px;
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.index-news__ttl {
font-size: 25px;
margin-top: 10px;
}
}
@media screen and (max-width: 768px) {
.index-news__body {
margin-top: 30px;
}
}
@media screen and (min-width: 769px) {
.index-news__body {
margin-top: 55px;
}
}
@media screen and (max-width: 768px) {
.index-news__table {
display: block;
}
}
@media screen and (min-width: 769px) {
.index-news__table {
width: 100%;
border-top: 1px solid #DFDFDF;
}
}
@media screen and (max-width: 768px) {
.index-news__table tbody {
display: block;
}
}
@media screen and (max-width: 768px) {
.index-news__tr {
display: block;
border-bottom: 1px solid #DFDFDF;
padding-top: 15px;
padding-bottom: 15px;
}
}
@media screen and (max-width: 768px) {
.index-news__tr:first-child {
padding-top: 0;
}
}
.index-news__th, .index-news__td {
text-align: left;
}
@media screen and (max-width: 768px) {
.index-news__th, .index-news__td {
display: block;
}
}
@media screen and (min-width: 769px) {
.index-news__th, .index-news__td {
padding: 25px 0;
vertical-align: top;
border-bottom: 1px solid #DFDFDF;
}
}
.index-news__th {
font-family: "Philosopher", sans-serif;
color: rgba(137, 137, 137, 0.7);
letter-spacing: 0.05em;
font-weight: normal;
}
@media screen and (max-width: 768px) {
.index-news__th {
font-size: 11px;
}
}
@media screen and (min-width: 769px) {
.index-news__th {
font-size: 15px;
padding-right: 15px;
width: 230px;
}
}
.index-news__td {
letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
.index-news__td {
margin-top: 10px;
font-size: 14px;
line-height: calc(22.4/14);
}
}
@media screen and (min-width: 769px) {
.index-news__td {
font-size: 15px;
line-height: calc(30/16);
}
}
.index-news__info {
display: flex;
align-items: center;
}
@media screen and (min-width: 769px) {
.index-news__info {
padding-top: 4px;
}
}
.index-news__date {
position: relative;
}
@media screen and (max-width: 768px) {
.index-news__date {
padding-right: 10px;
margin-right: 10px;
}
}
@media screen and (min-width: 769px) {
.index-news__date {
padding-right: 15px;
margin-right: 15px;
}
}
.index-news__date::after {
content: "";
display: block;
width: 1px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
background-color: #DFDFDF;
}
@media screen and (max-width: 768px) {
.index-news__date::after {
height: 11px;
}
}
@media screen and (min-width: 769px) {
.index-news__date::after {
height: 12px;
}
}
.index-news__link {
color: #212121;
text-decoration: none;
}
@media screen and (min-width: 769px) {
.index-news__link:hover {
opacity: 0.5;
}
}
@media screen and (max-width: 768px) {
.works-category_nav_area {
margin-top: 85px;
}
}
@media screen and (min-width: 769px) {
.works-category_nav_area {
margin-top: 92px;
}
}
.works-category_nav {
background-color: rgba(255, 255, 255, 0);
z-index: 1;
transition-duration: 0.5s;
}
@media screen and (min-width: 769px) {
.works-category_nav {
padding-top: 23px;
}
}
.works-category_nav.is-fixed {
position: fixed;
width: 100%;
background-color: rgba(255, 255, 255, 0.95);
}
@media screen and (max-width: 768px) {
.works-category_nav.is-fixed {
top: 74px;
}
}
@media screen and (min-width: 769px) {
.works-category_nav.is-fixed {
top: 90px;
min-width: 1176px;
margin: 0 auto;
}
}
.works-category_nav__contents {
border-bottom: 1px solid #DCDDDD;
}
@media screen and (min-width: 769px) {
.works-category_nav__contents {
display: flex;
justify-content: space-between;
min-height: 31px;
}
}
@media screen and (max-width: 768px) {
.works-category_nav__head {
border-bottom: 1px solid #DCDDDD;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
transition-duration: 0.7s;
}
}
@media screen and (max-width: 768px) {
.works-category_nav.is-fixed .works-category_nav__head {
height: 40px;
}
}
.works-category_nav__ttl {
font-weight: 500;
font-size: 13px;
letter-spacing: 0;
}
@media screen and (max-width: 768px) {
.works-category_nav__ttl {
text-align: center;
}
}
.works-category_nav__list {
display: flex;
}
@media screen and (max-width: 768px) {
.works-category_nav__list {
justify-content: center;
}
}
.works-category_nav__item {
list-style: none;
font-size: 13px;
letter-spacing: 0;
}
@media screen and (max-width: 768px) {
.works-category_nav__item {
margin: 0 10px;
}
}
@media screen and (min-width: 769px) {
.works-category_nav__item {
margin-left: 25px;
}
}
.works-category_nav__link {
display: block;
position: relative;
text-decoration: none;
color: #212121;
}
@media screen and (max-width: 768px) {
.works-category_nav__link {
height: 50px;
display: flex;
align-items: center;
}
}
@media screen and (min-width: 769px) {
.works-category_nav__link {
height: 30px;
}
}
@media screen and (max-width: 768px) {
.works-category_nav.is-fixed .works-category_nav__link {
height: 40px;
}
}
.works-category_nav__link::before {
content: "";
display: block;
position: absolute;
left: 0;
bottom: -1px;
width: 100%;
height: 0px;
background-color: #C6AA80;
transition-duration: 0.5s;
}
.works-category_nav__link:hover, .works-category_nav__link.is-current {
color: #C6AA80;
font-weight: bold;
}
@media screen and (min-width: 769px) {
.works-category_nav__link:hover, .works-category_nav__link.is-current {
opacity: 1;
}
}
.works-category_nav__link:hover::before, .works-category_nav__link.is-current::before {
height: 3px;
}
@media screen and (max-width: 768px) {
.works-archive {
margin-top: 25px;
padding-bottom: 175px;
}
}
@media screen and (min-width: 769px) {
.works-archive {
margin-top: 100px;
padding-bottom: 175px;
}
}
@media screen and (min-width: 769px) {
.works-archive__container {
margin-top: -80px;
}
}
@media screen and (max-width: 768px) {
.works-archive .alm-reveal {
margin-top: 40px;
}
}
@media screen and (min-width: 769px) {
.works-archive .alm-reveal {
margin-right: -66px;
display: flex;
flex-wrap: wrap;
}
}
@media screen and (max-width: 768px) {
.works-archive .alm-reveal:first-child {
margin-top: 0;
}
}
@media screen and (max-width: 768px) {
.works-archive__item {
margin-top: 40px;
}
}
@media screen and (min-width: 769px) {
.works-archive__item {
margin-top: 80px;
padding-right: 66px;
flex-basis: 33.333%;
max-width: 33.333%;
min-width: 33.333%;
}
}
@media screen and (max-width: 768px) {
.works-archive__item:first-child {
margin-top: 0;
}
}
@media screen and (max-width: 768px) {
.works-archive .alm-btn-wrap {
margin-top: 40px;
}
}
@media screen and (min-width: 769px) {
.works-archive .alm-btn-wrap {
margin-top: 80px;
}
}
.works-article__figurearea {
overflow: hidden;
background-color: #000;
}
.works-article__figure {
will-change: transform;
transition-duration: 0.5s;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
padding-bottom: 62.26415094%;
transform: scale(1);
opacity: 1;
}
.works-article__figure img {
display: none;
}
@media screen and (min-width: 769px) {
.works-article__link:hover .works-article__figure {
transform: scale(1.02);
opacity: 0.5;
}
}
@media screen and (max-width: 768px) {
.works-article__body {
margin-top: 15px;
}
}
@media screen and (min-width: 769px) {
.works-article__body {
margin-top: 20px;
}
}
.works-article__info {
display: flex;
}
.works-article__types {
display: flex;
flex-shrink: 0;
}
@media screen and (max-width: 768px) {
.works-article__types {
margin-right: 10px;
}
}
@media screen and (min-width: 769px) {
.works-article__types {
margin-right: 15px;
}
}
.works-article__type {
list-style: none;
font-family: vdl-v7mincho, sans-serif;
letter-spacing: 0.15em;
margin-left: 10px;
}
@media screen and (max-width: 768px) {
.works-article__type {
font-size: 11px;
}
}
@media screen and (min-width: 769px) {
.works-article__type {
font-size: 12px;
}
}
.works-article__type:first-child {
margin-left: 0;
}
.works-article__type_link {
display: flex;
border: 1px solid #C6AA80;
color: #C6AA80;
text-decoration: none;
align-items: center;
}
@media screen and (max-width: 768px) {
.works-article__type_link {
height: 19px;
padding: 0 7px;
}
}
@media screen and (min-width: 769px) {
.works-article__type_link {
height: 20px;
padding: 0 8px;
}
}
@media screen and (min-width: 769px) {
.works-article__type_link:hover {
background-color: #C6AA80;
color: #DCDDDD;
}
}
.works-article__tags {
display: flex;
flex-wrap: wrap;
}
@media screen and (min-width: 769px) {
.works-article__tags {
padding-top: 0px;
}
}
.works-article__tag {
letter-spacing: 0;
list-style: none;
margin-right: 1em;
line-height: calc(17/11);
}
@media screen and (max-width: 768px) {
.works-article__tag {
font-size: 11px;
}
}
@media screen and (min-width: 769px) {
.works-article__tag {
font-size: 12px;
}
}
.works-article__tag_link {
text-decoration: none;
color: #898989;
}
@media screen and (min-width: 769px) {
.works-article__tag_link:hover {
opacity: 0.7;
}
}
.works-article__link {
text-decoration: none;
color: #212121;
}
.works-article__ttl {
font-weight: normal;
transition-duration: 0.5s;
}
@media screen and (max-width: 768px) {
.works-article__ttl {
font-size: 15px;
margin-top: 15px;
}
}
@media screen and (min-width: 769px) {
.works-article__ttl {
font-size: 20px;
margin-top: 15px;
opacity: 1;
}
}
@media screen and (min-width: 769px) {
.works-article__link:hover .works-article__ttl {
opacity: 0.7;
}
}
@media screen and (max-width: 768px) {
.works-single {
padding: 50px 0 0;
}
}
@media screen and (min-width: 769px) {
.works-single {
padding: 100px 0 0;
}
}
.works-single__head {
border-bottom: 1px solid #DCDDDD;
}
@media screen and (max-width: 768px) {
.works-single__head {
padding-bottom: 30px;
}
}
@media screen and (min-width: 769px) {
.works-single__head {
padding-bottom: 60px;
}
}
@media screen and (max-width: 768px) {
.works-single__body {
padding-top: 60px;
}
}
@media screen and (min-width: 769px) {
.works-single__body {
padding-top: 100px;
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
}
}
@media screen and (min-width: 769px) {
.works-single__images {
flex-basis: 686px;
max-width: 686px;
min-width: 686px;
}
}
@media screen and (max-width: 768px) {
.works-single__image {
margin-top: 30px;
}
}
@media screen and (min-width: 769px) {
.works-single__image {
margin-top: 60px;
}
}
@media screen and (max-width: 768px) {
.works-single__image:first-child {
margin-top: 0;
}
}
@media screen and (min-width: 769px) {
.works-single__image:first-child {
margin-top: 0;
}
}
@media screen and (max-width: 768px) {
.works-single__contents {
margin-top: 30px;
}
}
@media screen and (min-width: 769px) {
.works-single__contents {
flex-basis: 370px;
max-width: 370px;
min-width: 370px;
position: relative;
}
}
.works-single__desc {
letter-spacing: 0.04em;
}
@media screen and (max-width: 768px) {
.works-single__desc {
font-size: 13px;
line-height: calc(31/13);
}
}
@media screen and (min-width: 769px) {
.works-single__desc {
font-size: 16px;
line-height: calc(38/16);
margin-top: -0.5em;
}
}
.works-single__desc p {
margin-top: 2em;
}
.works-single__desc p:first-child {
margin-top: 0;
}
@media screen and (max-width: 768px) {
.works-single__info {
margin-top: 115px;
}
}
@media screen and (min-width: 769px) {
.works-single__info {
margin-top: 60px;
}
}
@media screen and (max-width: 768px) {
.works-single__fixed_contents {
display: none;
}
}
@media screen and (min-width: 769px) {
.works-single__fixed_contents {
padding-top: 110px;
display: none;
}
}
@media screen and (min-width: 769px) {
.works-single__fixed_contents.is-fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
min-width: 1176px;
margin: 0 auto;
}
}
@media screen and (min-width: 769px) {
.works-single__fixed_contents.is-bottom {
position: absolute;
bottom: 0;
left: 0;
}
}
@media screen and (min-width: 769px) {
.works-single__fixed_contents_inner {
max-width: 1126px;
margin: auto;
}
}
.works-single_head__info {
display: flex;
}
@media screen and (min-width: 769px) {
.works-single_head__info {
justify-content: space-between;
}
}
.works-single_head__types {
display: flex;
align-items: flex-start;
}
@media screen and (max-width: 768px) {
.works-single_head__types {
margin-right: 10px;
}
}
@media screen and (min-width: 769px) {
.works-single_head__types {
margin-right: 20px;
}
}
.works-single_head__type {
font-family: vdl-v7mincho, sans-serif;
color: #C6AA80;
letter-spacing: 0.15em;
list-style: none;
font-weight: 500;
}
@media screen and (max-width: 768px) {
.works-single_head__type {
font-size: 11px;
margin-left: 5px;
}
}
@media screen and (min-width: 769px) {
.works-single_head__type {
font-size: 12px;
margin-left: 10px;
}
}
@media screen and (max-width: 768px) {
.works-single_head__type:first-child {
margin-left: 0;
}
}
@media screen and (min-width: 769px) {
.works-single_head__type:first-child {
margin-left: 0;
}
}
.works-single_head__type_link {
border: 1px solid #C6AA80;
display: flex;
align-items: center;
justify-content: center;
color: #C6AA80;
text-decoration: none;
}
@media screen and (max-width: 768px) {
.works-single_head__type_link {
padding: 0 7px;
height: 19px;
}
}
@media screen and (min-width: 769px) {
.works-single_head__type_link {
padding: 0 8px;
height: 20px;
}
}
.works-single_head__type_link:hover {
background-color: #C6AA80;
color: #fff;
}
.works-single_head__tags {
display: flex;
flex-wrap: wrap;
margin-right: -1em;
letter-spacing: 0;
}
@media screen and (max-width: 768px) {
.works-single_head__tags {
font-size: 11px;
margin-top: -2px;
}
}
@media screen and (min-width: 769px) {
.works-single_head__tags {
font-size: 12px;
}
}
.works-single_head__tag {
padding-right: 1em;
list-style: none;
letter-spacing: 0;
line-height: calc(17/11);
}
@media screen and (max-width: 768px) {
.works-single_head__tag {
font-size: 11px;
}
}
@media screen and (min-width: 769px) {
.works-single_head__tag {
font-size: 12px;
}
}
.works-single_head__tag_link {
text-decoration: none;
color: #898989;
}
@media screen and (min-width: 769px) {
.works-single_head__tag_link:hover {
opacity: 0.7;
}
}
.works-single_head__ttl {
font-family: vdl-v7mincho, sans-serif;
font-weight: 500;
letter-spacing: 0.35em;
}
@media screen and (max-width: 768px) {
.works-single_head__ttl {
font-size: 28px;
margin-top: 30px;
}
}
@media screen and (min-width: 769px) {
.works-single_head__ttl {
font-size: 40px;
margin-top: 20px;
}
}
@media screen and (max-width: 768px) {
.works-single_section {
margin-top: 60px;
}
}
@media screen and (min-width: 769px) {
.works-single_section {
margin-top: 60px;
}
}
@media screen and (min-width: 769px) {
.works-single__fixed_contents .works-single_section { margin-top: 30px;
}
}
@media screen and (min-width: 769px) {
.works-single_section:first-child {
margin-top: 0;
}
}
@media screen and (min-width: 769px) {
.works-single__fixed_contents .works-single_section:first-child { margin-top: 30px;
}
}
.works-single_section__ttl {
color: #C6AA80;
font-family: vdl-v7mincho, sans-serif;
letter-spacing: 0.05em;
font-weight: 400;
border-bottom: 1px solid #DCDDDD;
font-size: 14px;
padding-bottom: 12px;
}
.works-single_data {
width: 100%;
}
.works-single_data__th, .works-single_data__td {
vertical-align: middle;
text-align: left;
border-top: 1px solid #DCDDDD;
padding-top: 15px;
padding-bottom: 15px;
font-size: 13px;
line-height: calc(19/13);
}
tr:first-child .works-single_data__th, tr:first-child .works-single_data__td {
border-top: none;
}
tr:last-child .works-single_data__th, tr:last-child .works-single_data__td {
padding-bottom: 0;
}
.works-single_data__th {
width: 80px;
}
.works-single_designers {
padding-top: 20px;
}
.works-single_designers__row {
display: flex;
align-items: center;
justify-content: flex-start;
}
.works-single_designers__figurearea {
overflow: hidden;
flex-basis: 60px;
max-width: 60px;
min-width: 60px;
margin-right: 20px;
}
@media screen and (min-width: 769px) {
.works-single_designers__figure {
transition-duration: 0.5s;
will-change: transform;
transform: scale(1);
transform-origin: bottom center;
}
}
@media screen and (min-width: 769px) {
.works-single_designers__link:hover .works-single_designers__figure {
transform: scale(1.1);
}
}
.works-single_designers__info {
flex-basis: calc(100% - 60px - 20px);
max-width: calc(100% - 60px - 20px);
min-width: calc(100% - 60px - 20px);
margin-right: 20px;
}
.works-single_designers__title {
letter-spacing: 0.05em;
font-size: 13px;
}
.works-single_designers__names {
display: flex;
align-items: center;
justify-content: flex-start;
margin-top: 10px;
}
.works-single_designers__jp {
letter-spacing: 0.05em;
font-size: 17px;
margin-right: 8px;
}
.works-single_designers__en {
font-family: "Philosopher", sans-serif;
letter-spacing: 0.05em;
color: #898989;
font-size: 11px;
}
.works-single_designers__btns {
margin-top: 60px;
}
@media screen and (max-width: 768px) {
.works-single_designers__btns {
max-width: 280px;
margin-left: auto;
margin-right: auto;
}
}
@media screen and (min-width: 769px) {
.works-single__fixed_contents .works-single_designers__btns { margin-top: 30px;
}
}
@media screen and (max-width: 768px) {
.works-single_designers__btn {
margin-top: 20px;
}
}
@media screen and (min-width: 769px) {
.works-single_designers__btn {
margin-top: 15px;
}
}
@media screen and (max-width: 768px) {
.works-single_designers__btn:first-child {
margin-top: 0;
}
}
@media screen and (min-width: 769px) {
.works-single_designers__btn:first-child {
margin-top: 0;
}
}
.works-single-movie {
margin-top: -30px;
}
#works-single-fixed-contents .works-single-movie {
margin: 30px 0 60px;
}
@media screen and (max-width: 768px) {
.works-single-movie {
width: 280px;
margin: -80px auto 0;
}
}
@media screen and (max-width: 768px) {
.works_single_fixed_head {
display: none;
}
}
@media screen and (min-width: 769px) {
.works_single_fixed_head {
width: 370px;
}
}
.works_single_fixed_head__types {
display: flex;
}
@media screen and (max-width: 768px) {
.works_single_fixed_head__types {
margin-right: 10px;
}
}
@media screen and (min-width: 769px) {
.works_single_fixed_head__types {
margin-right: 15px;
}
}
.works_single_fixed_head__type {
list-style: none;
font-family: vdl-v7mincho, sans-serif;
letter-spacing: 0.15em;
margin-left: 10px;
}
@media screen and (max-width: 768px) {
.works_single_fixed_head__type {
font-size: 11px;
}
}
@media screen and (min-width: 769px) {
.works_single_fixed_head__type {
font-size: 12px;
}
}
.works_single_fixed_head__type:first-child {
margin-left: 0;
}
.works_single_fixed_head__type_link {
display: flex;
border: 1px solid #C6AA80;
color: #C6AA80;
text-decoration: none;
align-items: center;
}
@media screen and (max-width: 768px) {
.works_single_fixed_head__type_link {
height: 19px;
padding: 0 7px;
}
}
@media screen and (min-width: 769px) {
.works_single_fixed_head__type_link {
height: 20px;
padding: 0 8px;
}
}
@media screen and (min-width: 769px) {
.works_single_fixed_head__type_link:hover {
background-color: #C6AA80;
color: #DCDDDD;
}
}
.works_single_fixed_head__tags {
display: flex;
flex-wrap: wrap;
}
@media screen and (min-width: 769px) {
.works_single_fixed_head__tags {
margin-top: 15px;
}
}
.works_single_fixed_head__tag {
letter-spacing: 0;
list-style: none;
margin-right: 1em;
line-height: calc(17/11);
}
@media screen and (max-width: 768px) {
.works_single_fixed_head__tag {
font-size: 11px;
}
}
@media screen and (min-width: 769px) {
.works_single_fixed_head__tag {
font-size: 12px;
}
}
.works_single_fixed_head__tag_link {
text-decoration: none;
color: #898989;
}
@media screen and (min-width: 769px) {
.works_single_fixed_head__tag_link:hover {
opacity: 0.7;
}
}
.works_single_fixed_head__ttl {
letter-spacing: 0.35em;
font-weight: 500;
}
@media screen and (min-width: 769px) {
.works_single_fixed_head__ttl {
margin-top: 10px;
font-family: vdl-v7mincho, sans-serif;
font-size: 32px;
}
}
@media screen and (min-width: 769px) {
.works_single_fixed_info {
width: 370px;
}
}
.quality-hero__bg {
position: relative;
z-index: 1; }
.quality-hero__main {
position: relative;
z-index: 2; }
.quality-hero__nav {
position: relative;
z-index: 3; }
.quality-hero__scroll {
position: relative;
z-index: 2; }
.quality-hero {
position: relative;
overflow: hidden;
}
.quality-hero__bg {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.quality-hero__main {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
@media screen and (max-width: 768px) {
.quality-hero__main {
margin-top: -74px;
}
}
@media screen and (min-width: 769px) {
.quality-hero__main {
margin-top: -32px;
}
}
@media screen and (max-width: 768px) {
.quality-hero__nav {
padding: 20px;
}
}
@media screen and (min-width: 769px) {
.quality-hero__nav {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
}
@media screen and (min-width: 769px) {
.quality-hero__scroll {
position: absolute;
right: 30px;
bottom: 0;
}
}
.quality-hero_nav {
display: flex;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.quality-hero_nav {
margin-right: -10px;
margin-top: -10px;
}
}
@media screen and (min-width: 769px) {
.quality-hero_nav {
margin-right: -2px;
align-items: flex-end;
}
}
@media screen and (max-width: 768px) {
.quality-hero_nav__item {
flex-basis: 50%;
max-width: 50%;
min-width: 50%;
padding-right: 10px;
margin-top: 10px;
transform: none !important;
opacity: 1 !important;
}
}
@media screen and (min-width: 769px) {
.quality-hero_nav__item {
flex-basis: 20%;
max-width: 20%;
min-width: 20%;
padding-right: 2px;
opacity: 1 !important;
}
}
.quality-hero_nav__btn {
font-weight: 500;
}
@media screen and (max-width: 768px) {
.quality-hero_nav__btn {
display: flex;
align-items: center;
justify-content: center;
height: 54px;
}
}
@media screen and (min-width: 769px) {
.quality-hero_nav__btn {
background: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/body-bg@2x.jpg) repeat top left;
background-size: 500px;
color: #DCDDDD;
}
}
@media screen and (min-width: 769px) {
.quality-hero_nav__btn .c-btn__left,
.quality-hero_nav__btn .c-btn__top,
.quality-hero_nav__btn .c-btn__right,
.quality-hero_nav__btn .c-btn__bottom {
display: none;
}
}
@media screen and (min-width: 769px) {
.quality-hero_nav__btn.is-current {
height: 85px;
background: #F0F0F0;
color: #C6AA80;
font-weight: bold;
}
}
@media screen and (min-width: 769px) {
.quality-hero_nav__btn:hover {
height: 85px;
}
}
@media screen and (max-width: 768px) {
.quality-hero_nav__btn::before {
content: "";
display: block;
position: absolute;
width: 100%;
height: 100%;
transition-duration: 0.5s;
background: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/body-bg@2x.jpg) repeat top left;
background-size: 500px;
opacity: 0;
z-index: 1;
}
}
@media screen and (max-width: 768px) {
.quality-hero_nav__btn.is-current::before {
background-image: none;
background-color: #C6AA80;
}
}
@media screen and (max-width: 768px) {
.quality-hero_nav__btn h1,
.quality-hero_nav__btn span {
font-size: 14px;
z-index: 2;
font-weight: 500;
}
}
@media screen and (min-width: 769px) {
.quality-hero_nav__btn h1,
.quality-hero_nav__btn span {
font-size: 15px;
}
}
@media screen and (max-width: 768px) {
.quality-hero_nav__btn.is-inview-btn-quality {
color: #DCDDDD;
}
}
@media screen and (max-width: 768px) {
.quality-hero_nav__btn.is-inview-btn-quality .c-btn__left,
.quality-hero_nav__btn.is-inview-btn-quality .c-btn__top,
.quality-hero_nav__btn.is-inview-btn-quality .c-btn__right,
.quality-hero_nav__btn.is-inview-btn-quality .c-btn__bottom {
opacity: 0;
}
}
@media screen and (max-width: 768px) {
.quality-hero_nav__btn.is-inview-btn-quality::before {
opacity: 1;
}
}
@media screen and (max-width: 768px) {
.quality-hero_nav__btn.is-inview-btn-quality.is-current {
color: #fff;
box-shadow: 7px 7px 14px 0px rgba(0, 0, 0, 0.16);
}
}
@media screen and (max-width: 768px) {
.quality-hero_nav__btn.is-inview-btn-quality.is-current h1 {
font-weight: bold;
}
}
.quality-copy {
font-family: vdl-v7mincho, sans-serif;
letter-spacing: 0.3em;
}
@media screen and (max-width: 768px) {
.quality-copy {
font-size: 18px;
line-height: calc(38/18);
}
}
@media screen and (min-width: 769px) {
.quality-copy {
font-size: 21px;
line-height: calc(44/21);
}
}
.quality-txt {
font-family: vdl-v7mincho, sans-serif;
letter-spacing: 0.15em;
}
@media screen and (max-width: 768px) {
.quality-txt {
font-size: 13px;
line-height: calc(28/13);
margin-top: 50px;
}
}
@media screen and (min-width: 769px) {
.quality-txt {
font-size: 16px;
line-height: calc(35/16);
margin-top: 70px;
}
}
@media screen and (max-width: 768px) {
.quality-txt:first-child {
margin-top: 0;
}
}
@media screen and (min-width: 769px) {
.quality-txt:first-child {
margin-top: 0;
}
}
@media screen and (min-width: 769px) {
.quality-block01 {
margin-top: 130px;
}
}
@media screen and (min-width: 769px) {
.quality-block01__row {
display: flex;
align-items: flex-end;
flex-direction: row-reverse;
}
}
.quality-block01__main {
background-image: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/bg-logo@2x.png);
background-repeat: no-repeat;
}
@media screen and (max-width: 768px) {
.quality-block01__main {
padding: 5px 10px 0px;
display: flex;
justify-content: center;
padding-top: 30px;
background-position: top center;
background-size: 258px;
}
}
@media screen and (min-width: 769px) {
.quality-block01__main {
flex-basis: 608px;
max-width: 608px;
min-width: 608px;
padding: 20px 0 145px 90px;
background-position: top 0 left 140px;
background-size: 408px;
}
}
@media screen and (max-width: 768px) {
.quality-block01__figure {
margin-top: 80px;
}
}
@media screen and (min-width: 769px) {
.quality-block01__figure {
flex-basis: 518px;
max-width: 518px;
min-width: 518px;
}
}
@media screen and (max-width: 768px) {
.quality-block02 {
margin-top: 50px;
}
}
@media screen and (min-width: 769px) {
.quality-block02__row {
display: flex;
}
}
@media screen and (max-width: 768px) {
.quality-block02__main {
display: flex;
justify-content: center;
}
}
@media screen and (min-width: 769px) {
.quality-block02__main {
flex-basis: 518px;
max-width: 518px;
min-width: 518px;
padding-top: 80px;
}
}
@media screen and (max-width: 768px) {
.quality-block02__figure {
margin-top: 80px;
background: none;
}
}
@media screen and (min-width: 769px) {
.quality-block02__figure {
flex-basis: 608px;
max-width: 608px;
min-width: 608px;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
}
@media screen and (max-width: 768px) {
.quality-block03 {
margin-top: 50px;
}
}
@media screen and (min-width: 769px) {
.quality-block03 {
margin-top: 208px;
}
}
@media screen and (min-width: 769px) {
.quality-block03__row {
display: flex;
flex-direction: row-reverse;
justify-content: flex-end;
}
}
@media screen and (max-width: 768px) {
.quality-block03__main {
display: flex;
justify-content: center;
}
}
@media screen and (min-width: 769px) {
.quality-block03__main {
padding-left: 80px;
}
}
@media screen and (max-width: 768px) {
.quality-block03__figure {
margin-top: 80px;
background: none;
}
}
@media screen and (min-width: 769px) {
.quality-block03__figure {
flex-basis: calc(50% + 88px);
max-width: calc(50% + 88px);
min-width: calc(50% + 88px);
}
}
@media screen and (min-width: 769px) {
.quality-block03__figure img {
width: 100%;
}
}
@media screen and (max-width: 768px) {
.quality-foot_nav {
padding-bottom: 80px;
}
}
@media screen and (min-width: 769px) {
.quality-foot_nav {
padding-bottom: 120px;
}
}
.quality-foot_nav--bgwhite {
background-color: #fff;
}
@media screen and (max-width: 768px) {
.quality-foot_nav__list {
max-width: 280px;
margin: 0 auto;
}
}
@media screen and (min-width: 769px) {
.quality-foot_nav__list {
display: flex;
justify-content: center;
}
}
@media screen and (max-width: 768px) {
.quality-foot_nav__item {
margin-top: 20px;
}
}
@media screen and (min-width: 769px) {
.quality-foot_nav__item {
padding: 0 10px;
}
}
@media screen and (max-width: 768px) {
.quality-foot_nav__item:first-child {
margin-top: 0;
}
}
.quality-head {
text-align: center;
}
@media screen and (max-width: 768px) {
.quality-head {
padding: 40px 0 80px;
}
}
@media screen and (min-width: 769px) {
.quality-head {
padding: 120px 0 100px;
}
}
.quality-head__en {
font-family: "Philosopher", sans-serif;
color: #C6AA80;
letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
.quality-head__en {
font-size: 13px;
}
}
@media screen and (min-width: 769px) {
.quality-head__en {
font-size: 14px;
}
}
.quality-head__en::after {
content: "";
display: block;
width: 1px;
background-color: #C6AA80;
}
@media screen and (max-width: 768px) {
.quality-head__en::after {
margin: 15px auto;
height: 36px;
}
}
@media screen and (min-width: 769px) {
.quality-head__en::after {
margin: 20px auto;
height: 40px;
}
}
.quality-head__ttl {
font-family: vdl-v7mincho, sans-serif;
font-weight: 500;
letter-spacing: 0.35em;
}
@media screen and (max-width: 768px) {
.quality-head__ttl {
font-size: 24px;
}
}
@media screen and (min-width: 769px) {
.quality-head__ttl {
font-size: 30px;
}
}
.quality-head__lead {
text-align: center;
letter-spacing: 0.08em;
}
@media screen and (max-width: 768px) {
.quality-head__lead {
margin-top: 45px;
font-size: 13px;
line-height: calc(30/13);
}
}
@media screen and (min-width: 769px) {
.quality-head__lead {
margin-top: 50px;
font-size: 16px;
line-height: calc(38/16);
}
}
@media screen and (max-width: 768px) {
.philosophy-figure {
padding-bottom: 80px;
}
}
@media screen and (min-width: 769px) {
.philosophy-figure {
padding-bottom: 110px;
}
}
.philosophy-textarea {
background-color: #fff;
}
@media screen and (max-width: 768px) {
.philosophy-textarea {
padding-top: 45px;
display: flex;
justify-content: center;
background-image: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/bg-logo@2x.png);
background-repeat: no-repeat;
background-position: top 45px center;
background-size: 258px;
}
}
@media screen and (min-width: 769px) {
.philosophy-textarea {
padding-top: 75px;
}
}
.philosophy-textarea__figure {
text-align: center;
}
@media screen and (min-width: 769px) {
.philosophy-textarea__figure {
height: 472px;
display: flex;
align-items: center;
justify-content: center;
background: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/common/bg-logo@2x.png) no-repeat top center;
background-size: contain;
}
}
@media screen and (max-width: 768px) {
.philosophy-textarea__inner {
padding-top: 50px;
}
}
.philosophy-textarea__ttl {
font-family: vdl-v7mincho, sans-serif;
font-weight: 500;
letter-spacing: 0.3em;
}
@media screen and (max-width: 768px) {
.philosophy-textarea__ttl {
font-size: 22px;
line-height: calc(38/22);
}
}
.philosophy-textarea__txt {
font-family: vdl-v7mincho, sans-serif;
font-weight: 500;
letter-spacing: 0.15em;
}
@media screen and (max-width: 768px) {
.philosophy-textarea__txt {
font-size: 15px;
line-height: calc(31/15);
margin-top: 55px;
}
}
.philosophy-textarea__name {
font-family: vdl-v7mincho, sans-serif;
font-weight: 500;
letter-spacing: 0.15em;
}
@media screen and (max-width: 768px) {
.philosophy-textarea__name {
font-size: 13px;
margin-top: 55px;
}
}
.advantage-section--bgwhite {
background-color: #fff;
}
@media screen and (min-width: 769px) {
.advantage-section--01, .advantage-section--02 {
display: flex;
}
}
@media screen and (min-width: 769px) {
.advantage-section--01 {
justify-content: flex-end;
}
}
@media screen and (min-width: 769px) {
.advantage-section--02 {
flex-direction: row-reverse;
justify-content: flex-end;
}
}
@media screen and (min-width: 769px) {
.advantage-section--03 {
padding-top: 110px;
}
}
@media screen and (max-width: 768px) {
.advantage-section__main {
padding-top: 70px;
padding-bottom: 70px;
}
}
@media screen and (min-width: 769px) {
.advantage-section--01 .advantage-section__main, .advantage-section--02 .advantage-section__main {
flex-basis: 563px;
max-width: 563px;
min-width: 563px;
padding-top: 120px;
padding-bottom: 120px;
}
}
@media screen and (min-width: 769px) {
.advantage-section--01 .advantage-section__main {
padding-right: 80px;
}
}
@media screen and (min-width: 769px) {
.advantage-section--02 .advantage-section__main {
padding-left: 80px;
}
}
.advantage-section__ttl {
text-align: center;
}
@media screen and (max-width: 768px) {
.advantage-section__ttl {
margin: 0 auto;
}
}
@media screen and (max-width: 768px) {
.advantage-section--01 .advantage-section__ttl {
width: 47px;
}
}
@media screen and (max-width: 768px) {
.advantage-section--02 .advantage-section__ttl {
width: 76px;
}
}
@media screen and (max-width: 768px) {
.advantage-section--03 .advantage-section__ttl {
width: 47px;
}
}
.advantage-section__txt {
letter-spacing: 0;
font-size: 16px;
line-height: calc(38/16);
}
@media screen and (max-width: 768px) {
.advantage-section__txt {
margin-top: 45px;
text-align: justify;
}
}
@media screen and (min-width: 769px) {
.advantage-section__txt {
margin-top: 75px;
}
}
@media screen and (max-width: 768px) {
.advantage-section--01 .advantage-section__figure, .advantage-section--02 .advantage-section__figure {
background: none;
}
}
@media screen and (min-width: 769px) {
.advantage-section--01 .advantage-section__figure, .advantage-section--02 .advantage-section__figure {
flex-basis: 50%;
max-width: 50%;
min-width: 50%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
}
@media screen and (min-width: 769px) {
.advantage-section--01 .advantage-section__figure img, .advantage-section--02 .advantage-section__figure img {
display: none;
}
}
.history {
background-color: #fff;
position: relative;
}
.history__arr--left, .history__arr--right {
position: absolute;
}
@media screen and (max-width: 768px) {
.history__arr--left, .history__arr--right {
top: 35px;
}
}
@media screen and (min-width: 769px) {
.history__arr--left, .history__arr--right {
top: 100px;
}
}
.history__arr--left {
display: none;
}
@media screen and (max-width: 768px) {
.history__arr--left {
left: 15px;
}
}
@media screen and (min-width: 769px) {
.history__arr--left {
left: 40px;
}
}
@media screen and (max-width: 768px) {
.history__arr--right {
right: 15px;
}
}
@media screen and (min-width: 769px) {
.history__arr--right {
right: 40px;
}
}
.history__arr line {
stroke: #C6AA80;
}
.history__arr path {
fill: #C6AA80;
}
.history__scrollarea {
overflow: scroll;
}
.history__row {
display: flex;
}
.history .js-slick-prev,
.history .js-slick-next {
position: absolute;
top: 50%;
transform: translateY(-50%);
cursor: pointer;
z-index: 2;
display: flex;
align-items: center;
height: 20px;
transition-duration: 0.5s;
}
@media screen and (max-width: 768px) {
.history .js-slick-prev,
.history .js-slick-next {
top: 30px;
transform: translateY(0);
}
}
.history .js-slick-prev line,
.history .js-slick-next line {
stroke: #C6AA80;
}
.history .js-slick-prev path,
.history .js-slick-next path {
fill: #C6AA80;
}
.history .js-slick-prev.slick-disabled,
.history .js-slick-next.slick-disabled {
opacity: 0;
}
@media screen and (max-width: 768px) {
.history .js-slick-prev {
left: 15px;
right: inherit;
}
}
@media screen and (min-width: 769px) {
.history .js-slick-prev {
left: 40px;
right: inherit;
}
}
@media screen and (max-width: 768px) {
.history .js-slick-next {
left: inherit;
right: 15px;
}
}
@media screen and (min-width: 769px) {
.history .js-slick-next {
left: inherit;
right: 40px;
}
}
.history .js-slick-dots {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
left: 50%;
transform: translateX(-50%);
width: 100%;
z-index: 3;
}
@media screen and (max-width: 768px) {
.history .js-slick-dots {
bottom: 35px;
padding: 0 30px;
}
}
@media screen and (min-width: 769px) {
.history .js-slick-dots {
bottom: 50px;
}
}
.history .js-slick-dots li {
list-style: none;
position: relative;
height: 3px;
width: auto;
opacity: 1;
display: flex;
align-items: center;
}
@media screen and (max-width: 768px) {
.history .js-slick-dots li {
flex-basis: 38px;
margin: 0 3px;
}
}
@media screen and (min-width: 769px) {
.history .js-slick-dots li {
flex-basis: 70px;
margin: 0 8px;
}
}
.history .js-slick-dots button {
flex-grow: 1;
text-indent: -999999px;
border: none;
height: 3px;
background-color: rgba(137, 137, 137, 0.35);
transition-duration: 0.5s;
transform: scale(1, 0.333);
will-change: transform;
cursor: pointer;
outline: none;
}
.history .js-slick-dots li.slick-active button {
transform: scale(1, 1);
background-color: #c6aa80;
}
.history .slick-list {
overflow: visible;
z-index: 1;
}
@keyframes historyscroll {
0% {
transform: translateX(0%);
}
to {
transform: translateX(-100%);
}
}
@media screen and (max-width: 768px) {
.history-section {
padding: 65px 0 80px;
}
}
@media screen and (min-width: 769px) {
.history-section {
padding: 80px 0 100px;
}
}
.history-section__info {
text-align: center;
border-bottom: 1px solid rgba(198, 170, 128, 0.25);
position: relative;
}
@media screen and (max-width: 768px) {
.history-section__info {
height: 85px;
}
}
@media screen and (min-width: 769px) {
.history-section__info {
height: 105px;
}
}
.history-section__info::before {
content: "";
display: block;
background-color: #C6AA80;
position: absolute;
bottom: -2px;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
@media screen and (max-width: 768px) {
.history-section__info::before {
width: 20px;
height: 3px;
}
}
@media screen and (min-width: 769px) {
.history-section__info::before {
width: 23px;
height: 3px;
}
}
.history-section__info::after {
content: "";
display: block;
}
.is-first .history-section__info::after {
position: absolute;
width: 50%;
height: 3px;
right: 50%;
bottom: -2px;
background-color: #fff;
}
.is-last .history-section__info::after {
position: absolute;
width: 50%;
height: 3px;
left: 50%;
bottom: -2px;
background-color: #fff;
}
.history-section__year {
font-family: "Philosopher", sans-serif;
letter-spacing: 0.05em;
color: #C6AA80;
}
@media screen and (max-width: 768px) {
.history-section__year {
font-size: 35px;
}
}
@media screen and (min-width: 769px) {
.history-section__year {
font-size: 45px;
}
}
.history-section__era {
letter-spacing: 0.08em;
color: #898989;
}
@media screen and (max-width: 768px) {
.history-section__era {
font-size: 11px;
margin-top: 5px;
}
}
@media screen and (min-width: 769px) {
.history-section__era {
font-size: 13px;
margin-top: 5px;
}
}
.history-section__ttl {
font-family: vdl-v7mincho, sans-serif;
letter-spacing: 0.15em;
font-weight: 500;
text-align: center;
line-height: calc(36/22);
}
@media screen and (max-width: 768px) {
.history-section__ttl {
font-size: 18px;
margin-top: 40px;
}
}
@media screen and (min-width: 769px) {
.history-section__ttl {
font-size: 22px;
margin-top: 50px;
}
}
.history-section__txt {
letter-spacing: 0.04em;
}
@media screen and (max-width: 768px) {
.history-section__txt {
margin-top: 35px;
font-size: 13px;
line-height: calc(25/13);
}
}
@media screen and (min-width: 769px) {
.history-section__txt {
margin-top: 50px;
font-size: 14px;
line-height: calc(28/14);
}
}
.history-section__figures {
display: flex;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.history-section__figures {
margin-top: 15px;
margin-right: -15px;
}
}
@media screen and (min-width: 769px) {
.history-section__figures {
margin-top: 40px;
justify-content: space-between;
}
}
@media screen and (max-width: 768px) {
.history-section__figure {
flex-basis: 50%;
max-width: 50%;
min-width: 50%;
padding-right: 15px;
padding-top: 15px;
}
}
@media screen and (min-width: 769px) {
.history-section__figure {
flex-basis: 168px;
max-width: 168px;
min-width: 168px;
}
}
.projects-hero {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
position: relative;
}
@media screen and (max-width: 768px) {
.projects-hero {
height: 204px;
}
}
@media screen and (min-width: 769px) {
.projects-hero {
height: 414px;
}
}
.projects-hero img {
display: none;
}
.projects-hero::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.25);
width: 100%;
height: 100%;
}
.projects-head {
text-align: center;
background-color: #fff;
}
@media screen and (max-width: 768px) {
.projects-head {
padding: 60px 0 60px;
}
}
@media screen and (min-width: 769px) {
.projects-head {
padding: 90px 0 100px;
}
}
.projects-head__en {
font-family: "Philosopher", sans-serif;
color: #C6AA80;
letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
.projects-head__en {
font-size: 13px;
}
}
@media screen and (min-width: 769px) {
.projects-head__en {
font-size: 14px;
}
}
.projects-head__en::after {
content: "";
display: block;
width: 1px;
background-color: #C6AA80;
}
@media screen and (max-width: 768px) {
.projects-head__en::after {
margin: 15px auto;
height: 36px;
}
}
@media screen and (min-width: 769px) {
.projects-head__en::after {
margin: 20px auto;
height: 40px;
}
}
.projects-head__ttl {
font-family: vdl-v7mincho, sans-serif;
font-weight: 500;
letter-spacing: 0.35em;
}
@media screen and (max-width: 768px) {
.projects-head__ttl {
font-size: 22px;
line-height: calc(42/22);
}
}
@media screen and (min-width: 769px) {
.projects-head__ttl {
font-size: 30px;
line-height: calc(53/30);
}
}
@media screen and (max-width: 768px) {
.projects-contents {
padding: 50px 0 70px;
}
}
@media screen and (min-width: 769px) {
.projects-contents {
padding: 90px 0 120px;
}
}
@media screen and (min-width: 769px) {
.projects-contents__title, .projects-contents__sub, .projects-contents__paragraph {
width: 640px;
margin-left: auto;
margin-right: auto;
}
}
.projects-contents__title, .projects-contents__sub {
font-family: vdl-v7mincho, sans-serif;
letter-spacing: 0.3em;
font-weight: 500;
}
@media screen and (max-width: 768px) {
.projects-contents__title, .projects-contents__sub {
text-align: left;
}
}
@media screen and (min-width: 769px) {
.projects-contents__title, .projects-contents__sub {
text-align: center;
}
}
@media screen and (max-width: 768px) {
.projects-contents__title br, .projects-contents__sub br {
display: none;
}
}
@media screen and (max-width: 768px) {
.projects-contents__title {
font-size: 20px;
line-height: calc(42/20);
margin-top: 80px;
}
}
@media screen and (min-width: 769px) {
.projects-contents__title {
font-size: 25px;
line-height: calc(42/25);
margin-top: 120px;
}
}
@media screen and (max-width: 768px) {
.projects-contents__sub {
font-size: 16px;
line-height: calc(36/16);
margin-top: 55px;
}
}
@media screen and (min-width: 769px) {
.projects-contents__sub {
font-size: 20px;
line-height: calc(36/20);
margin-top: 85px;
}
}
.projects-contents__paragraph {
letter-spacing: 0.04em;
text-align: justify;
}
@media screen and (max-width: 768px) {
.projects-contents__paragraph {
font-size: 13px;
line-height: calc(31/13);
margin-top: 25px;
}
}
@media screen and (min-width: 769px) {
.projects-contents__paragraph {
font-size: 16px;
line-height: calc(38/16);
margin-top: 60px;
}
}
.projects-contents__image {
text-align: center;
}
@media screen and (max-width: 768px) {
.projects-contents__image {
margin-top: 80px;
}
}
@media screen and (min-width: 769px) {
.projects-contents__image {
margin-top: 120px;
width: 850px;
margin-left: auto;
margin-right: auto;
}
}
.projects-contents__fullimagearea {
position: relative;
overflow: hidden;
}
@media screen and (max-width: 768px) {
.projects-contents__fullimagearea {
margin-top: 80px;
height: 180px;
}
}
@media screen and (min-width: 769px) {
.projects-contents__fullimagearea {
margin-top: 120px;
height: 414px;
}
}
.projects-contents__fullimage {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
}
.projects-contents__fullimage img {
width: 100%;
}
@media screen and (max-width: 768px) {
.projects-contents__button {
margin-top: 45px;
max-width: 340px;
margin-left: auto;
margin-right: auto;
padding: 0 30px;
}
}
@media screen and (min-width: 769px) {
.projects-contents__button {
margin-top: 65px;
}
}
@media screen and (max-width: 768px) {
.projects-contents__title:first-child, .projects-contents__sub:first-child, .projects-contents__paragraph:first-child, .projects-contents__image:first-child, .projects-contents__fullimagearea:first-child, .projects-contents__fullimage:first-child, .projects-contents__button:first-child {
margin-top: 0;
}
}
@media screen and (min-width: 769px) {
.projects-contents__title:first-child, .projects-contents__sub:first-child, .projects-contents__paragraph:first-child, .projects-contents__image:first-child, .projects-contents__fullimagearea:first-child, .projects-contents__fullimage:first-child, .projects-contents__button:first-child {
margin-top: 0;
}
}
.projects-related__inner {
border-top: 1px solid #DCDDDD;
}
@media screen and (max-width: 768px) {
.projects-related__inner {
padding-top: 45px;
}
}
@media screen and (min-width: 769px) {
.projects-related__inner {
padding-top: 60px;
width: 848px;
margin: 0 auto;
}
}
.projects-related__ttl {
text-align: center;
font-weight: bold;
letter-spacing: 0.05em;
font-size: 16px;
}
@media screen and (min-width: 769px) {
.projects-related__row {
margin-top: 15px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
}
.projects-related__item {
padding-top: 25px;
}
@media screen and (min-width: 769px) {
.projects-related__item {
flex-basis: 405px;
max-width: 405px;
min-width: 405px;
}
}
.projects-related__link {
text-decoration: none;
color: #595757;
text-align: center;
}
.projects-related__figurearea {
overflow: hidden;
}
@media screen and (min-width: 769px) {
.projects-related__figurearea {
background-color: #000;
}
}
.projects-related__figure {
transition-duration: 0.5s;
will-change: transform;
transform: scale(1);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
padding-bottom: 35.80246914%;
opacity: 1;
}
@media screen and (min-width: 769px) {
.projects-related__link:hover .projects-related__figure {
transform: scale(1.05);
opacity: 0.5;
}
}
.projects-related__figure img {
display: none;
}
.projects-related__txt {
transition-duration: 0.5s;
letter-spacing: 0.05em;
text-align: center;
line-height: 160%;
margin-top: 10px;
}
@media screen and (max-width: 768px) {
.projects-related__txt {
font-size: 12px;
}
}
@media screen and (min-width: 769px) {
.projects-related__txt {
font-size: 13px;
}
}
@media screen and (min-width: 769px) {
.projects-related__link:hover .projects-related__txt {
opacity: 0.7;
}
}
@media screen and (max-width: 768px) {
.archivets {
margin-top: 65px;
}
}
@media screen and (min-width: 769px) {
.archivets {
margin-top: 115px;
}
}
.archivets__row {
position: relative;
}
@media screen and (min-width: 769px) {
.archivets__row {
display: flex;
justify-content: space-between;
}
}
@media screen and (max-width: 768px) {
.archivets__nav {
display: none;
}
}
@media screen and (min-width: 769px) {
.archivets__main {
flex-basis: 830px;
max-width: 830px;
min-width: 830px;
}
}
@media screen and (max-width: 768px) {
.archivets__spnav {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 2;
}
}
@media screen and (min-width: 769px) {
.archivets__spnav {
display: none;
}
}
.architects-spnav {
background-color: #fff;
}
.architects-spnav__list {
overflow: hidden;
position: relative;
}
@media screen and (max-width: 768px) {
.architects-spnav__list {
height: 50px;
}
}
@media screen and (max-width: 768px) {
.architects-spnav__item {
height: 50px;
display: flex;
align-items: center;
justify-content: space-between;
position: absolute;
top: 0;
left: 0;
width: 100%;
padding: 0 15px;
background-color: #fff;
}
}
@media screen and (max-width: 768px) {
.architects-spnav__prev, .architects-spnav__next {
display: flex;
align-items: center;
}
}
@media screen and (max-width: 768px) {
.architects-spnav__prev line, .architects-spnav__next line {
stroke: #C6AA80;
}
}
@media screen and (max-width: 768px) {
.architects-spnav__prev path, .architects-spnav__next path {
fill: #C6AA80;
}
}
.architects-spnav__prev.is-nolink, .architects-spnav__next.is-nolink {
opacity: 0;
pointer-events: none;
}
@media screen and (min-width: 769px) {
.architects-nav.is-fixed {
position: fixed;
top: 205px;
}
}
@media screen and (min-width: 769px) {
.architects-nav.is-absolute {
position: absolute;
bottom: 275px;
}
}
.architects-nav__ttl {
font-family: "Philosopher", sans-serif;
color: #C6AA80;
letter-spacing: 0.05em;
font-weight: 500;
}
@media screen and (min-width: 769px) {
.architects-nav__ttl {
font-size: 14px;
}
}
@media screen and (min-width: 769px) {
.architects-nav__list {
margin-top: 35px;
}
}
.architects-nav__item {
letter-spacing: 0.05em;
list-style: none;
}
@media screen and (min-width: 769px) {
.architects-nav__item {
font-size: 16px;
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.architects-nav__item:first-child {
margin-top: 0;
}
}
@media screen and (min-width: 769px) {
.architects-nav__link {
text-decoration: none;
color: #898989;
}
}
@media screen and (min-width: 769px) {
.architects-nav__link:hover {
opacity: 0.7;
}
}
@media screen and (min-width: 769px) {
.architects-nav__link.is-current {
font-weight: bold;
color: #C6AA80;
}
}
@media screen and (max-width: 768px) {
.architects-archive {
padding-bottom: 60px;
}
}
@media screen and (min-width: 769px) {
.architects-archive {
padding-bottom: 75px;
}
}
@media screen and (max-width: 768px) {
.architects-archive__item:first-child {
margin-top: 0;
}
}
@media screen and (min-width: 769px) {
.architects-archive__item:first-child {
margin-top: 0;
}
}
.architects-section {
position: relative;
}
@media screen and (max-width: 768px) {
.architects-section {
margin-bottom: 105px;
}
}
@media screen and (min-width: 769px) {
.architects-section {
margin-bottom: 200px;
}
}
.architects-section::before {
content: "";
display: block;
width: 100%;
height: 1px;
background-color: rgba(89, 89, 89, 0.25);
position: absolute;
left: 0;
}
@media screen and (max-width: 768px) {
.architects-section::before {
bottom: -50px;
}
}
@media screen and (min-width: 769px) {
.architects-section::before {
bottom: -100px;
}
}
.architects-nav__item:last-child .architects-section::before::before {
display: none;
}
.architects-section__anchor {
position: absolute;
}
@media screen and (max-width: 768px) {
.architects-section__anchor {
top: -74px;
}
}
@media screen and (min-width: 769px) {
.architects-section__anchor {
top: -190px;
}
}
@media screen and (max-width: 768px) {
.architects-section__works {
margin-top: 40px;
}
}
@media screen and (min-width: 769px) {
.architects-section__works {
margin-top: 50px;
}
}
@media screen and (max-width: 768px) {
.architects-section_main {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
}
}
@media screen and (min-width: 769px) {
.architects-section_main {
overflow: hidden;
}
}
@media screen and (max-width: 768px) {
.architects-section_main__figure {
flex-basis: 160px;
max-width: 160px;
min-width: 160px;
}
}
@media screen and (min-width: 769px) {
.architects-section_main__figure {
float: left;
width: 258px;
}
}
@media screen and (max-width: 768px) {
.architects-section_main__info {
flex-basis: calc(100% - 160px - 30px);
max-width: calc(100% - 160px - 30px);
min-width: calc(100% - 160px - 30px);
}
}
@media screen and (min-width: 769px) {
.architects-section_main__info {
float: right;
width: 525px;
}
}
.architects-section_main__ttl {
letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
.architects-section_main__ttl {
font-size: 13px;
}
}
@media screen and (min-width: 769px) {
.architects-section_main__ttl {
font-size: 15px;
}
}
.architects-section_main__name {
letter-spacing: 0.05em;
font-family: vdl-v7mincho, sans-serif;
font-weight: 500;
}
@media screen and (max-width: 768px) {
.architects-section_main__name {
font-size: 22px;
margin-top: 20px;
}
}
@media screen and (min-width: 769px) {
.architects-section_main__name {
font-size: 25px;
margin-top: 25px;
}
}
.architects-section_main__en {
letter-spacing: 0.05em;
font-family: "Philosopher", sans-serif;
}
@media screen and (max-width: 768px) {
.architects-section_main__en {
font-size: 11px;
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.architects-section_main__en {
font-size: 13px;
margin-top: 5px;
}
}
.architects-section_main__desc {
letter-spacing: 0.04em;
display: flex;
font-size: 13px;
line-height: calc(30/13);
}
@media screen and (max-width: 768px) {
.architects-section_main__desc {
flex-basis: 100%;
max-width: 100%;
min-width: 100%;
margin-top: 30px;
}
}
@media screen and (min-width: 769px) {
.architects-section_main__desc {
float: right;
width: 525px;
margin-top: 30px;
}
}
.architects-section_main__quot {
display: inline-block;
background-repeat: no-repeat;
background-position: top center;
background-size: cover;
flex-basis: 23px;
max-width: 23px;
min-width: 23px;
width: 23px;
height: 15px;
}
.architects-section_main__quot--start {
background-image: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/architects/quotation-start@2x.png);
margin-right: 10px;
transform: translateY(5px);
}
.architects-section_main__quot--end {
background-image: url(//yamadahomes.jp/kobori/wp/wp-content/themes/koboriarchitectslab/assets/images/architects/quotation-end@2x.png);
margin-left: 5px;
transform: translateY(5px);
}
.architects-section_works__head {
font-family: "Philosopher", sans-serif;
color: #C6AA80;
letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
.architects-section_works__head {
font-size: 14px;
padding-left: 30px;
}
}
@media screen and (min-width: 769px) {
.architects-section_works__head {
font-size: 14px;
}
}
@media screen and (max-width: 768px) {
.architects-section_works__body {
margin: 20px auto 0;
width: 196px;
padding-bottom: 105px;
}
}
@media screen and (min-width: 769px) {
.architects-section_works__body {
margin-top: 25px;
}
}
@media screen and (min-width: 769px) {
.architects-section_works__list {
display: flex;
justify-content: space-between;
width: 100% !important;
transform: none !important;
}
}
.architects-section_works .js-slick-prev,
.architects-section_works .js-slick-next {
cursor: pointer;
z-index: 2;
display: flex;
align-items: center;
height: 20px;
position: absolute;
}
@media screen and (max-width: 768px) {
.architects-section_works .js-slick-prev,
.architects-section_works .js-slick-next {
bottom: -60px;
}
}
@media screen and (min-width: 769px) {
.architects-section_works .js-slick-prev,
.architects-section_works .js-slick-next {
top: 50%;
transform: translateY(-50%);
}
}
.architects-section_works .js-slick-prev line,
.architects-section_works .js-slick-next line {
stroke: #C6AA80;
}
.architects-section_works .js-slick-prev path,
.architects-section_works .js-slick-next path {
fill: #C6AA80;
}
@media screen and (max-width: 768px) {
.architects-section_works .js-slick-prev {
right: 50%;
transform: translateX(-20px);
}
}
@media screen and (min-width: 769px) {
.architects-section_works .js-slick-prev {
left: -14px;
right: inherit;
}
}
@media screen and (max-width: 768px) {
.architects-section_works .js-slick-next {
left: 50%;
transform: translateX(20px);
}
}
@media screen and (min-width: 769px) {
.architects-section_works .js-slick-next {
left: inherit;
right: -14px;
}
}
.architects-section_works .js-slick-dots {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
left: 50%;
transform: translateX(-50%);
width: 100%;
}
@media screen and (max-width: 768px) {
.architects-section_works .js-slick-dots {
bottom: -105px;
width: 100vw;
}
}
@media screen and (min-width: 769px) {
.architects-section_works .js-slick-dots {
bottom: -52px;
}
}
.architects-section_works .js-slick-dots li {
list-style: none;
position: relative;
height: 3px;
width: auto;
opacity: 1;
display: flex;
align-items: center;
}
@media screen and (max-width: 768px) {
.architects-section_works .js-slick-dots li {
flex-basis: 38px;
margin: 0 3px;
}
}
@media screen and (min-width: 769px) {
.architects-section_works .js-slick-dots li {
flex-basis: 70px;
margin: 0 8px;
}
}
.architects-section_works .js-slick-dots button {
flex-grow: 1;
text-indent: -999999px;
border: none;
height: 3px;
background-color: rgba(137, 137, 137, 0.35);
transition-duration: 0.5s;
transform: scale(1, 0.333);
will-change: transform;
cursor: pointer;
outline: none;
}
.architects-section_works .js-slick-dots li.slick-active button {
transform: scale(1, 1);
background-color: #c6aa80;
}
.architects-section_works .slick-list {
overflow: visible;
z-index: 1;
}
@media screen and (min-width: 769px) {
.architects-section_works .slick-list {
flex-grow: 1;
width: 100%;
}
}
@media screen and (min-width: 769px) {
.architects-section_works .slick-track {
display: flex;
justify-content: space-between;
}
}
@media screen and (min-width: 769px) {
.architects-section_works .slick-track::before {
display: none;
}
}
@media screen and (min-width: 769px) {
.architects-section_works__item {
width: 258px !important;
}
}
@media screen and (max-width: 768px) {
.architects-section_works__article {
padding: 0 8px;
}
}
@media screen and (min-width: 769px) {
.architects-section_works__figurearea {
flex-basis: 100%;
overflow: hidden;
background-color: #000;
}
}
.architects-section_works__figure {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
transition-duration: 0.5s;
}
@media screen and (max-width: 768px) {
.architects-section_works__figure {
width: 180px;
height: 111px;
}
}
@media screen and (min-width: 769px) {
.architects-section_works__figure {
will-change: transform;
transform: scale(1);
height: 159px;
}
}
@media screen and (min-width: 769px) {
a:hover .architects-section_works__figure {
transform: scale(1.05);
opacity: 0.5;
}
}
.architects-section_works__figure img {
display: none;
}
@media screen and (min-width: 769px) {
.architects-section_works__info {
display: flex;
align-items: flex-start;
}
}
.architects-section_works__types {
display: flex;
align-items: center;
margin-right: 10px;
}
@media screen and (max-width: 768px) {
.architects-section_works__types {
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.architects-section_works__types {
margin-top: 15px;
}
}
.architects-section_works__type {
margin-left: 5px;
list-style: none;
font-weight: bold;
letter-spacing: 0.15em;
font-size: 10px;
padding-top: 2px;
}
.architects-section_works__type:first-child {
margin-left: 0;
}
.architects-section_works__type_link {
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
color: #C6AA80;
border: 1px solid #C6AA80;
height: 16px;
padding: 0 7px;
}
@media screen and (min-width: 769px) {
.architects-section_works__type_link:hover {
background-color: #C6AA80;
color: #fff;
}
}
.architects-section_works__ttl {
letter-spacing: 0.35em;
font-weight: 500;
}
@media screen and (max-width: 768px) {
.architects-section_works__ttl {
margin-top: 10px;
font-size: 16px;
}
}
@media screen and (min-width: 769px) {
.architects-section_works__ttl {
margin-top: 15px;
font-size: 18px;
}
}
.architects-section_works__link {
text-decoration: none;
color: #DCDDDD;
}
@media screen and (min-width: 769px) {
.architects-section_works__link:hover {
opacity: 0.7;
}
}
@media screen and (max-width: 768px) {
.architects-section_works__more {
margin: 35px auto 0;
max-width: 340px;
padding: 0 30px;
}
}
@media screen and (min-width: 769px) {
.architects-section_works__more {
margin-top: 80px;
}
}
.contact-required {
display: inline-block;
background-color: #A5916D;
color: #fff;
letter-spacing: 0.05em;
font-weight: bold;
vertical-align: middle;
width: 34px;
height: 19px;
line-height: 19px;
text-align: center;
border-radius: 10px;
font-size: 10px;
}
@media screen and (max-width: 768px) {
.contact-form {
margin-top: 55px;
padding-bottom: 50px;
}
}
@media screen and (min-width: 769px) {
.contact-form {
margin-top: 115px;
padding-bottom: 180px;
}
}
.contact-form__txt {
text-align: center;
letter-spacing: 0.05em;
font-size: 13px;
line-height: calc(30/13);
}
@media screen and (max-width: 768px) {
.contact-form__txt {
margin-top: 20px;
}
}
@media screen and (min-width: 769px) {
.contact-form__txt {
margin-top: 40px;
}
}
.contact-form__privacy {
background-color: rgba(255, 255, 255, 0.6);
border: 1px solid #DCDDDD;
height: 260px;
overflow: scroll;
}
@media screen and (max-width: 768px) {
.contact-form__privacy {
margin-top: 35px;
padding: 25px;
}
}
@media screen and (min-width: 769px) {
.contact-form__privacy {
width: 890px;
margin: 50px auto 0;
padding: 30px 25px;
}
}
.contact-form__privacy_ttl {
letter-spacing: 0.08em;
font-size: 14px;
font-weight: bold;
text-align: center;
}
.contact-form__privacy_body {
margin-top: 20px;
}
.contact-form__privacy_section {
padding-top: 15px;
margin-top: 15px;
border-top: 1px solid #E9E9E9;
}
.contact-form__privacy_section:first-child {
padding-top: 0;
margin-top: 0;
border-top: none;
}
.contact-form__privacy_sub {
font-size: 12px;
letter-spacing: 0.08em;
font-weight: bold;
}
.contact-form__privacy_txt {
font-size: 12px;
letter-spacing: 0.05em;
line-height: calc(19.2/12);
margin-top: 10px;
}
.contact-form__privacy_check {
text-align: center;
font-size: 16px;
letter-spacing: 0.08em;
margin-top: 35px;
text-align: center;
}
@media screen and (max-width: 768px) {
.contact-form__privacy_check {
margin-top: 65px;
}
}
@media screen and (min-width: 769px) {
.contact-form__privacy_check {
margin-top: 100px;
}
}
@media screen and (max-width: 768px) {
.contact-form__submit {
max-width: 340px;
padding: 0 30px;
margin: 65px auto 0;
}
}
@media screen and (min-width: 769px) {
.contact-form__submit {
margin-top: 100px;
display: flex;
justify-content: center;
}
}
.contact-form__submit button,
.contact-form__submit .contact-form__submit__item {
outline: none;
transition-duration: 0.5s;
border: none;
cursor: pointer;
}
@media screen and (max-width: 768px) {
.contact-form__submit button,
.contact-form__submit .contact-form__submit__item {
width: 100%;
}
}
@media screen and (min-width: 769px) {
.contact-form__submit button,
.contact-form__submit .contact-form__submit__item {
flex-basis: 280px;
max-width: 280px;
min-width: 280px;
margin: 0 15px;
}
}
.contact-form__submit__item {
display: flex;
justify-content: center;
align-items: center;
}
.contact-form__submit__item input {
display: block;
border: none;
background: transparent;
width: 100%;
color: #C6AA80;
font-weight: bold;
letter-spacing: 0.08em;
transition-duration: 0.5s;
cursor: pointer;
}
.contact-form__submit__item input:hover {
color: #fff;
}
.contact-form__submit__item .wpcf7-spinner {
display: none;
}
@media screen and (max-width: 768px) {
.contact-form__submit:first-child {
margin-top: 0;
}
}
.contact-form .error {
font-size: 12px !important;
font-weight: bold;
letter-spacing: 0.08em;
margin-top: 5px; }
.contact-table {
border-top: 1px solid #DCDDDD;
}
@media screen and (max-width: 768px) {
.contact-table {
display: block;
}
}
@media screen and (min-width: 769px) {
.contact-table {
margin: 0 auto;
width: 890px;
}
}
@media screen and (max-width: 768px) {
.contact-table tbody {
display: block;
}
}
@media screen and (max-width: 768px) {
.contact-table__tr {
display: block;
padding: 20px 30px;
border-bottom: 1px solid #DCDDDD;
}
}
@media screen and (max-width: 768px) {
.contact-table__th, .contact-table__td {
display: block;
}
}
@media screen and (min-width: 769px) {
.contact-table__th, .contact-table__td {
border-bottom: 1px solid #DCDDDD;
vertical-align: top;
}
}
@media screen and (min-width: 769px) {
.mw_wp_form_confirm .contact-table__th, .mw_wp_form_confirm .contact-table__td {
vertical-align: middle;
}
}
.contact-table__th {
letter-spacing: 0.08em;
font-weight: bold;
font-size: 16px;
line-height: calc(20/16);
}
@media screen and (min-width: 769px) {
.contact-table__th {
width: 250px;
padding: 32px 25px 32px 0;
text-align: right;
}
}
.contact-table__th .fs {
font-size: 14px;
}
@media screen and (min-width: 769px) {
.contact-table__th--checkbox {
padding: 20px 25px 20px 0;
}
}
@media screen and (min-width: 769px) {
.mw_wp_form_confirm .contact-table__th {
padding: 20px 25px 20px 0;
}
}
@media screen and (max-width: 768px) {
.contact-table__td {
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.contact-table__td {
padding: 20px 0;
}
}
@media screen and (min-width: 769px) {
.contact-table__td--checkbox {
vertical-align: middle;
padding: 10px 0;
}
}
@media screen and (min-width: 769px) {
.mw_wp_form_confirm .contact-table__td {
padding: 20px 0 20px 0;
}
}
.contact-table__head {
display: flex;
}
@media screen and (min-width: 769px) {
.contact-table__head {
justify-content: flex-end;
}
}
.contact-table input[type=text],
.contact-table input[type=email],
.contact-table input[type=tel],
.contact-table select,
.contact-table textarea {
width: 100%;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 5px;
outline: none;
}
@media screen and (max-width: 768px) {
.contact-table input[type=text],
.contact-table input[type=email],
.contact-table input[type=tel],
.contact-table select,
.contact-table textarea {
height: 56px;
padding: 0 20px;
}
}
@media screen and (min-width: 769px) {
.contact-table input[type=text],
.contact-table input[type=email],
.contact-table input[type=tel],
.contact-table select,
.contact-table textarea {
height: 44px;
padding: 0 15px;
}
}
.contact-table input[type=text]:focus,
.contact-table input[type=email]:focus,
.contact-table input[type=tel]:focus,
.contact-table select:focus,
.contact-table textarea:focus {
border: 2px solid #A5916D;
background-color: #F4F4F4;
outline: none;
}
.contact-table textarea {
resize: vertical;
line-height: 180%;
}
@media screen and (max-width: 768px) {
.contact-table textarea {
height: 120px;
padding: 15px 20px;
}
}
@media screen and (min-width: 769px) {
.contact-table textarea {
height: 160px;
padding: 15px;
}
}
.contact-table__item-v1 {
background-color: #fff;
border: 1px solid #ccc;
border-radius: 5px;
outline: none;
}
@media screen and (max-width: 768px) {
.contact-table__item-v1 {
height: 56px;
padding: 0 20px;
}
}
@media screen and (min-width: 769px) {
.contact-table__item-v1 {
height: 44px;
padding: 0 15px;
}
}
.contact-table__item-v1:focus {
border: 2px solid #A5916D;
background-color: #F4F4F4;
outline: none;
}
@media screen and (min-width: 769px) {
.contact-table__input_narrow input[type=text] {
width: 400px;
}
}
@media screen and (max-width: 768px) {
.contact-table__input_age input[type=text] {
width: 135px;
}
}
@media screen and (min-width: 769px) {
.contact-table__input_age input[type=text] {
width: 135px;
}
}
.contact-table__input_address_head {
display: flex;
align-items: center;
}
@media screen and (max-width: 768px) {
.contact-table__input_address_head {
flex-wrap: wrap;
}
}
@media screen and (max-width: 768px) {
.contact-table__input_address_head .txt {
flex-basis: 25px;
max-width: 25px;
min-width: 25px;
}
}
@media screen and (max-width: 768px) {
.contact-table__input_address_head input[type=text],
.contact-table__input_address_head input[type=tel] {
flex-basis: 135px;
max-width: 135px;
min-width: 135px;
margin-right: 10px;
}
}
@media screen and (min-width: 769px) {
.contact-table__input_address_head input[type=text],
.contact-table__input_address_head input[type=tel] {
flex-basis: 135px;
max-width: 135px;
min-width: 135px;
margin-right: 10px;
}
}
@media screen and (max-width: 768px) {
.contact-table__input_address_head select {
flex-basis: 135px;
max-width: 135px;
min-width: 135px;
}
}
@media screen and (min-width: 769px) {
.contact-table__input_address_head select {
flex-basis: 135px;
max-width: 135px;
min-width: 135px;
}
}
.contact-table__content {
line-height: 180%;
}
@media screen and (max-width: 768px) {
.contact-table__checkbox {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: -10px;
}
}
.contact-table__checkbox .mwform-checkbox-field {
margin-left: 0 !important;
}
@media screen and (max-width: 768px) {
.contact-table__checkbox .mwform-checkbox-field {
flex-basis: 150px;
max-width: 150px;
min-width: 150px;
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.contact-table__checkbox .mwform-checkbox-field {
margin-right: 25px;
}
}
@media screen and (max-width: 768px) {
.contact-table__checkbox .mwform-checkbox-field label {
background-color: #fff;
height: 46px;
display: flex;
align-items: center;
border-radius: 5px;
padding-left: 20px;
}
}
.contact-table__checkbox .mwform-checkbox-field input[type=checkbox] {
margin-right: 5px;
}
.u-dib {
display: inline-block;
}
@media screen and (max-width: 768px) {
.u-dib-sp {
display: inline-block;
}
}
@media screen and (min-width: 769px) {
.u-dib-pc {
display: inline-block;
}
}
.u-db {
display: block;
}
@media screen and (max-width: 768px) {
.u-db-sp {
display: block;
}
}
@media screen and (min-width: 769px) {
.u-db-pc {
display: block;
}
}
.u-dn {
display: none;
}
@media screen and (max-width: 768px) {
.u-dn-sp {
display: none;
}
}
@media screen and (min-width: 769px) {
.u-dn-pc {
display: none;
}
}
.u-bold {
font-weight: bold;
}
@media screen and (max-width: 768px) {
.u-bold-sp {
font-weight: bold;
}
}
@media screen and (min-width: 769px) {
.u-bold-pc {
font-weight: bold;
}
}
.u-normal {
font-weight: normal;
}
@media screen and (max-width: 768px) {
.u-normal-sp {
font-weight: normal;
}
}
@media screen and (min-width: 769px) {
.u-normal-pc {
font-weight: normal;
}
}
.u-black {
color: #212121;
}
@media screen and (max-width: 768px) {
.u-black-sp {
color: #212121;
}
}
@media screen and (min-width: 769px) {
.u-black-pc {
color: #212121;
}
}
.u-white {
color: #fff;
}
@media screen and (max-width: 768px) {
.u-white-sp {
color: #fff;
}
}
@media screen and (min-width: 769px) {
.u-white-pc {
color: #fff;
}
}
.u-center {
text-align: center;
}
@media screen and (max-width: 768px) {
.u-center-sp {
text-align: center;
}
}
@media screen and (min-width: 769px) {
.u-center-pc {
text-align: center;
}
}
.u-left {
text-align: left;
}
@media screen and (max-width: 768px) {
.u-left-sp {
text-align: left;
}
}
@media screen and (min-width: 769px) {
.u-left-pc {
text-align: left;
}
}
.u-right {
text-align: right;
}
@media screen and (max-width: 768px) {
.u-right-sp {
text-align: right;
}
}
@media screen and (min-width: 769px) {
.u-right-pc {
text-align: right;
}
}
.u-justify {
text-align: justify;
}
@media screen and (max-width: 768px) {
.u-justify-sp {
text-align: justify;
}
}
@media screen and (min-width: 769px) {
.u-justify-pc {
text-align: justify;
}
}
.u-nowa {
display: inline-block;
overflow: hidden;
_zoom: 1;
}
@media screen and (max-width: 768px) {
.u-nowa-sp {
display: inline-block;
overflow: hidden;
_zoom: 1;
}
}
@media screen and (min-width: 769px) {
.u-nowa-pc {
display: inline-block;
overflow: hidden;
_zoom: 1;
}
}
.u-nowa-icon {
display: block;
float: left;
}
@media screen and (max-width: 768px) {
.u-nowa-icon-sp {
display: block;
float: left;
}
}
@media screen and (min-width: 769px) {
.u-nowa-icon-pc {
display: block;
float: left;
}
}
.u-nowa-txt {
display: block;
overflow: hidden;
_zoom: 1;
}
@media screen and (max-width: 768px) {
.u-nowa-txt-sp {
display: block;
overflow: hidden;
_zoom: 1;
}
}
@media screen and (min-width: 769px) {
.u-nowa-txt-pc {
display: block;
overflow: hidden;
_zoom: 1;
}
}
.u-mt00 {
margin-top: 0px;
}
@media screen and (max-width: 768px) {
.u-mt00-sp {
margin-top: 0px;
}
}
@media screen and (min-width: 769px) {
.u-mt00-pc {
margin-top: 0px;
}
}
.u-mt05 {
margin-top: 5px;
}
@media screen and (max-width: 768px) {
.u-mt05-sp {
margin-top: 5px;
}
}
@media screen and (min-width: 769px) {
.u-mt05-pc {
margin-top: 5px;
}
}
.u-mt10 {
margin-top: 10px;
}
@media screen and (max-width: 768px) {
.u-mt10-sp {
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.u-mt10-pc {
margin-top: 10px;
}
}
.u-mt15 {
margin-top: 15px;
}
@media screen and (max-width: 768px) {
.u-mt15-sp {
margin-top: 15px;
}
}
@media screen and (min-width: 769px) {
.u-mt15-pc {
margin-top: 15px;
}
}
.u-mt20 {
margin-top: 20px;
}
@media screen and (max-width: 768px) {
.u-mt20-sp {
margin-top: 20px;
}
}
@media screen and (min-width: 769px) {
.u-mt20-pc {
margin-top: 20px;
}
}
.u-mt25 {
margin-top: 25px;
}
@media screen and (max-width: 768px) {
.u-mt25-sp {
margin-top: 25px;
}
}
@media screen and (min-width: 769px) {
.u-mt25-pc {
margin-top: 25px;
}
}
.u-mt30 {
margin-top: 30px;
}
@media screen and (max-width: 768px) {
.u-mt30-sp {
margin-top: 30px;
}
}
@media screen and (min-width: 769px) {
.u-mt30-pc {
margin-top: 30px;
}
}
.u-mt35 {
margin-top: 35px;
}
@media screen and (max-width: 768px) {
.u-mt35-sp {
margin-top: 35px;
}
}
@media screen and (min-width: 769px) {
.u-mt35-pc {
margin-top: 35px;
}
}
.u-mt40 {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.u-mt40-sp {
margin-top: 40px;
}
}
@media screen and (min-width: 769px) {
.u-mt40-pc {
margin-top: 40px;
}
}
.u-mt45 {
margin-top: 45px;
}
@media screen and (max-width: 768px) {
.u-mt45-sp {
margin-top: 45px;
}
}
@media screen and (min-width: 769px) {
.u-mt45-pc {
margin-top: 45px;
}
}
.u-mt50 {
margin-top: 50px;
}
@media screen and (max-width: 768px) {
.u-mt50-sp {
margin-top: 50px;
}
}
@media screen and (min-width: 769px) {
.u-mt50-pc {
margin-top: 50px;
}
}
.u-mt55 {
margin-top: 55px;
}
@media screen and (max-width: 768px) {
.u-mt55-sp {
margin-top: 55px;
}
}
@media screen and (min-width: 769px) {
.u-mt55-pc {
margin-top: 55px;
}
}
.u-mt60 {
margin-top: 60px;
}
@media screen and (max-width: 768px) {
.u-mt60-sp {
margin-top: 60px;
}
}
@media screen and (min-width: 769px) {
.u-mt60-pc {
margin-top: 60px;
}
}
.u-mt65 {
margin-top: 65px;
}
@media screen and (max-width: 768px) {
.u-mt65-sp {
margin-top: 65px;
}
}
@media screen and (min-width: 769px) {
.u-mt65-pc {
margin-top: 65px;
}
}
.u-mt70 {
margin-top: 70px;
}
@media screen and (max-width: 768px) {
.u-mt70-sp {
margin-top: 70px;
}
}
@media screen and (min-width: 769px) {
.u-mt70-pc {
margin-top: 70px;
}
}
.u-mt75 {
margin-top: 75px;
}
@media screen and (max-width: 768px) {
.u-mt75-sp {
margin-top: 75px;
}
}
@media screen and (min-width: 769px) {
.u-mt75-pc {
margin-top: 75px;
}
}
.u-mt80 {
margin-top: 80px;
}
@media screen and (max-width: 768px) {
.u-mt80-sp {
margin-top: 80px;
}
}
@media screen and (min-width: 769px) {
.u-mt80-pc {
margin-top: 80px;
}
}
.u-mt85 {
margin-top: 85px;
}
@media screen and (max-width: 768px) {
.u-mt85-sp {
margin-top: 85px;
}
}
@media screen and (min-width: 769px) {
.u-mt85-pc {
margin-top: 85px;
}
}
.u-mt90 {
margin-top: 90px;
}
@media screen and (max-width: 768px) {
.u-mt90-sp {
margin-top: 90px;
}
}
@media screen and (min-width: 769px) {
.u-mt90-pc {
margin-top: 90px;
}
}
.u-mt95 {
margin-top: 95px;
}
@media screen and (max-width: 768px) {
.u-mt95-sp {
margin-top: 95px;
}
}
@media screen and (min-width: 769px) {
.u-mt95-pc {
margin-top: 95px;
}
}
.u-mt100 {
margin-top: 100px;
}
@media screen and (max-width: 768px) {
.u-mt100-sp {
margin-top: 100px;
}
}
@media screen and (min-width: 769px) {
.u-mt100-pc {
margin-top: 100px;
}
}
.u-mr00 {
margin-right: 0px;
}
@media screen and (max-width: 768px) {
.u-mr00-sp {
margin-right: 0px;
}
}
@media screen and (min-width: 769px) {
.u-mr00-pc {
margin-right: 0px;
}
}
.u-mr05 {
margin-right: 5px;
}
@media screen and (max-width: 768px) {
.u-mr05-sp {
margin-right: 5px;
}
}
@media screen and (min-width: 769px) {
.u-mr05-pc {
margin-right: 5px;
}
}
.u-mr10 {
margin-right: 10px;
}
@media screen and (max-width: 768px) {
.u-mr10-sp {
margin-right: 10px;
}
}
@media screen and (min-width: 769px) {
.u-mr10-pc {
margin-right: 10px;
}
}
.u-mr15 {
margin-right: 15px;
}
@media screen and (max-width: 768px) {
.u-mr15-sp {
margin-right: 15px;
}
}
@media screen and (min-width: 769px) {
.u-mr15-pc {
margin-right: 15px;
}
}
.u-mr20 {
margin-right: 20px;
}
@media screen and (max-width: 768px) {
.u-mr20-sp {
margin-right: 20px;
}
}
@media screen and (min-width: 769px) {
.u-mr20-pc {
margin-right: 20px;
}
}
.u-mr25 {
margin-right: 25px;
}
@media screen and (max-width: 768px) {
.u-mr25-sp {
margin-right: 25px;
}
}
@media screen and (min-width: 769px) {
.u-mr25-pc {
margin-right: 25px;
}
}
.u-mr30 {
margin-right: 30px;
}
@media screen and (max-width: 768px) {
.u-mr30-sp {
margin-right: 30px;
}
}
@media screen and (min-width: 769px) {
.u-mr30-pc {
margin-right: 30px;
}
}
.u-mr35 {
margin-right: 35px;
}
@media screen and (max-width: 768px) {
.u-mr35-sp {
margin-right: 35px;
}
}
@media screen and (min-width: 769px) {
.u-mr35-pc {
margin-right: 35px;
}
}
.u-mr40 {
margin-right: 40px;
}
@media screen and (max-width: 768px) {
.u-mr40-sp {
margin-right: 40px;
}
}
@media screen and (min-width: 769px) {
.u-mr40-pc {
margin-right: 40px;
}
}
.u-mr45 {
margin-right: 45px;
}
@media screen and (max-width: 768px) {
.u-mr45-sp {
margin-right: 45px;
}
}
@media screen and (min-width: 769px) {
.u-mr45-pc {
margin-right: 45px;
}
}
.u-mr50 {
margin-right: 50px;
}
@media screen and (max-width: 768px) {
.u-mr50-sp {
margin-right: 50px;
}
}
@media screen and (min-width: 769px) {
.u-mr50-pc {
margin-right: 50px;
}
}
.u-mr55 {
margin-right: 55px;
}
@media screen and (max-width: 768px) {
.u-mr55-sp {
margin-right: 55px;
}
}
@media screen and (min-width: 769px) {
.u-mr55-pc {
margin-right: 55px;
}
}
.u-mr60 {
margin-right: 60px;
}
@media screen and (max-width: 768px) {
.u-mr60-sp {
margin-right: 60px;
}
}
@media screen and (min-width: 769px) {
.u-mr60-pc {
margin-right: 60px;
}
}
.u-mr65 {
margin-right: 65px;
}
@media screen and (max-width: 768px) {
.u-mr65-sp {
margin-right: 65px;
}
}
@media screen and (min-width: 769px) {
.u-mr65-pc {
margin-right: 65px;
}
}
.u-mr70 {
margin-right: 70px;
}
@media screen and (max-width: 768px) {
.u-mr70-sp {
margin-right: 70px;
}
}
@media screen and (min-width: 769px) {
.u-mr70-pc {
margin-right: 70px;
}
}
.u-mr75 {
margin-right: 75px;
}
@media screen and (max-width: 768px) {
.u-mr75-sp {
margin-right: 75px;
}
}
@media screen and (min-width: 769px) {
.u-mr75-pc {
margin-right: 75px;
}
}
.u-mr80 {
margin-right: 80px;
}
@media screen and (max-width: 768px) {
.u-mr80-sp {
margin-right: 80px;
}
}
@media screen and (min-width: 769px) {
.u-mr80-pc {
margin-right: 80px;
}
}
.u-mr85 {
margin-right: 85px;
}
@media screen and (max-width: 768px) {
.u-mr85-sp {
margin-right: 85px;
}
}
@media screen and (min-width: 769px) {
.u-mr85-pc {
margin-right: 85px;
}
}
.u-mr90 {
margin-right: 90px;
}
@media screen and (max-width: 768px) {
.u-mr90-sp {
margin-right: 90px;
}
}
@media screen and (min-width: 769px) {
.u-mr90-pc {
margin-right: 90px;
}
}
.u-mr95 {
margin-right: 95px;
}
@media screen and (max-width: 768px) {
.u-mr95-sp {
margin-right: 95px;
}
}
@media screen and (min-width: 769px) {
.u-mr95-pc {
margin-right: 95px;
}
}
.u-mr100 {
margin-right: 100px;
}
@media screen and (max-width: 768px) {
.u-mr100-sp {
margin-right: 100px;
}
}
@media screen and (min-width: 769px) {
.u-mr100-pc {
margin-right: 100px;
}
}
.u-mb00 {
margin-bottom: 0px;
}
@media screen and (max-width: 768px) {
.u-mb00-sp {
margin-bottom: 0px;
}
}
@media screen and (min-width: 769px) {
.u-mb00-pc {
margin-bottom: 0px;
}
}
.u-mb05 {
margin-bottom: 5px;
}
@media screen and (max-width: 768px) {
.u-mb05-sp {
margin-bottom: 5px;
}
}
@media screen and (min-width: 769px) {
.u-mb05-pc {
margin-bottom: 5px;
}
}
.u-mb10 {
margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
.u-mb10-sp {
margin-bottom: 10px;
}
}
@media screen and (min-width: 769px) {
.u-mb10-pc {
margin-bottom: 10px;
}
}
.u-mb15 {
margin-bottom: 15px;
}
@media screen and (max-width: 768px) {
.u-mb15-sp {
margin-bottom: 15px;
}
}
@media screen and (min-width: 769px) {
.u-mb15-pc {
margin-bottom: 15px;
}
}
.u-mb20 {
margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
.u-mb20-sp {
margin-bottom: 20px;
}
}
@media screen and (min-width: 769px) {
.u-mb20-pc {
margin-bottom: 20px;
}
}
.u-mb25 {
margin-bottom: 25px;
}
@media screen and (max-width: 768px) {
.u-mb25-sp {
margin-bottom: 25px;
}
}
@media screen and (min-width: 769px) {
.u-mb25-pc {
margin-bottom: 25px;
}
}
.u-mb30 {
margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
.u-mb30-sp {
margin-bottom: 30px;
}
}
@media screen and (min-width: 769px) {
.u-mb30-pc {
margin-bottom: 30px;
}
}
.u-mb35 {
margin-bottom: 35px;
}
@media screen and (max-width: 768px) {
.u-mb35-sp {
margin-bottom: 35px;
}
}
@media screen and (min-width: 769px) {
.u-mb35-pc {
margin-bottom: 35px;
}
}
.u-mb40 {
margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
.u-mb40-sp {
margin-bottom: 40px;
}
}
@media screen and (min-width: 769px) {
.u-mb40-pc {
margin-bottom: 40px;
}
}
.u-mb45 {
margin-bottom: 45px;
}
@media screen and (max-width: 768px) {
.u-mb45-sp {
margin-bottom: 45px;
}
}
@media screen and (min-width: 769px) {
.u-mb45-pc {
margin-bottom: 45px;
}
}
.u-mb50 {
margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
.u-mb50-sp {
margin-bottom: 50px;
}
}
@media screen and (min-width: 769px) {
.u-mb50-pc {
margin-bottom: 50px;
}
}
.u-mb55 {
margin-bottom: 55px;
}
@media screen and (max-width: 768px) {
.u-mb55-sp {
margin-bottom: 55px;
}
}
@media screen and (min-width: 769px) {
.u-mb55-pc {
margin-bottom: 55px;
}
}
.u-mb60 {
margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
.u-mb60-sp {
margin-bottom: 60px;
}
}
@media screen and (min-width: 769px) {
.u-mb60-pc {
margin-bottom: 60px;
}
}
.u-mb65 {
margin-bottom: 65px;
}
@media screen and (max-width: 768px) {
.u-mb65-sp {
margin-bottom: 65px;
}
}
@media screen and (min-width: 769px) {
.u-mb65-pc {
margin-bottom: 65px;
}
}
.u-mb70 {
margin-bottom: 70px;
}
@media screen and (max-width: 768px) {
.u-mb70-sp {
margin-bottom: 70px;
}
}
@media screen and (min-width: 769px) {
.u-mb70-pc {
margin-bottom: 70px;
}
}
.u-mb75 {
margin-bottom: 75px;
}
@media screen and (max-width: 768px) {
.u-mb75-sp {
margin-bottom: 75px;
}
}
@media screen and (min-width: 769px) {
.u-mb75-pc {
margin-bottom: 75px;
}
}
.u-mb80 {
margin-bottom: 80px;
}
@media screen and (max-width: 768px) {
.u-mb80-sp {
margin-bottom: 80px;
}
}
@media screen and (min-width: 769px) {
.u-mb80-pc {
margin-bottom: 80px;
}
}
.u-mb85 {
margin-bottom: 85px;
}
@media screen and (max-width: 768px) {
.u-mb85-sp {
margin-bottom: 85px;
}
}
@media screen and (min-width: 769px) {
.u-mb85-pc {
margin-bottom: 85px;
}
}
.u-mb90 {
margin-bottom: 90px;
}
@media screen and (max-width: 768px) {
.u-mb90-sp {
margin-bottom: 90px;
}
}
@media screen and (min-width: 769px) {
.u-mb90-pc {
margin-bottom: 90px;
}
}
.u-mb95 {
margin-bottom: 95px;
}
@media screen and (max-width: 768px) {
.u-mb95-sp {
margin-bottom: 95px;
}
}
@media screen and (min-width: 769px) {
.u-mb95-pc {
margin-bottom: 95px;
}
}
.u-mb100 {
margin-bottom: 100px;
}
@media screen and (max-width: 768px) {
.u-mb100-sp {
margin-bottom: 100px;
}
}
@media screen and (min-width: 769px) {
.u-mb100-pc {
margin-bottom: 100px;
}
}
.u-ml00 {
margin-left: 0px;
}
@media screen and (max-width: 768px) {
.u-ml00-sp {
margin-left: 0px;
}
}
@media screen and (min-width: 769px) {
.u-ml00-pc {
margin-left: 0px;
}
}
.u-ml05 {
margin-left: 5px;
}
@media screen and (max-width: 768px) {
.u-ml05-sp {
margin-left: 5px;
}
}
@media screen and (min-width: 769px) {
.u-ml05-pc {
margin-left: 5px;
}
}
.u-ml10 {
margin-left: 10px;
}
@media screen and (max-width: 768px) {
.u-ml10-sp {
margin-left: 10px;
}
}
@media screen and (min-width: 769px) {
.u-ml10-pc {
margin-left: 10px;
}
}
.u-ml15 {
margin-left: 15px;
}
@media screen and (max-width: 768px) {
.u-ml15-sp {
margin-left: 15px;
}
}
@media screen and (min-width: 769px) {
.u-ml15-pc {
margin-left: 15px;
}
}
.u-ml20 {
margin-left: 20px;
}
@media screen and (max-width: 768px) {
.u-ml20-sp {
margin-left: 20px;
}
}
@media screen and (min-width: 769px) {
.u-ml20-pc {
margin-left: 20px;
}
}
.u-ml25 {
margin-left: 25px;
}
@media screen and (max-width: 768px) {
.u-ml25-sp {
margin-left: 25px;
}
}
@media screen and (min-width: 769px) {
.u-ml25-pc {
margin-left: 25px;
}
}
.u-ml30 {
margin-left: 30px;
}
@media screen and (max-width: 768px) {
.u-ml30-sp {
margin-left: 30px;
}
}
@media screen and (min-width: 769px) {
.u-ml30-pc {
margin-left: 30px;
}
}
.u-ml35 {
margin-left: 35px;
}
@media screen and (max-width: 768px) {
.u-ml35-sp {
margin-left: 35px;
}
}
@media screen and (min-width: 769px) {
.u-ml35-pc {
margin-left: 35px;
}
}
.u-ml40 {
margin-left: 40px;
}
@media screen and (max-width: 768px) {
.u-ml40-sp {
margin-left: 40px;
}
}
@media screen and (min-width: 769px) {
.u-ml40-pc {
margin-left: 40px;
}
}
.u-ml45 {
margin-left: 45px;
}
@media screen and (max-width: 768px) {
.u-ml45-sp {
margin-left: 45px;
}
}
@media screen and (min-width: 769px) {
.u-ml45-pc {
margin-left: 45px;
}
}
.u-ml50 {
margin-left: 50px;
}
@media screen and (max-width: 768px) {
.u-ml50-sp {
margin-left: 50px;
}
}
@media screen and (min-width: 769px) {
.u-ml50-pc {
margin-left: 50px;
}
}
.u-ml55 {
margin-left: 55px;
}
@media screen and (max-width: 768px) {
.u-ml55-sp {
margin-left: 55px;
}
}
@media screen and (min-width: 769px) {
.u-ml55-pc {
margin-left: 55px;
}
}
.u-ml60 {
margin-left: 60px;
}
@media screen and (max-width: 768px) {
.u-ml60-sp {
margin-left: 60px;
}
}
@media screen and (min-width: 769px) {
.u-ml60-pc {
margin-left: 60px;
}
}
.u-ml65 {
margin-left: 65px;
}
@media screen and (max-width: 768px) {
.u-ml65-sp {
margin-left: 65px;
}
}
@media screen and (min-width: 769px) {
.u-ml65-pc {
margin-left: 65px;
}
}
.u-ml70 {
margin-left: 70px;
}
@media screen and (max-width: 768px) {
.u-ml70-sp {
margin-left: 70px;
}
}
@media screen and (min-width: 769px) {
.u-ml70-pc {
margin-left: 70px;
}
}
.u-ml75 {
margin-left: 75px;
}
@media screen and (max-width: 768px) {
.u-ml75-sp {
margin-left: 75px;
}
}
@media screen and (min-width: 769px) {
.u-ml75-pc {
margin-left: 75px;
}
}
.u-ml80 {
margin-left: 80px;
}
@media screen and (max-width: 768px) {
.u-ml80-sp {
margin-left: 80px;
}
}
@media screen and (min-width: 769px) {
.u-ml80-pc {
margin-left: 80px;
}
}
.u-ml85 {
margin-left: 85px;
}
@media screen and (max-width: 768px) {
.u-ml85-sp {
margin-left: 85px;
}
}
@media screen and (min-width: 769px) {
.u-ml85-pc {
margin-left: 85px;
}
}
.u-ml90 {
margin-left: 90px;
}
@media screen and (max-width: 768px) {
.u-ml90-sp {
margin-left: 90px;
}
}
@media screen and (min-width: 769px) {
.u-ml90-pc {
margin-left: 90px;
}
}
.u-ml95 {
margin-left: 95px;
}
@media screen and (max-width: 768px) {
.u-ml95-sp {
margin-left: 95px;
}
}
@media screen and (min-width: 769px) {
.u-ml95-pc {
margin-left: 95px;
}
}
.u-ml100 {
margin-left: 100px;
}
@media screen and (max-width: 768px) {
.u-ml100-sp {
margin-left: 100px;
}
}
@media screen and (min-width: 769px) {
.u-ml100-pc {
margin-left: 100px;
}
}
.u-pt00 {
padding-top: 0px;
}
@media screen and (max-width: 768px) {
.u-pt00-sp {
padding-top: 0px;
}
}
@media screen and (min-width: 769px) {
.u-pt00-pc {
padding-top: 0px;
}
}
.u-pt05 {
padding-top: 5px;
}
@media screen and (max-width: 768px) {
.u-pt05-sp {
padding-top: 5px;
}
}
@media screen and (min-width: 769px) {
.u-pt05-pc {
padding-top: 5px;
}
}
.u-pt10 {
padding-top: 10px;
}
@media screen and (max-width: 768px) {
.u-pt10-sp {
padding-top: 10px;
}
}
@media screen and (min-width: 769px) {
.u-pt10-pc {
padding-top: 10px;
}
}
.u-pt15 {
padding-top: 15px;
}
@media screen and (max-width: 768px) {
.u-pt15-sp {
padding-top: 15px;
}
}
@media screen and (min-width: 769px) {
.u-pt15-pc {
padding-top: 15px;
}
}
.u-pt20 {
padding-top: 20px;
}
@media screen and (max-width: 768px) {
.u-pt20-sp {
padding-top: 20px;
}
}
@media screen and (min-width: 769px) {
.u-pt20-pc {
padding-top: 20px;
}
}
.u-pt25 {
padding-top: 25px;
}
@media screen and (max-width: 768px) {
.u-pt25-sp {
padding-top: 25px;
}
}
@media screen and (min-width: 769px) {
.u-pt25-pc {
padding-top: 25px;
}
}
.u-pt30 {
padding-top: 30px;
}
@media screen and (max-width: 768px) {
.u-pt30-sp {
padding-top: 30px;
}
}
@media screen and (min-width: 769px) {
.u-pt30-pc {
padding-top: 30px;
}
}
.u-pt35 {
padding-top: 35px;
}
@media screen and (max-width: 768px) {
.u-pt35-sp {
padding-top: 35px;
}
}
@media screen and (min-width: 769px) {
.u-pt35-pc {
padding-top: 35px;
}
}
.u-pt40 {
padding-top: 40px;
}
@media screen and (max-width: 768px) {
.u-pt40-sp {
padding-top: 40px;
}
}
@media screen and (min-width: 769px) {
.u-pt40-pc {
padding-top: 40px;
}
}
.u-pt45 {
padding-top: 45px;
}
@media screen and (max-width: 768px) {
.u-pt45-sp {
padding-top: 45px;
}
}
@media screen and (min-width: 769px) {
.u-pt45-pc {
padding-top: 45px;
}
}
.u-pt50 {
padding-top: 50px;
}
@media screen and (max-width: 768px) {
.u-pt50-sp {
padding-top: 50px;
}
}
@media screen and (min-width: 769px) {
.u-pt50-pc {
padding-top: 50px;
}
}
.u-pt55 {
padding-top: 55px;
}
@media screen and (max-width: 768px) {
.u-pt55-sp {
padding-top: 55px;
}
}
@media screen and (min-width: 769px) {
.u-pt55-pc {
padding-top: 55px;
}
}
.u-pt60 {
padding-top: 60px;
}
@media screen and (max-width: 768px) {
.u-pt60-sp {
padding-top: 60px;
}
}
@media screen and (min-width: 769px) {
.u-pt60-pc {
padding-top: 60px;
}
}
.u-pt65 {
padding-top: 65px;
}
@media screen and (max-width: 768px) {
.u-pt65-sp {
padding-top: 65px;
}
}
@media screen and (min-width: 769px) {
.u-pt65-pc {
padding-top: 65px;
}
}
.u-pt70 {
padding-top: 70px;
}
@media screen and (max-width: 768px) {
.u-pt70-sp {
padding-top: 70px;
}
}
@media screen and (min-width: 769px) {
.u-pt70-pc {
padding-top: 70px;
}
}
.u-pt75 {
padding-top: 75px;
}
@media screen and (max-width: 768px) {
.u-pt75-sp {
padding-top: 75px;
}
}
@media screen and (min-width: 769px) {
.u-pt75-pc {
padding-top: 75px;
}
}
.u-pt80 {
padding-top: 80px;
}
@media screen and (max-width: 768px) {
.u-pt80-sp {
padding-top: 80px;
}
}
@media screen and (min-width: 769px) {
.u-pt80-pc {
padding-top: 80px;
}
}
.u-pt85 {
padding-top: 85px;
}
@media screen and (max-width: 768px) {
.u-pt85-sp {
padding-top: 85px;
}
}
@media screen and (min-width: 769px) {
.u-pt85-pc {
padding-top: 85px;
}
}
.u-pt90 {
padding-top: 90px;
}
@media screen and (max-width: 768px) {
.u-pt90-sp {
padding-top: 90px;
}
}
@media screen and (min-width: 769px) {
.u-pt90-pc {
padding-top: 90px;
}
}
.u-pt95 {
padding-top: 95px;
}
@media screen and (max-width: 768px) {
.u-pt95-sp {
padding-top: 95px;
}
}
@media screen and (min-width: 769px) {
.u-pt95-pc {
padding-top: 95px;
}
}
.u-pt100 {
padding-top: 100px;
}
@media screen and (max-width: 768px) {
.u-pt100-sp {
padding-top: 100px;
}
}
@media screen and (min-width: 769px) {
.u-pt100-pc {
padding-top: 100px;
}
}
.u-pr00 {
padding-right: 0px;
}
@media screen and (max-width: 768px) {
.u-pr00-sp {
padding-right: 0px;
}
}
@media screen and (min-width: 769px) {
.u-pr00-pc {
padding-right: 0px;
}
}
.u-pr05 {
padding-right: 5px;
}
@media screen and (max-width: 768px) {
.u-pr05-sp {
padding-right: 5px;
}
}
@media screen and (min-width: 769px) {
.u-pr05-pc {
padding-right: 5px;
}
}
.u-pr10 {
padding-right: 10px;
}
@media screen and (max-width: 768px) {
.u-pr10-sp {
padding-right: 10px;
}
}
@media screen and (min-width: 769px) {
.u-pr10-pc {
padding-right: 10px;
}
}
.u-pr15 {
padding-right: 15px;
}
@media screen and (max-width: 768px) {
.u-pr15-sp {
padding-right: 15px;
}
}
@media screen and (min-width: 769px) {
.u-pr15-pc {
padding-right: 15px;
}
}
.u-pr20 {
padding-right: 20px;
}
@media screen and (max-width: 768px) {
.u-pr20-sp {
padding-right: 20px;
}
}
@media screen and (min-width: 769px) {
.u-pr20-pc {
padding-right: 20px;
}
}
.u-pr25 {
padding-right: 25px;
}
@media screen and (max-width: 768px) {
.u-pr25-sp {
padding-right: 25px;
}
}
@media screen and (min-width: 769px) {
.u-pr25-pc {
padding-right: 25px;
}
}
.u-pr30 {
padding-right: 30px;
}
@media screen and (max-width: 768px) {
.u-pr30-sp {
padding-right: 30px;
}
}
@media screen and (min-width: 769px) {
.u-pr30-pc {
padding-right: 30px;
}
}
.u-pr35 {
padding-right: 35px;
}
@media screen and (max-width: 768px) {
.u-pr35-sp {
padding-right: 35px;
}
}
@media screen and (min-width: 769px) {
.u-pr35-pc {
padding-right: 35px;
}
}
.u-pr40 {
padding-right: 40px;
}
@media screen and (max-width: 768px) {
.u-pr40-sp {
padding-right: 40px;
}
}
@media screen and (min-width: 769px) {
.u-pr40-pc {
padding-right: 40px;
}
}
.u-pr45 {
padding-right: 45px;
}
@media screen and (max-width: 768px) {
.u-pr45-sp {
padding-right: 45px;
}
}
@media screen and (min-width: 769px) {
.u-pr45-pc {
padding-right: 45px;
}
}
.u-pr50 {
padding-right: 50px;
}
@media screen and (max-width: 768px) {
.u-pr50-sp {
padding-right: 50px;
}
}
@media screen and (min-width: 769px) {
.u-pr50-pc {
padding-right: 50px;
}
}
.u-pr55 {
padding-right: 55px;
}
@media screen and (max-width: 768px) {
.u-pr55-sp {
padding-right: 55px;
}
}
@media screen and (min-width: 769px) {
.u-pr55-pc {
padding-right: 55px;
}
}
.u-pr60 {
padding-right: 60px;
}
@media screen and (max-width: 768px) {
.u-pr60-sp {
padding-right: 60px;
}
}
@media screen and (min-width: 769px) {
.u-pr60-pc {
padding-right: 60px;
}
}
.u-pr65 {
padding-right: 65px;
}
@media screen and (max-width: 768px) {
.u-pr65-sp {
padding-right: 65px;
}
}
@media screen and (min-width: 769px) {
.u-pr65-pc {
padding-right: 65px;
}
}
.u-pr70 {
padding-right: 70px;
}
@media screen and (max-width: 768px) {
.u-pr70-sp {
padding-right: 70px;
}
}
@media screen and (min-width: 769px) {
.u-pr70-pc {
padding-right: 70px;
}
}
.u-pr75 {
padding-right: 75px;
}
@media screen and (max-width: 768px) {
.u-pr75-sp {
padding-right: 75px;
}
}
@media screen and (min-width: 769px) {
.u-pr75-pc {
padding-right: 75px;
}
}
.u-pr80 {
padding-right: 80px;
}
@media screen and (max-width: 768px) {
.u-pr80-sp {
padding-right: 80px;
}
}
@media screen and (min-width: 769px) {
.u-pr80-pc {
padding-right: 80px;
}
}
.u-pr85 {
padding-right: 85px;
}
@media screen and (max-width: 768px) {
.u-pr85-sp {
padding-right: 85px;
}
}
@media screen and (min-width: 769px) {
.u-pr85-pc {
padding-right: 85px;
}
}
.u-pr90 {
padding-right: 90px;
}
@media screen and (max-width: 768px) {
.u-pr90-sp {
padding-right: 90px;
}
}
@media screen and (min-width: 769px) {
.u-pr90-pc {
padding-right: 90px;
}
}
.u-pr95 {
padding-right: 95px;
}
@media screen and (max-width: 768px) {
.u-pr95-sp {
padding-right: 95px;
}
}
@media screen and (min-width: 769px) {
.u-pr95-pc {
padding-right: 95px;
}
}
.u-pr100 {
padding-right: 100px;
}
@media screen and (max-width: 768px) {
.u-pr100-sp {
padding-right: 100px;
}
}
@media screen and (min-width: 769px) {
.u-pr100-pc {
padding-right: 100px;
}
}
.u-pb00 {
padding-bottom: 0px;
}
@media screen and (max-width: 768px) {
.u-pb00-sp {
padding-bottom: 0px;
}
}
@media screen and (min-width: 769px) {
.u-pb00-pc {
padding-bottom: 0px;
}
}
.u-pb05 {
padding-bottom: 5px;
}
@media screen and (max-width: 768px) {
.u-pb05-sp {
padding-bottom: 5px;
}
}
@media screen and (min-width: 769px) {
.u-pb05-pc {
padding-bottom: 5px;
}
}
.u-pb10 {
padding-bottom: 10px;
}
@media screen and (max-width: 768px) {
.u-pb10-sp {
padding-bottom: 10px;
}
}
@media screen and (min-width: 769px) {
.u-pb10-pc {
padding-bottom: 10px;
}
}
.u-pb15 {
padding-bottom: 15px;
}
@media screen and (max-width: 768px) {
.u-pb15-sp {
padding-bottom: 15px;
}
}
@media screen and (min-width: 769px) {
.u-pb15-pc {
padding-bottom: 15px;
}
}
.u-pb20 {
padding-bottom: 20px;
}
@media screen and (max-width: 768px) {
.u-pb20-sp {
padding-bottom: 20px;
}
}
@media screen and (min-width: 769px) {
.u-pb20-pc {
padding-bottom: 20px;
}
}
.u-pb25 {
padding-bottom: 25px;
}
@media screen and (max-width: 768px) {
.u-pb25-sp {
padding-bottom: 25px;
}
}
@media screen and (min-width: 769px) {
.u-pb25-pc {
padding-bottom: 25px;
}
}
.u-pb30 {
padding-bottom: 30px;
}
@media screen and (max-width: 768px) {
.u-pb30-sp {
padding-bottom: 30px;
}
}
@media screen and (min-width: 769px) {
.u-pb30-pc {
padding-bottom: 30px;
}
}
.u-pb35 {
padding-bottom: 35px;
}
@media screen and (max-width: 768px) {
.u-pb35-sp {
padding-bottom: 35px;
}
}
@media screen and (min-width: 769px) {
.u-pb35-pc {
padding-bottom: 35px;
}
}
.u-pb40 {
padding-bottom: 40px;
}
@media screen and (max-width: 768px) {
.u-pb40-sp {
padding-bottom: 40px;
}
}
@media screen and (min-width: 769px) {
.u-pb40-pc {
padding-bottom: 40px;
}
}
.u-pb45 {
padding-bottom: 45px;
}
@media screen and (max-width: 768px) {
.u-pb45-sp {
padding-bottom: 45px;
}
}
@media screen and (min-width: 769px) {
.u-pb45-pc {
padding-bottom: 45px;
}
}
.u-pb50 {
padding-bottom: 50px;
}
@media screen and (max-width: 768px) {
.u-pb50-sp {
padding-bottom: 50px;
}
}
@media screen and (min-width: 769px) {
.u-pb50-pc {
padding-bottom: 50px;
}
}
.u-pb55 {
padding-bottom: 55px;
}
@media screen and (max-width: 768px) {
.u-pb55-sp {
padding-bottom: 55px;
}
}
@media screen and (min-width: 769px) {
.u-pb55-pc {
padding-bottom: 55px;
}
}
.u-pb60 {
padding-bottom: 60px;
}
@media screen and (max-width: 768px) {
.u-pb60-sp {
padding-bottom: 60px;
}
}
@media screen and (min-width: 769px) {
.u-pb60-pc {
padding-bottom: 60px;
}
}
.u-pb65 {
padding-bottom: 65px;
}
@media screen and (max-width: 768px) {
.u-pb65-sp {
padding-bottom: 65px;
}
}
@media screen and (min-width: 769px) {
.u-pb65-pc {
padding-bottom: 65px;
}
}
.u-pb70 {
padding-bottom: 70px;
}
@media screen and (max-width: 768px) {
.u-pb70-sp {
padding-bottom: 70px;
}
}
@media screen and (min-width: 769px) {
.u-pb70-pc {
padding-bottom: 70px;
}
}
.u-pb75 {
padding-bottom: 75px;
}
@media screen and (max-width: 768px) {
.u-pb75-sp {
padding-bottom: 75px;
}
}
@media screen and (min-width: 769px) {
.u-pb75-pc {
padding-bottom: 75px;
}
}
.u-pb80 {
padding-bottom: 80px;
}
@media screen and (max-width: 768px) {
.u-pb80-sp {
padding-bottom: 80px;
}
}
@media screen and (min-width: 769px) {
.u-pb80-pc {
padding-bottom: 80px;
}
}
.u-pb85 {
padding-bottom: 85px;
}
@media screen and (max-width: 768px) {
.u-pb85-sp {
padding-bottom: 85px;
}
}
@media screen and (min-width: 769px) {
.u-pb85-pc {
padding-bottom: 85px;
}
}
.u-pb90 {
padding-bottom: 90px;
}
@media screen and (max-width: 768px) {
.u-pb90-sp {
padding-bottom: 90px;
}
}
@media screen and (min-width: 769px) {
.u-pb90-pc {
padding-bottom: 90px;
}
}
.u-pb95 {
padding-bottom: 95px;
}
@media screen and (max-width: 768px) {
.u-pb95-sp {
padding-bottom: 95px;
}
}
@media screen and (min-width: 769px) {
.u-pb95-pc {
padding-bottom: 95px;
}
}
.u-pb100 {
padding-bottom: 100px;
}
@media screen and (max-width: 768px) {
.u-pb100-sp {
padding-bottom: 100px;
}
}
@media screen and (min-width: 769px) {
.u-pb100-pc {
padding-bottom: 100px;
}
}
.u-pl00 {
padding-left: 0px;
}
@media screen and (max-width: 768px) {
.u-pl00-sp {
padding-left: 0px;
}
}
@media screen and (min-width: 769px) {
.u-pl00-pc {
padding-left: 0px;
}
}
.u-pl05 {
padding-left: 5px;
}
@media screen and (max-width: 768px) {
.u-pl05-sp {
padding-left: 5px;
}
}
@media screen and (min-width: 769px) {
.u-pl05-pc {
padding-left: 5px;
}
}
.u-pl10 {
padding-left: 10px;
}
@media screen and (max-width: 768px) {
.u-pl10-sp {
padding-left: 10px;
}
}
@media screen and (min-width: 769px) {
.u-pl10-pc {
padding-left: 10px;
}
}
.u-pl15 {
padding-left: 15px;
}
@media screen and (max-width: 768px) {
.u-pl15-sp {
padding-left: 15px;
}
}
@media screen and (min-width: 769px) {
.u-pl15-pc {
padding-left: 15px;
}
}
.u-pl20 {
padding-left: 20px;
}
@media screen and (max-width: 768px) {
.u-pl20-sp {
padding-left: 20px;
}
}
@media screen and (min-width: 769px) {
.u-pl20-pc {
padding-left: 20px;
}
}
.u-pl25 {
padding-left: 25px;
}
@media screen and (max-width: 768px) {
.u-pl25-sp {
padding-left: 25px;
}
}
@media screen and (min-width: 769px) {
.u-pl25-pc {
padding-left: 25px;
}
}
.u-pl30 {
padding-left: 30px;
}
@media screen and (max-width: 768px) {
.u-pl30-sp {
padding-left: 30px;
}
}
@media screen and (min-width: 769px) {
.u-pl30-pc {
padding-left: 30px;
}
}
.u-pl35 {
padding-left: 35px;
}
@media screen and (max-width: 768px) {
.u-pl35-sp {
padding-left: 35px;
}
}
@media screen and (min-width: 769px) {
.u-pl35-pc {
padding-left: 35px;
}
}
.u-pl40 {
padding-left: 40px;
}
@media screen and (max-width: 768px) {
.u-pl40-sp {
padding-left: 40px;
}
}
@media screen and (min-width: 769px) {
.u-pl40-pc {
padding-left: 40px;
}
}
.u-pl45 {
padding-left: 45px;
}
@media screen and (max-width: 768px) {
.u-pl45-sp {
padding-left: 45px;
}
}
@media screen and (min-width: 769px) {
.u-pl45-pc {
padding-left: 45px;
}
}
.u-pl50 {
padding-left: 50px;
}
@media screen and (max-width: 768px) {
.u-pl50-sp {
padding-left: 50px;
}
}
@media screen and (min-width: 769px) {
.u-pl50-pc {
padding-left: 50px;
}
}
.u-pl55 {
padding-left: 55px;
}
@media screen and (max-width: 768px) {
.u-pl55-sp {
padding-left: 55px;
}
}
@media screen and (min-width: 769px) {
.u-pl55-pc {
padding-left: 55px;
}
}
.u-pl60 {
padding-left: 60px;
}
@media screen and (max-width: 768px) {
.u-pl60-sp {
padding-left: 60px;
}
}
@media screen and (min-width: 769px) {
.u-pl60-pc {
padding-left: 60px;
}
}
.u-pl65 {
padding-left: 65px;
}
@media screen and (max-width: 768px) {
.u-pl65-sp {
padding-left: 65px;
}
}
@media screen and (min-width: 769px) {
.u-pl65-pc {
padding-left: 65px;
}
}
.u-pl70 {
padding-left: 70px;
}
@media screen and (max-width: 768px) {
.u-pl70-sp {
padding-left: 70px;
}
}
@media screen and (min-width: 769px) {
.u-pl70-pc {
padding-left: 70px;
}
}
.u-pl75 {
padding-left: 75px;
}
@media screen and (max-width: 768px) {
.u-pl75-sp {
padding-left: 75px;
}
}
@media screen and (min-width: 769px) {
.u-pl75-pc {
padding-left: 75px;
}
}
.u-pl80 {
padding-left: 80px;
}
@media screen and (max-width: 768px) {
.u-pl80-sp {
padding-left: 80px;
}
}
@media screen and (min-width: 769px) {
.u-pl80-pc {
padding-left: 80px;
}
}
.u-pl85 {
padding-left: 85px;
}
@media screen and (max-width: 768px) {
.u-pl85-sp {
padding-left: 85px;
}
}
@media screen and (min-width: 769px) {
.u-pl85-pc {
padding-left: 85px;
}
}
.u-pl90 {
padding-left: 90px;
}
@media screen and (max-width: 768px) {
.u-pl90-sp {
padding-left: 90px;
}
}
@media screen and (min-width: 769px) {
.u-pl90-pc {
padding-left: 90px;
}
}
.u-pl95 {
padding-left: 95px;
}
@media screen and (max-width: 768px) {
.u-pl95-sp {
padding-left: 95px;
}
}
@media screen and (min-width: 769px) {
.u-pl95-pc {
padding-left: 95px;
}
}
.u-pl100 {
padding-left: 100px;
}
@media screen and (max-width: 768px) {
.u-pl100-sp {
padding-left: 100px;
}
}
@media screen and (min-width: 769px) {
.u-pl100-pc {
padding-left: 100px;
}
}
.u-offwhite {
color: #DCDDDD;
}
@media screen and (max-width: 768px) {
.u-offwhite-sp {
color: #DCDDDD;
}
}
@media screen and (min-width: 769px) {
.u-offwhite-pc {
color: #DCDDDD;
}
}
.u-gold {
color: #C6AA80;
}
@media screen and (max-width: 768px) {
.u-gold-sp {
color: #C6AA80;
}
}
@media screen and (min-width: 769px) {
.u-gold-pc {
color: #C6AA80;
}
}
.u-gray {
color: #898989;
}
@media screen and (max-width: 768px) {
.u-gray-sp {
color: #898989;
}
}
@media screen and (min-width: 769px) {
.u-gray-pc {
color: #898989;
}
}
.u-fj {
font-family: vdl-v7mincho, sans-serif;
}
@media screen and (max-width: 768px) {
.u-fj-sp {
font-family: vdl-v7mincho, sans-serif;
}
}
@media screen and (min-width: 769px) {
.u-fj-pc {
font-family: vdl-v7mincho, sans-serif;
}
}
.u-fe {
font-family: "Philosopher", sans-serif;
}
@media screen and (max-width: 768px) {
.u-fe-sp {
font-family: "Philosopher", sans-serif;
}
}
@media screen and (min-width: 769px) {
.u-fe-pc {
font-family: "Philosopher", sans-serif;
}
}
.u-marginauto {
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 768px) {
.u-marginauto-sp {
margin-left: auto;
margin-right: auto;
}
}
@media screen and (min-width: 769px) {
.u-marginauto-pc {
margin-left: auto;
margin-right: auto;
}
}
@media screen and (min-width: 769px) {
.index-movie {
width: 1126px;
padding-bottom: 120px;
display: flex;
flex-direction: column;
gap: 50px;
margin: 88px auto 0;
}
}
@media screen and (max-width: 768px) {
.index-movie {
width: 84%;
padding-bottom: 90px;
margin: 79px auto 0;
}
}
.index-movie__item {
display: flex;
background-color: #fff;
}
@media screen and (min-width: 769px) {
.index-movie__item {
}
}
@media screen and (max-width: 768px) {
.index-movie__item {
flex-direction: column;
}
}
@media screen and (min-width: 769px) {
.index-movie__figurearea {
width: 50%;
}
}
@media screen and (max-width: 768px) {
.index-movie__figurearea {
width: 100%;
}
}
.index-movie__figurearea iframe {
width: 100%;
height: auto;
aspect-ratio: 563 / 321;
}
@media screen and (min-width: 769px) {
.index-movie__main {
width: 50%;
padding: 0 55px;
display: flex;
flex-direction: column;
justify-content: center;
}
}
@media screen and (max-width: 768px) {
.index-movie__main {
padding: 25px;
}
}
@media screen and (min-width: 769px) {
.index-movie__main-head {}
}
@media screen and (max-width: 768px) {
.index-movie__main-head {
display: flex;
gap: 15px;
margin-bottom: 20px;
}
}
.index-movie__type {
border: 1px solid #C6AA80;
color: #C6AA80;
font-family: vdl-v7mincho, sans-serif;
letter-spacing: 0.15em;
display: inline-flex;
justify-content: center;
align-items: center;
}
@media screen and (min-width: 769px) {
.index-movie__type {
height: 20px;
padding: 0 10px;
font-size: 12px;
margin-bottom: 31px;
}
}
@media screen and (max-width: 768px) {
.index-movie__type {
height: 19px;
padding: 0 8px;
font-size: 11px;
}
}
.index-movie__ttl {
font-weight: 500;
letter-spacing: 0.05em;
}
@media screen and (min-width: 769px) {
.index-movie__ttl {
font-size: 20px;
margin-bottom: 32px;
}
}
@media screen and (max-width: 768px) {
.index-movie__ttl {
font-size: 15px;
}
}
.index-movie__tag {
display: flex;
flex-wrap: wrap;
gap: 10px;
list-style: none;
}
@media screen and (min-width: 769px) {
.index-movie__tag {
margin-bottom: 33px;
}
}
@media screen and (max-width: 768px) {
.index-movie__tag {
margin-bottom: 19px;
}
}
.index-movie__tag-item {
font-weight: 500;
letter-spacing: 0.08em;
}
@media screen and (min-width: 769px) {
.index-movie__tag-item {
font-size: 12px;
}
}
@media screen and (max-width: 768px) {
.index-movie__tag-item {
font-size: 10px;
}
}
.index-movie__tag-item:before {
content: "#";
}
.index-movie__link {
color: #212121;
font-weight: 500;
letter-spacing: 0.05em;
}
@media screen and (min-width: 769px) {
.index-movie__link {
font-size: 15px;
}
}
@media screen and (max-width: 768px) {
.index-movie__link {
font-size: 12px;
}
}
.index-movie__link:after {
content: " >";
}
.mb60{
padding-bottom: 60px;
}