@charset "UTF-8";
@import url('css/reset.css');

body{
background: #f9f8f8;
color: #000;
font-weight: lighter;
font-size: .8rem;
font-family: Noto Sans JP, sans-serif, Open Sans, Hiragino Kaku Gothic ProN, Meiryo;
letter-spacing: .25rem;
line-height: 1.8;
overflow: hidden;
overflow-y: scroll;
cursor: none; 
}


/*
------------------------------------------------------
common
------------------------------------------------------
*/

.noto-sans-jp {
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-weight: 100;
font-style: normal;
}

::selection {
background: #d5ba9780;
}

.non-display{
display: none;
}

a{
color: #000;
text-decoration: none;
}

link a {
display: inline-block;
border-bottom: 1px solid #000;
color: #000;
}

.link{
width: fit-content;
margin-top: 2rem;
}

.link a {
display: inline-block;
position: relative;
}

.link a::before {
  position: absolute;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #525050;
  bottom: -2px;

}

.link a::after {
  position: absolute;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #dcdcdc;
  bottom: -2px;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform 0.3s;
}

.link a:hover::after {
  transform: scale(1, 1);
  transform-origin: left top;
}



h1{
font-weight: lighter;
font-size: 3rem;
}

h2{
font-weight: lighter;
font-size: 1rem;
color: #B19A7D;
}

.sub-head h2::before {
content: "";
display: inline-block;
width: .5rem;
height: .5rem;
background-size: contain;
background: #B19A7D;
border-radius: 20rem;
margin-right: 0.9rem;
}

.title h2::before {
content: "";
display: inline-block;
width: .5rem;
height: .5rem;
background-size: contain;
background: #B19A7D;
border-radius: 20rem;
margin-right: 0.9rem;
}

h3{
margin-bottom: 3rem;
}

.bold{
font-weight: normal;
}

.small{
font-size: .6rem;
}

img{
object-fit: cover;
}

.fixed{
position: fixed;
}

.flex-box{
display: flex;
}

.red{
color: red;
}

.non-display{
display: none;
}

.marker{
background: linear-gradient(
transparent 70%,
#d5ba9778 40%
);
}


/**----- カレント -----**/
.menu-content li {
position: relative;
}

/* 通常時 */ 
.header-nav__item a {
color: #000;
font-weight: ;
}

/* カレント表示 */
.header-nav__item.current a::after{
content: "";
display: block;
width: .5rem;
height: .5rem;
background-size: contain;
background: #B19A7D;
border-radius: 20rem;
margin-right: 0;
position: absolute;
bottom: -19px;
left: 50%;
transform: translateX(-50%);
}


/**----- icon -----**/
.g-map__icon {
align-items: center;
display: flex;
ustify-content: start;
padding: 2rem 0 0 0;
}

.g-map__icon::after {
content: "";
display: inline-block;
width: 1rem;
height: 1rem;
background: url(img/common/g-map__icon.png) no-repeat;
background-size: contain;
margin-left: 1em;
transform: rotate(0deg);
}


.arrow__icon{
width: fit-content;
margin-top: 5rem;
align-items: center;
display: flex;
ustify-content: start;
}

.arrow__icon::after {
content: "";
display: inline-block;
width: 1rem;
height: 1rem;
background: url(img/common/arrow.png) no-repeat;
background-size: contain;
margin-left: .5em;
transform: rotate(180deg);
filter: invert(1);
}

.scrol-arrow__icon{
align-items: center;
display: flex;
ustify-content: start;
white-space: nowrap;
}

.scrol-arrow__icon::before {
content: "";
display: inline-block;
width: 1rem;
height: 1rem;
background: url(img/common/arrow.png) no-repeat;
background-size: contain;
margin-right: 1em;
transform: rotate(-90deg);
filter: invert(1);
}

.scrol-arrow__icon::after {
content: "";
display: inline-block;
width: 100%;
/* height: 1rem; */
/* background: url(img/common/arrow.png) no-repeat; */
background-size: contain;
margin-right: 1em;
transform: rotate(0deg);
/* filter: invert(1); */
border: .01rem solid #B19A7D;
margin-right: auto;
}
 
/**----- 改行 -----**/
.br::before {
content: "\A";
white-space: pre;
}

/*-- パンくず --*/
.breadcrumb-box {
font-size: .6rem;
width: 95%;
margin-top: 13rem;
margin-left: auto;
margin-right: auto;
display: flex;
flex-wrap: wrap;
list-style: none;
}

.breadcrumb-box nav {
display: contents;
}

.breadcrumb{
border-bottom: 1px solid;
}

.breadcrumb-box nav li {
display: inline-block;
margin: 0;
}

.breadcrumb li:not(:last-of-type)::after {
content: "›";
margin: 0 .6em;
color: #000;
}

.other-contents{
margin-top: 3rem;
}

/**----- カーソル -----**/
#scrolltarget{
display: none;
position: fixed;
top: 0;
left: 0;
}

#cursor{
position: fixed;
background: #B19A7D;
border-radius:10px;
width: 1em;
height: 1em;
margin: -10px 0 0 -10px;
z-index: 1000;
pointer-events: none;
opacity: 0;
transition: transform 0.1s;
}

#stalker{
position: fixed;
background: #B19A7D;
width: 100px;
height: 100px;
border-radius:30px;
margin: -30px 0 0 -30px;
z-index: 999;
pointer-events: none;
opacity: 0;
transition: transform 0.5s;
}

#cursor.active,
#stalker.active{
transform: scale(4.5);
}




/*
------------------------------------------------------
header
------------------------------------------------------
*/

header {
top: 1rem;
position: fixed;
position: -webkit-sticky;
width: 100%;
z-index: 1000;
box-sizing: border-box;
margin: 0 auto;
}

.header-content-inner{
width: 95%;
margin-left: auto;
margin-right: auto;
}

header nav, header .head-logo {
flex-shrink: 0;
position: relative;
}

header .head-logo img{
width: 84px;
}

header nav{
height: auto;
overflow: visible;
text-align: end;
position: relative;
}

header li {
margin-right: 1rem;
margin-bottom: 0.8rem;
height: auto;
overflow: visible;
text-align: end;
display: inline-block;
}

header li:last-child{
margin-right: 0;
margin-bottom: 0;
}

header .flexbox {
display: flex;
justify-content: space-between;
align-items: center;
height: 60px;
margin: 0 auto;
}

.arrow {
margin-right: 10px;
transform: rotate( -90deg );
width: 20px;
height: 20px;
}

.arrow-up {
margin-left: 10px;
transform: rotate( 90deg );
width: 45px;
height: 45px;
}

span.scroll-text{
position: relative;
top: -5px;
font-size: 8px;
left: -5px;
}


/*------------- nav -------------*/

.menu {
margin-right: 10px;
}

.menu ul {
display: flex;
justify-content: space-around;
list-style: none;
padding: 0;
}

.menu li {
margin-left: 35px;
line-height: 1.5;
position: relative;
}

.menu li a {
text-decoration: none;
color: #fff;
font-size: 12px;
letter-spacing: 2px;
}

.menu li.onlineshop a {
display: inline-block;
padding: 1px 18px;
background-color: white;
color: black;
border-radius: 20px;
text-decoration: none;
transition: 0.3s;
}

.menu-icon {
cursor: pointer;
font-size: 12px;
text-align: center;
color: #fff;
z-index: 1000;
}

.mobile-hidden {
display: none;
}


/*
------------------------------------------------------
fv
------------------------------------------------------
*/

.fv{
width: 100%;
height: 100vh;
position: relative;
}

.fv .fv-title{
width: 95%;
position: fixed;
display: block;
left: 2.5%;
top: 50%;
transform: translate(0%, -50%);
z-index: 1;
}

.side-fixed {
width: 100%;
height: 100vh;
right: 0;
position: relative;
z-index: 1;
}


#circular-text {
z-index: 1;
position: fixed !important;
font-size: .7rem !important;
font-weight: inherit;
color: #B19A7D !important;
letter-spacing: -0.5em;
top: 50% !important;
right: 2.5% !important;
transform: translate(0, -50%) !important;
font-family: Noto Sans JP, sans-serif, Open Sans, Hiragino Kaku Gothic ProN, Meiryo !important;
}

.fv-scroll{
position: fixed;
width: 95%;
left: 2.5%;
bottom: 2rem;
z-index: 3;
}

.text-fead{
color:#000;
animation: text-focus-in 1.5s;
animation-fill-mode:forwards;
}

@keyframes text-focus-in {
0% {
filter: blur(12px);
opacity: 0;
}
100% {
filter: blur(0px);
opacity: 1;
}
}



/*
------------------------------------------------------
main-content
------------------------------------------------------
*/

.main-content {
width: 100%;
height: auto;
position: relative;
margin: 0 auto;
background: #f9f8f8;
z-index: 2;
}

.content-inner{
width: 95%;
margin-right: auto;
margin-left: auto;
padding-top: 3rem;
}

.fadeIn {
transition: 1s;
opacity: 0;
}

.fadeIn.animated {
opacity: 1;
}

/*
------------------------------------------------------
top
------------------------------------------------------
*/

.home .title h1{
white-space: nowrap;
color: #d5ba97;
font-size: 17vmax;
font-weight: bold;
line-height: normal;
}

.top-project-content {
width: 100%;
}

.top-project-content .content-inner{
}

span.type_1 {
margin-right: 1.9rem;
}

span.type_2 {
margin-left: -3rem;
}

.new{
width: 100%;
margin-top: 3rem;
}

.new img{
width: 100%;
height: 30rem;
}

.new dt {
}

.project-list{
display: flex;
flex-wrap: wrap;
margin-top: 2rem;
}

.list-box{
width: 32%;
height: fit-content;
background-color: ;
}

.list-box:not(:nth-child(3n+3)) {
margin-right: 2%;
}

.list-box:nth-child(n+4) {
margin-top: 30px;
}

.list-box img{
width: 100%;
height: 100%;
object-fit: cover;
}

.list-box a{
display: inline;
}

.top-project-content .list-box dt{
}

.top-project-content .list-box dd a{
}

.view-all{
margin-left: auto;
margin-right: auto;
width: fit-content;
margin-top: 5rem;
text-align: center;
font-size: 2rem;
align-items: center;
display: flex;
ustify-content: start;
}


 .view-all::before {
content: "";
display: inline-block;
width: 1.5rem;
height: 1.5rem;
background-size: contain;
margin-right: .5em;
 }

 .view-all::after {
content: "";
display: inline-block;
width: 1.5rem;
height: 1.5rem;
background: url(img/common/arrow.png) no-repeat;
background-size: contain;
margin-left: .5em;
transform: rotate(180deg);
filter: invert(1);
 }



/*
------------------------------------------------------
about
------------------------------------------------------
*/

.about-content {
width: 100%;
margin:0;
}

.about-content .content-inner{
}

.about .flex-box{
display: flex;
justify-content: space-between;
}

.about-content .title{
}

.about-content .title h2{
}


.concept{
width: 100%;
}

.about .sub-head{
color: #d5ba97;
font-size: 8vmax;
font-weight: bold;
line-height: normal;
}

.about{
argin-top: 10rem;
}


/*-- who-we-are --*/
.who-we-are{
margin-top: 20rem;
}

.who-we-are .flex-box{
justify-content: space-between;
}

.who-we-are .sub-head {
position: sticky;
top: 7rem;
width: 30%;
height: fit-content;
}

.who-we-are .text-content{
margin-block: calc((1em - 1lh) / 2);
width: 70%;
font-size: 2rem;
text-align: justify;
}

/*-- about-service --*/
.about-service{
margin-top: 20rem;
}

.about-content .content-inner .about-service .service {
margin-top: 3rem;
}

.about-content .content-inner .about-service .grid {
display: grid;
ap: 0 30px;
grid-template-columns: repeat(3, 1fr);
}

.about-content .content-inner .about-service .about-service-section{
text-align: justify;
padding-top: 2rem;
padding-bottom: 2rem;
padding-left: 1rem;
padding-right: 1rem;
border-right: 1px solid;
}

.about-content .content-inner .about-service .about-service-section:last-child{
border-right: none;
}

.about-service-section dt{
}

.about-service-section dd{
margin-top: .5rem
}


/*-- about-member --*/
.about-member{
margin-top: 20rem;
}

.about-member-profile_box img{
width: 100%;
}

.member{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 3rem;
}

.member-profile-box{
width: 18%;
background-color: ;
}

.member-profile-box:not(:nth-child(5n+5)) {
margin-right: 2%;
}

.member-profile-box:nth-child(n+6) {
margin-top: 2rem;
}

.member-profile-box img{
}

.member-img {
position: relative;
width: 100%;
height: 24rem;
margin: 0 auto;
display: block;
overflow: hidden;
cursor: pointer;
}

.member-img img {
object-fit: cover;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 100%;
height: 24rem;
display: block;
-webkit-transition: .4s ease-in-out;
transition: .4s ease-in-out;
}

.member-img:hover img:nth-of-type(2) {
opacity: 0;
}

.job{
font-size: .6rem;
font-weight: normal;
}

.member-name{
font-weight: 300;
margin-top: .5rem;
}

/*-- about-outline --*/
.about-outline{
margin-top: 20rem;
}

.about-content .content-inner .about-outline .data-list-blk:first-child
{
border-top: 1px dotted;
}

.about-content .content-inner .about-outline .data-list-blk{
width: 100%;
flex-direction: row;
padding-block: 3rem;
border-top: 1px dotted;
}

.about-content .content-inner .about-outline .data-list-blk:last-child{
border-bottom: 1px dotted;
}

.about-content .content-inner .about-outline .flex-box{
display: flex;
}

.about-content .content-inner .about-outline dl{
width: 100%;
margin-top: 3rem;
}

.about-content .content-inner .about-outline dt{
width: 13%;
}

.about-content .content-inner .about-outline dd{
width: 87%;
}

.about-access{
margin-top: 20rem;
}

.about-access .google-map{
width: 100%;
margin-top: 3rem;
}

.about-access .access-data{
width: 100%;
margin-top: 1rem;
}

.next-page{
width: 95%;
margin-top: 20rem;
margin-right: auto;
margin-left: auto;
font-size: 3rem;
}


.next-page a {
box-sizing: border-box;
justify-content: space-between;
align-items: center;
display: flex;
ustify-content: start;
padding: 2rem .5rem 2rem .5rem;
}

.next-page-block{
border-top: 1px dotted;
}
.next-page-block:last-child{
border-bottom: 1px dotted;
}

.next-page-block a::after {
content: "";
display: inline-block;
width: 1rem;
height: 1rem;
background: url(img/common/arrow.png) no-repeat;
background-size: contain;
margin-left: 1em;
transform: rotate(180deg);
filter: invert(1);
}




/*
------------------------------------------------------
service
------------------------------------------------------
*/

/**-- concept--**/
.design-concept{
}

.design-concept-img {
position: relative;
width: 100%;
height: 24rem;
margin-top: 3rem;
margin-left: auto;
margin-right: auto;
display: block;
overflow: hidden;
cursor: pointer;
}

.design-concept-img img {
object-fit: cover;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 100%;
height: 24rem;
display: block;
-webkit-transition: .4s ease-in-out;
transition: .4s ease-in-out;
}

.design-concept p{
font-size: 2rem;
width: 95%;
margin: auto;
}


/**-- flow--**/
.service-flow{
width: 100%;
margin: 20rem 0 0;
}

.service-flow p{
border-bottom: 1px dotted;
height: 9rem;
vertical-align: top;
width: fit-content;
}

.service-flow .grid {
display: grid;
ap: 0 30px;
grid-template-columns: repeat(3, 1fr);
}

.flow-section{
text-align: justify;
padding-top: 2rem;
padding-bottom: 2rem;
padding-left: 1rem;
padding-right: 1rem;
}

.flow-section:last-child{
border-right: none;
}

.flow-section .text-box{
margin-top: .5rem;
display: block;
}

.flow-arrow__icon {
display: flex;
width: fit-content;
align-items: center;
}

.flow-arrow__icon::after {
font-size: 1.5rem;
content: "›";
display: inline-block;
background-size: contain;
margin-left: 1em;
}

.flow-arrow__icon:last-child::after{
font-size: 1rem;
content: "";

}

/**
.flow-arrow__icon::after {
content: "›";
display: inline-block;
width: 1rem;
height: 1rem;
ground: url(img/common/arrow.png) no-repeat;
background-size: contain;
margin-left: 1.5em;
transform: rotate(180deg);
filter: invert(1);
}
**/





/**-- price --**/
.service-content {
width: 100%;
margin: 20rem 0 0;
}

.service-content .content-inner{
margin: 0 auto;
width: 95%;
}

.service-content .flex-box{
display: flex;
justify-content: space-between;
}

.service-content .sub-head{
position: sticky;
top: 7rem;
width: 30%;
height: fit-content;
}

.service-content .content-inner .service-price{
width: 70%;
}

.service-content .content-inner .price{
argin-top: 5rem;
}

.service-content .content-inner .service-price .data-list-blk:first-child{
border-top: 1px dotted;
}

.service-content .content-inner .service-price .data-list-blk{
justify-content: unset;
flex-direction: row;
padding-block: 3rem;
border-bottom: 1px dotted;
}

.service-content .content-inner .service-price dl {
width: 100%;
margin-top: 1rem;
}

.service-content .content-inner .service-price dt{
width: 22rem;
}

.service-photo{
margin-top: 10rem;
}

.photo-price{
margin-top: 10rem;
}

.graphic-price{
margin-top: 10rem;
}

.service-list .link{
margin-top: 3rem;
}


/*
------------------------------------------------------
project
------------------------------------------------------
*/

.project-content {
width: 100%;
}

.project-content .content-inner{
}

.project-list{
display: flex;
flex-wrap: wrap;
}

.list-box{
width: 32%;
background-color: ;
}

.list-box:not(:nth-child(3n+3)) {
margin-right: 2%;
}

.list-box:nth-child(n+4) {
margin-top: 2rem;
}

.project-content .content-inner .project-list .list-box img{
width: 100%;
height: 100%;
object-fit: cover;
}

.project-list dt {
font-weight: normal;
}

.project-content .project-list .list-box a{
display: inline;
}


/*-- single-project --*/
.project-title{
olor: #fff !important;
}

.project-thumbnail{
width: 100%;
height: 100vh;
position: fixed;
filter: blur(8px) opacity(0.8);
}

.project-thumbnail img{
width: 100%;
height: 100vh;
position: fixed;

}

.single-project-content {
margin-top: 0;
}

.single-project-content .content-inner{
}

.single-project-content .flex-box{
justify-content: space-between;
}

.project-data{
width: 60%
}

.wp-block-post-featured-image img {
width: 100% !important;
}

.wp-block-image:nth-child(n+2){
margin-top: 3rem !important;
}

.single-project-content .project-title{
position: sticky;
top: 7rem;
width: 35%;
height: fit-content;
}


.single-project-content .link{
idth: 95%;
margin-top: 3rem;
argin-left: auto;
argin-right: auto;
}

.visit-site{
width: fit-content;
margin-top: 5rem;
text-align: center;
font-size: 2rem;
align-items: center;
display: flex;
ustify-content: start;
}

 .visit-site::after {
content: "";
display: inline-block;
width: 1.5rem;
height: 1.5rem;
background: url(img/common/arrow.png) no-repeat;
background-size: contain;
margin-left: .5em;
transform: rotate(180deg);
filter: invert(1);
 }

.visit-site .link{
margin-top: 3rem;
}

.other-project {
width: 95%;
margin-top: 10rem;
margin-right: auto;
margin-left: auto;
}

.other-project .flex-box{
margin-top: 3rem;

}

.pre, .next{
width: 50%;
height: 20rem;
}

.other-project img{
width: 100%;
height: 20rem;
}

.hover figure img {
opacity: 1;
-webkit-transition: .3s ease-in-out;
transition: .3s ease-in-out;
}

.hover figure:hover img {
opacity: .5;
}

.other-project .pre{
display: block;
position: relative;
}

.pre__icon {
text-indent: .25em;
border-bottom: 1px solid;
font-size: 1rem;
color: #fff;
position: absolute;
top: 45%;
left: 50%;
transform: translate(-50%, -50%);
/* display: block; */
letter-spacing: .4rem;
}

.pre__icon::before {
position: fixed;
content: "";
display: inline-block;
width: 1.3rem;
height: 1.3rem;
background: url(img/common/arrow.png) no-repeat;
background-size: contain;
margin-top: .2rem;
margin-left: -2.5em;
transform: rotate(0deg);
}

.pre__icon:last-child{
letter-spacing: 0;
}

.other-project .pre p {
white-space: nowrap;
position: absolute;
top: 55%;
left: 50%;
transform: translate(-50%, -50%);
display: block;
position: absolute;
color: #fff;
font-size: 1rem;
font-weight: normal;
}


.other-project .next{
display: block;
position: relative;
}

.next__icon {
border-bottom: 1px solid;
font-size: 1rem;
color: #fff;
position: absolute;
top: 45%;
left: 50%;
transform: translate(-50%, -50%);
}

.next__icon::after {
position: fixed;
content: "";
display: inline-block;
width: 1.3rem;
height: 1.3rem;
background: url(img/common/arrow.png) no-repeat;
background-size: contain;
margin-top: .2rem;
margin-left: 1rem;
transform: rotate(180deg);
}

.other-project .next p{
white-space: nowrap;
position: absolute;
top: 55%;
left: 50%;
transform: translate(-50%, -50%);
display: block;
position: absolute;
color: #fff;
font-size: 1rem;
font-weight: normal;
}

.pre-title {
text-align: left;
}

.next-title {
text-align: right;
}

.gray {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: brightness(35%) grayscale(100%);
transition: all 0.3s ease-in;
}

.gray:hover {
filter: none;
transition: all 0.3s ease-in;
}


/*
------------------------------------------------------
information
------------------------------------------------------
*/
.information-content {
width: 100%;
margin: 0;
}

.information-content .flex-box{
display: flex;
align-items: center;
justify-content: space-between;
}

.information-content .select-nav {
margin-top: ;
white-space: nowrap;
overflow: scroll;
margin-top: ;
scrollbar-width: none;
}

.information-content .select-nav ul li {
text-align: center;
width: 4rem;
margin-right: 2rem;
cursor: pointer;
display: inline-block;
padding: .01rem 2rem;
border: 1px solid #B19A7D;
border-radius: 20px;
text-decoration: none;
transition: 0.3s;
white-space: nowrap;
}

.information-content .select-nav li.active {
width: 4rem;
color: #fff;
background-color: #B19A7D;
}

.information-content .content-inner .article {
display: ;
width: 100%;
margin: 0;
margin-top: 3rem;
}

.next-page a:hover {
background-color:#d5ba9778;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all0.3s ease;
}

.information-content .article{
margin-top: 3rem;
}

.information-content .article .date{
width: 100%;
}

/*----- single-news -----*/
.single-project-data-content{
width: 100%;
}

.information{
width: 60%;
}

.information .body{
margin-top: 1rem;
}

.information .link {
margin-top: 3rem;
margin-left: auto;
margin-right: auto;
}



/*
------------------------------------------------------
contact
------------------------------------------------------
*/

.contact-content {
width: 100%;
margin: 0;
}

.contact-content .wpcf7 {
color: #fff;
width: 100%;
}

.contact-contact .wpcf7 p{
padding: 0;
}

.contact-contact .wpcf7 span.req{
color: red;
}

.wpcf7 input[name="your-name"] {
width: 100%;
}

.wpcf7 input[name="your-email"] {
width: 100%;
}

.wpcf7 input[name="your-subject"] {
width: 100%;
}

.wpcf7 textarea[name="your-message"] {
width: 100%;
}

.wpcf7 input[name="tel-232"] {
width: 100%;
}

.form-field {
margin-bottom: 4rem;
width: 100%;
}

label {
display: block;
margin-top: 3rem;
color: #000;
}

input[type="text"], input[type="email"], input[type="tel"], select,textarea {
width: 100%;
padding: 10px 0;
border: none;
border-bottom: 1px solid;
background-color: transparent;
color:;
outline: none;
}

button {
padding: 10px 20px;
border: none;
background-color:;
color: #000;
cursor: pointer;
}

input[type=checkbox],input[type=radio] {
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
position: relative;
right: 0;
bottom: 0;
left: 0;
height: 20px;
width: 20px;
vertical-align: -0.8rem;
transition:all .15s ease-out 0s;
color: #fff;
cursor: pointer;
display: inline-block;
margin: .4rem;
outline: none;
border-radius: 10%;
}

input[type=checkbox]:before,input[type=checkbox]:after {
position: absolute;
content: "";
background: ;
transition: all .2s ease-in-out;
}

input[type=checkbox]:before {
left: 2px;
top: 6px;
width: 0;
height: 2px;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
}

input[type=checkbox]:after {
right: 9px;
bottom: 3px;
width: 2px;
height: 0;
transform: rotate(40deg);
-webkit-transform: rotate(40deg);
-moz-transform: rotate(40deg);
-ms-transform: rotate(40deg);
-o-transform: rotate(40deg);
transition-delay: .2s;
}

input[type=checkbox]:checked:before {
left: 1px;
top: 10px;
width: 6px;
height: 2px;
}

input[type=checkbox]:checked:after {
right: 7px;
bottom: 2px;
width: 2px;
height: 14px;
}

input[type=checkbox]:indeterminate:before,input[type=checkbox]:indeterminate:after {
width: 7px;
height: 2px;
transform: rotate(0);
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-ms-transform: rotate(0);
-o-transform: rotate(0);
}

input[type=checkbox]:indeterminate:before {
left: 1px;
top: 7px;
}

input[type=checkbox]:indeterminate:after {
right: 1px;
bottom: 7px;
}

.checkbox-section {
margin-bottom: 50px;
}

.checkbox-section input[type="checkbox"] {
height: 20px;
width: 20px;
vertical-align: -0.8rem;
transition:all .15s ease-out 0s;
color: #fff;
cursor: pointer;
display: inline-block;
margin: .4rem;
outline: none;
border-radius: 100%;
margin-right: 10px;
transform:scale(1.5);
border: 1px solid ;
}

.checkbox-section input[type="checkbox"]:checked {
background: #000000;
}

.wpcf7-submit{
margin-top: 3rem;
padding: 10px 20px;
background-color: ;
border: none;
color: #000;
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
width: 150px;
}

.wpcf7-previous{
padding: 10px 20px;
background-color: inherit;
border: none;
color: ;
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
width: 150px;
}

.wpcf7-submit:active {
transform: scale(0.95);
}

.wpcf7-response-output{
	color: red;
}

.wpcf7-not-valid-tip {
color: red !important;
font-size: .8rem !important;
}

a.policy{
color: ;
text-decoration: underline;
}

.page-template-page-contact-confirm .form-field{
border-bottom: 1px solid ;
width: 37%;
}

.button-container {
margin-top: 70px;
}

.button-container p {
display: block;
gap: 20px;
align-items: center;
}



/*
------------------------------------------------------
privacy-policy
------------------------------------------------------
*/

.privacy-policy-content {
width: 100%;
margin: 0;
}

.privacy-policy-content .content-inner{
}

.privacy-policy{
display: block;
width: 100%;
}

.pp-section {
border-top: 1px dotted;
margin: 50px 0 0;
padding: 50px 0 0;
}

.pp-section:last-child{
border-bottom: none;
}


/*
------------------------------------------------------
footer
------------------------------------------------------
*/

.next-page a:hover {
background-color:#d5ba9778;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}


.caval{
padding-top: 10rem;
font-weight: normal;
font-size: 3rem;
}

div.footer-center-bottom{
cursor: pointer;
}

.footer-section a img {
height: 16px;
vertical-align: middle;
padding-right: 8px;
}

.footer-logo img{
width: 13rem;
}

.footer-l-content p{
margin-top: 1rem;
}




/*------------- f-news -------------*/

.footer-news-content {
width: 100%;
margin-top: 10rem;
}

.footer-news-content .content-inner {
display: block;
width: 95%;
margin: 0 auto;
}

.footer-news-content .content-inner .flex-box{
display: flex;
align-items: center;
justify-content: space-between;
}

.footer-news-content .select-nav {
margin-top: 0;
}

.select-nav ul {
display: flex;
}

.select-nav ul li {
text-align: center;
width: 4rem;
margin-right: 2rem;
cursor: pointer;
display: inline-block;
padding: .01rem 2rem;
border: 1px solid #B19A7D;
border-radius: 20px;
text-decoration: none;
transition: 0.3s;
white-space: nowrap;
}

.select-nav ul li:last-child{
margin-right: 0;
}

.footer-news-content .select-nav li.active {
width: 4rem;
color: #fff;
background-color: #B19A7D;
}

.footer-news-content .content-inner .article{
display: ;
width: 100%;
margin-top: 3rem;
}

.footer-news-content .content-inner .article .date{
width: 100%;
}

.article li:first-child {
border-top: 1px dotted;
}

.article li:last-child{
border-bottom: 1px dotted ;
}

.article li{
display: flex;
line-height: 5rem;
box-sizing: content-box;
display: flex;
border-top: 1px dotted #525050;
}


.article li a{
box-sizing: border-box;
justify-content: space-between;
align-items: center;
display: flex;
ustify-content: start;
padding: 2rem .5rem 2rem .5rem;
}

.article li a:hover {
background-color:#d5ba9778;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all0.3s ease;
}

.article li a::after {
content: "";
display: inline-block;
width: 1rem;
height: 1rem;
background: url(img/common/arrow.png) no-repeat;
background-size: contain;
margin-left: 1em;
transform: rotate(180deg);
filter: invert(1);
}

.article .link {
margin-top: 5rem;
}



/*------------- f-contact -------------*/

.footer-contact-content{
width: 100%;
background: #d5ba97;
margin-top: 10rem;
}

.footer-contact-content a {
display: block;
text-align: center;
color: #fff;
font-size: 5rem;
text-decoration: none;
padding: 10rem 0;
}


.buruburu {
display: inline-block;
animation: hurueru .1s infinite;
}

@keyframes hurueru {
0% {transform: translate(0px, 0px) rotateZ(0deg)}
25% {transform: translate(5px, 5px) rotateZ(1deg)}
50% {transform: translate(0px, 3px) rotateZ(0deg)}
75% {transform: translate(3px, 0px) rotateZ(-1deg)}
100% {transform: translate(0px, 0px) rotateZ(0deg)}
}

/*------------- f-menu -------------*/
footer {
width: 100%;
background: #f9f8f8;
padding-top: 5rem;
padding-bottom: 2rem;
position: relative;
z-index: 2;
}


footer .content-inner{
width: 95%;
eight: 50rem;
margin: 0 auto;
}

footer .content-inner .flex-box {
display: flex;
lign-items: baseline;;
justify-content: space-between;
}

.footer{
position: relative;
background: #f9f8f8;
z-index: 2;
}

.footer-l-content{
width: 30%;
}

.footer-r-content{
width: 60%;
}

.footer-subhead{
border-bottom: 1px solid;
}

.footer-r-content .footer-sitemap .footer-list {
display: grid;
}

.footer-list li {
margin-top: 1rem;
}

.footer-r-content .footer-list {
grid-template-columns: repeat(2, 1fr);
idth: 32rem;
margin-top: 1rem;
}

.footer-r-content .footer-sns{
margin-top: 5rem;
}

.footer-sitemap .footer-item{
}

.return-top{
margin-top: 5rem;
} 

.return-top .arrow-up{
margin: 0;
filter: invert(1);
width: 25px;
height: 25px;
} 

.return-top a{
display: block;
text-align: end;
} 


.footer-bottom{
width: 100%;
margin-top: 5rem;
}

.footer-bottom .content-inner{
width: 95%;
}

.footer-bottom .footer-logo img{
width: 3rem;
height: auto;
}


.footer-bottom .link {
margin-top: 0;
font-size: .6rem;
}

/* pc */
@media screen and (min-width: 769px) {
.u_769{
display: none !important;
}

.o_769{
display: block;
}

.menu-icon {
display: none;
}

.menu {
display: block !important;
}

}


.loop {
overflow: hidden;
white-space: nowrap;
position: relative;
}

.p-content__container {
display: flex;
flex-direction: column;
justify-content: center;
flex-grow: 1;
}

.c-text {
overflow: hidden;
display: flex;
width: 100vw;
margin-inline:calc(50% - 50vw);
}

.c-text__item {
flex-shrink: 0;
white-space: nowrap;
font-size: 32vw;
letter-spacing: -.03em;
padding-inline:.1em;
color: #b19a7c;
background: linear-gradient(to right, #b19a7c, #a6a23e);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.c-text:not(.no-tick) .c-text__item:nth-child(odd) {
-webkit-animation: MoveLeft var(--tick-duration, 18s) var(--tick-delay, -9s) infinite linear;
animation: MoveLeft var(--tick-duration, 18s) var(--tick-delay, -9s) infinite linear;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}

 .c-text--reverse:not(.no-tick) .c-text__item:nth-child(odd) {
-webkit-animation: MoveLeft var(--tick-duration, 18s) var(--tick-delay, -9s) infinite linear reverse;
animation: MoveLeft var(--tick-duration, 18s) var(--tick-delay, -9s) infinite linear reverse;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}

.c-text:not(.no-tick) .c-text__item:nth-child(even) {
-webkit-animation: MoveLeft2 var(--tick-duration, 18s) infinite linear;
animation: MoveLeft2 var(--tick-duration, 18s) infinite linear;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}

.c-text--reverse:not(.no-tick) .c-text__item:nth-child(even) {
-webkit-animation: MoveLeft2 var(--tick-duration, 18s) infinite linear reverse;
animation: MoveLeft2 var(--tick-duration, 18s) infinite linear reverse;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}

@-webkit-keyframes MoveLeft {
0% {
-webkit-transform: translateX(100%);
transform: translateX(100%)
}

to {
-webkit-transform: translateX(-100%);
transform: translateX(-100%)
}
}

@keyframes MoveLeft {
0% {
-webkit-transform: translateX(100%);
transform: translateX(100%)
}

to {
-webkit-transform: translateX(-100%);
transform: translateX(-100%)
}
}

@-webkit-keyframes MoveLeft2 {
0% {
-webkit-transform: translateX(0);
transform: translateX(0)
}

to {
-webkit-transform: translateX(-200%);
transform: translateX(-200%)
}
}

@keyframes MoveLeft2 {
0% {
-webkit-transform: translateX(0);
transform: translateX(0)
}

to {
-webkit-transform: translateX(-200%);
transform: translateX(-200%)
}
}

@media screen and (min-width: 801px) {
.c-text__item {
font-size: 8vw;
}

.c-text:not(.no-tick) .c-text__item:nth-child(odd) {
-webkit-animation: MoveLeft var(--tick-duration, 24s) var(--tick-delay, -12s) infinite linear;
animation: MoveLeft var(--tick-duration, 24s) var(--tick-delay, -12s) infinite linear;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}

.c-text--reverse:not(.no-tick) .c-text__item:nth-child(odd) {
-webkit-animation: MoveLeft var(--tick-duration, 24s) var(--tick-delay, -12s) infinite linear reverse;
animation: MoveLeft var(--tick-duration, 24s) var(--tick-delay, -12s) infinite linear reverse;
-webkit-animation-fill-mode: both;
 animation-fill-mode: both;
}

.c-text:not(.no-tick) .c-text__item:nth-child(even) {
-webkit-animation: MoveLeft2 var(--tick-duration, 24s) infinite linear;
animation: MoveLeft2 var(--tick-duration, 24s) infinite linear;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}

.c-text--reverse:not(.no-tick) .c-text__item:nth-child(even) {
-webkit-animation: MoveLeft2 var(--tick-duration, 24s) infinite linear reverse;
animation: MoveLeft2 var(--tick-duration, 24s) infinite linear reverse;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}

}



/*
=================================================================================
tablet
=================================================================================
*/

@media only screen and (min-width: 768px) and (max-width: 1023px) {

#cursor{
display: none;
}

#stalker{
display: none;
}

.horizontal-text-online{
display: none;
}

.c-text__item {
font-size: 8vw !important;
}

/*
------------------------------------------------------
common-1
------------------------------------------------------
*/



.main-content {
width: 100%;
height: auto;
position: relative;
margin: 0 auto;
}




}



/*
=================================================================================
smartPhone
=================================================================================
*/
@media screen and (max-width: 767px) {


body{
font-weight: 300;
font-size: .8rem;
letter-spacing: .25rem;
line-height: 1.8;
}

.page-template-page-contact .head-logo,.page-template-page-privacy-policy .head-logo {
position: relative;
}


/*
------------------------------------------------------
common-1
------------------------------------------------------
*/
h1{
font-weight: lighter;
font-size: 2rem;
}

h3{
margin-bottom: 3rem;
}

.text-content{
line-height: 1.8;
letter-spacing: inherit;
font-size: .5rem;
font-weight: 300;
}


/**----- 改行 -----**/
.br::before {
content: "\A";
white-space: pre;
}

/**----- パンクズ -----**/

.breadcrumb-box {
width: 95%;
}


.g-map__icon {
align-items: center;
display: flex;
ustify-content: start;
padding:0;
}

/* カレント表示 */
.header-nav__item.current a::after{
content: "";
display: inline-block;
width: .5rem;
height: .5rem;
background-size: contain;
background: #fff;
border-radius: 20rem;
margin-right: 0;
position: sticky;
bottom: 0;
transform: translateX(-50%);
}

/* カーソル */
#cursor{
display: none;
}

#stalker{
display: none;
}

::selection {
background: #d5ba9780;
}

/*
------------------------------------------------------
header
------------------------------------------------------
*/
header {
top: 1.5rem;
position: fixed;
width: 100%;
}

header .content-inner {
margin: 0 auto;
width: 95%;
}

header h1 {
font-size: 1rem;
}

header .flexbox {
display: flex;
justify-content: space-between;
align-items: flex-start;
height: auto;
width: 100%;
}

header .head-logo {

}

header li {
margin-right: 0;
text-align: end;
display: block;
}

header li:last-child{
margin-bottom: 0;
}

.extra-content .logo{
width: 95%;
}


/*
------------------------------------------------------
fv
------------------------------------------------------
*/

.fv{
width: 100%;
height: 100dvh;
position: relative;
z-index: ;
}

.fv .fv-title{
width: 95%;
position: fixed;
display: block;
left: 2.5%;
top: 50%;
transform: translate(0%, -50%);
z-index: ;
}

.side-fixed {
width: 100%;
height: 100vh;
right: 0;
z-index: ;
position: fixed !important;
}


#circular-text {
z-index: ;

font-size: 8px !important;
color: #B19A7D;
letter-spacing: -0.5em;
top: 50% !important;
right: -5.5% !important;
transform: translate(0, -50%) !important;
}

.fv-scroll{
position: fixed;
width: 95%;
left: 2.5%;
bottom: 2rem;
font-size: .6rem;
z-index: ;
}

.text-fead{
color:#000;
animation: text-focus-in 1.5s;
}

@keyframes text-focus-in {
0% {
filter: blur(12px);
opacity: 0;
}
100% {
filter: blur(0px);
opacity: 1;
}
}


/*
------------------------------------------------------
main-content
------------------------------------------------------
*/
.main-content {
width: 100%;
height: auto;
position: relative;
margin: 0 auto;
z-index: ;
}






/*
------------------------------------------------------
top
------------------------------------------------------
*/
.home .title h1 {
z-index: ;
text-align: justify;
white-space: normal;
color: #d5ba97;
font-size: 15vmax;
font-weight: bold;
line-height: normal;
}

span.type_1 {
margin-right: 0;
}

span.type_2 {
margin-left: 0;
}

.new img{
width: 100%;
height: 17rem;
}

.home .project-list .list-box {
width: 100%;
margin: 3rem 0 0 0 !important;
}

.home .project-list img{
width: 100%;
height: 17rem;
}

/*
------------------------------------------------------
fv
------------------------------------------------------
*/

#circular-text {
font-weight: normal;
}


/*
------------------------------------------------------
about
------------------------------------------------------
*/

.about-content {
margin: 0;
}


.about .flex-box{
display: block;
}

.concept {
width: 100%;
}

.about .sub-head {
font-size: 3rem;
}

.about .about-img{
width: 85%;
height: 100%;
margin-top: 5rem;
}

.about .about-img img{
width: 100%;
height: 100%;
object-fit: cover;
}


/**-- who-we-are --**/
.who-we-are {
margin-top: 8rem;
}

.who-we-are .flex-box {
display: block;
}

.who-we-are .sub-head {
position: relative;
top: 0;
width: 100%;
height: unset;
}

.who-we-are .text-content {
font-size: .8rem;
margin-top: 2rem;
width: 100%;
}


/**-- about-service --**/
.about-service {
margin-top: 8rem;
}

.about-content .content-inner .about-service .grid {
display: block;
gap: 0 30px;
}

.about-content .content-inner .about-service .service{
margin-top: 2rem;
}

.about-content .content-inner .about-service .about-service-section:first-child {
border-top: 1px dotted;
}

.about-content .content-inner .about-service .about-service-section {
height: 11rem;
padding-left: 0;
padding-right: 0;
border-right: none;
border-bottom: 1px dotted;
}

.about-content .content-inner .about-service .about-service-section dt{

}

.about-service .about-service-section dd{

}


/**-- about-member --**/

.member {
margin-top: 2rem;
}

.about-member {
margin-top: 8rem;
}

.member-profile-box:not(:nth-child(2n+2)) {
margin-right: 2%;
margin-bottom: 1.5rem;
}

.member-profile-box {
width: 48%;
background-color: ;
}

.member-profile-box:last-child{
margin-bottom: 0;
}

.member-profile-box img {
width: 100%;
height: 16rem;
object-fit: cover;
}

.member-img {
position: relative;
width: 100%;
height: 16rem;
margin: 0 auto;
display: block;
overflow: hidden;
cursor: pointer;
}

.member-name{
font-size: .6rem;
font-weight: 300;
margin-top: .5rem;
}


/**-- about-outline --**/
.about-outline {
margin-top: 8rem;
}

.about-content .content-inner .about-outline dl {
margin-top: 2rem;
}

.about-content .content-inner .about-outline dt {
width: 7rem;
padding-right: 0rem;
}

.about-content .content-inner .about-outline .data-list-blk:last-child{
border-bottom: 1px dotted;
}

/**-- about-access --**/
.about-access .flex-box{
display: block;
}

.about-access {
margin-top: 8rem;
}

.about-access .google-map {
width: 100%;
margin-top: 2rem;
}

.about-access .google-map iframe{
height: 15rem;
}

.about-access .access-data {
width: 100%;
margin-top: 1rem;
}

.about-access .access-data li{
margin-top: .1rem;
}

.about-access .access-data .link{
margin-top: 1rem;
}


/*
------------------------------------------------------
service
------------------------------------------------------
*/
.design-concept .content-inner{
padding-top: 0;
}

.design-concept-img {
margin-top: 2rem;
margin-left: auto;
margin-right: auto;
position: relative;
width: 100%;
height: 12rem;
display: block;
overflow: hidden;
cursor: pointer;
}

.design-concept-img img {
width: 100%;
height: 12rem;
}

.design-concept p {
font-size: .8rem;
margin-top: 1rem;
width: 100%;
text-align: justify;
}

.service-flow {
margin-top: 8rem;
margin-left: auto;
margin-right: auto;
}

.service-flow .content-inner{
padding-top: 0;
}

.service-flow p{
border-bottom: none;
height: fit-content;
}

.service-flow .grid {
display: block;
ap: 0 30px;
grid-template-columns: repeat(3, 1fr);
}

.flow{
margin-top: 2rem;
}

.flow-section {
text-align: justify;
padding-top: 0;
padding-bottom: 0;
padding-left: 0;
padding-right: 0;
}

.flow-arrow__icon {
display: block;
}

.flow-arrow__icon::after {
transform: rotate(90deg);
}

.service-content .flex-box {
display: block;
justify-content: space-between;
}

.service-content .sub-head{
position: relative;
top: 0;
width: 100%;
height: unset;
}

.service-content .content-inner .service-price {
width: 100%;
margin-top: 2rem;
}

.service-content {
margin-top: 8rem;
margin-left: auto;
margin-right: auto;
}

.service-content .content-inner{
padding-top: 0;
}

.photo-price{
margin-top: 10rem;
}

.graphic-price{
margin-top: 10rem;
}

.service-content .content-inner .service-price dt {
width: 100%;
}

/*
------------------------------------------------------
work
------------------------------------------------------
*/
.project-content {
width: 100%;
}

.project-content .content-inner{
width: 95%;
}

.project-list{
display: block;
flex-wrap: wrap;
}

.list-box{
width: 100%;
background-color: ;
}

.project-content .content-inner .project-list .list-box img {
width: 100%;
height: 17rem;
}

.page-template-page-work .project-list {
display: flex; /* これで親要素を再度flexに設定 */
}
.page-template-page-work .list-box {
flex: 1 1 100%; /* スマホで1列表示 */
}

.project-content .content-inner .project-list .list-box:first-child{
width: 100%;
margin-top: 0 !important;
}

.project-content .content-inner .project-list .list-box {
width: 100%;
margin: 3rem 0 0 0 !important;
}


/*----- single-work -----*/

.single {
display: block;
width: 100%;
}

.single .text-content{
color: #acacac;

margin-bottom: 50px;
}

.single-project-content .flex-box{
display: grid;
}

.single-project-content .project-title {
order: 1;
width: 100%;
position: static;
}

.project-data {
order: 2;
width: 100%;
margin-top: 1rem;
}


.wp-block-post-featured-image img {
width: 100% !important;
}

.other-project{
width: 100%;
}

.other-project .title{
width: 95%;
margin: auto;
}

.other-project .flex-box{
display: block;
margin-top: 1rem;
}

.pre, .next {
width: 100%;
height: 10rem;
}

.other-project img{
width: 100%;
height: 10rem;
}


.other-project .pre{
display: block;
position: relative;
}


.other-project .pre p {
top: 65%;
}


.other-project .next p{
top: 65%;
}



/*
------------------------------------------------------
information
------------------------------------------------------
*/
.information-content .select-nav {
margin-top: ;
white-space: nowrap;
overflow: scroll;
margin-top: ;
width: 50%;
scrollbar-width: none;
}

.information-content .select-nav ul li {
text-align: center;
width: 4rem;
margin-right: 1rem;
cursor: pointer;
display: inline-block;
padding: .01rem 2rem;
border: 1px solid #B19A7D;
border-radius: 20px;
text-decoration: none;
transition: 0.3s;
white-space: nowrap;
}

.information-content .select-nav li.active {
width: 4rem;
color: #fff;
background-color: #B19A7D;
}

.information-content .content-inner .article {
display: ;
width: 100%;
margin: 0;
margin-top: 3rem;
}


/*----- single-news -----*/
.information {
width: 100%;
}


.single-news-content {
margin: 2rem auto 0;
}

.single-news-content .body{
margin: 2rem auto 0;
}

.information .link {
margin-top: 3rem;
margin-left: unset;
margin-right: auto;
}


/*
------------------------------------------------------
privacy-policy
------------------------------------------------------
*/



/*
------------------------------------------------------
contact
------------------------------------------------------
*/



/*
------------------------------------------------------
footer
------------------------------------------------------
*/

.footer {
position: relative;
background: #f9f8f8;
z-index: ;
}

/*------------- f-news -------------*/
.footer-news-content {

}

.footer-news-content .content-inner {
display: block;
width: 95%;
margin: 0 auto;
}

.footer-news-content .content-inner .title {
display: ;
width: ;
height: auto;
margin: 0;
}

.footer-news-content .content-inner .flex-box {
width: 100%;
display: flex;
margin-left: auto;
}

.footer-news-content .select-nav {
margin-top: ;
white-space: nowrap;
overflow: scroll;
margin-top: ;
width: 50%;
scrollbar-width: none;
}

.select-nav ul li {
text-align: center;
width: 4rem;
margin-right: 1rem;
cursor: pointer;
display: inline-block;
padding: .01rem 2rem;
border: 1px solid #B19A7D;
border-radius: 20px;
text-decoration: none;
transition: 0.3s;
white-space: nowrap;
}

.footer-news-content .select-nav li.active {
width: 4rem;
color: #fff;
background-color: #B19A7D;
}

.footer-news-content .content-inner .article {
display: ;
width: 100%;
margin: 0;
margin-top: 3rem;
}

footer .content-inner .flex-box {
display: grid;
}

.footer-logo{
order: 2;
margin-top: 2rem;
}

.footer-bottom .link{
order: 1;
}

.footer-contact-content a {
font-size: 3rem;
}

.footer-l-nav .footer-list li:nth-child(-n+2) {
margin-top: 1rem;
}

.footer-r-content .footer-l-nav .footer-sitemap {
height: auto;
}

.footer-r-content .footer-sitemap .footer-list {
display: block;
}

.footer-l-content {
width: 100%;
}


.footer-logo img{
width: 15rem;
}

.footer-r-content .footer-l-nav {
width: 100%;
padding-right: 0;
}

.footer-r-content .footer-l-nav .footer-etc {
display: none;
}

.footer-r-content {
width: 100%;
margin-top: 5rem;
}

.footer-r-content .footer-r-nav {
width: 100%;
margin-top: 5rem;
padding-left: 0;
}

.footer-r-content .footer-r-nav .footer-online {
height: auto;
margin-top: 5rem;
}

.footer-r-content .footer-r-nav .footer-sns {
height: auto;
margin-top: 5rem;
}

.return-top a {
display: block;
text-align: start;
}

.footer-bottom a{
display: block;
margin-top: 2rem;
}


}