/* adjustTablet.css */

/* 
=================================================== 
  
  ◆ PC

=================================================== 
*/

@media screen and (max-width:1300px) {

.area-scroll {
  position: absolute;
}

}

/* 
=================================================== 
  
  ◆ Tablet

=================================================== 
*/

@media screen and (max-width:1024px) {

/* 
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>


◆ Tablet

// ● Components //

▼ Animation

 
--

// ● Common //

▼ Loading
▼ Humb
▼ Header
▼ Main
▼ Footer

--

// ● Section //

▼ fv
▼ mv
▼ Intro
▼ sectList
▼ sectArrow
▼ gallery
▼ credit
▼ sectInfo
▼ seviceList
▼ sectNews
▼ pagenation
▼ semiOrder
▼ price

--


>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

/* 
=======================================


// ● Components  //

/* --------------------------- 
  ■ underbar
--------------------------- */

a.underbar:before {
  bottom: -0.5rem;
  left: -0.7rem;
  width: 107%;
}

/*
white
*/

a.underbar.white:before {
  bottom: -0.6rem;
  background-color: rgba(255, 255, 255, 0.44);
}
a.underbar.white:after {
  display: none;
}




/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ Animation

><><><><><><><><><><><><><><><><><><><>




/* 
=======================================


// ● Common  //


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ Loading

><><><><><><><><><><><><><><><><><><><>

/* --------------------------- 
  ■ transition
--------------------------- */

body.pageTrans.humbActive .l-humb {
  width: 100%;
  opacity: 0;
}
body.pageTrans.humbActive .l-humb.swActive {
  width: 100%;
  opacity: 0;
}

body.pageTrans.humbActive .l-humbSect__menu  {
  opacity: 0;
}


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ Humb

><><><><><><><><><><><><><><><><><><><>

/* --------------------------- 
  ■ base
--------------------------- */

/* ------ switch ------- */

.l-humb.pc {
  height: 100%;
}

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

body.humbActive .l-humb {
  width: 82%;
  height: 100%;
}

/* ------ sect ------- */

section.l-humbSect {

}
section.l-humbSect > .inner,
.swActive section.l-humbSect.about > .inner,
.swActive section.l-humbSect.design > .inner,
.swActive section.l-humbSect.works > .inner
 {
  width: 100%;
}

/* ------ Change ------- */

/*
about
*/

section.l-humbSect.active.about,
section.l-humbSect.active.design,
section.l-humbSect.active.works,
section.l-humbSect.active.contact {
  background-color: #ccc9c68f;
}



/* --------------------------- 
  ■ switch
--------------------------- */

/* ------ Common ------- */

body.humbActive .l-humb.swActive {
  width: 100%;
}

/* ------ About ------- */

.swAbout section.l-humbSect:nth-child(2) {
  width: 0%;
}
.swAbout section.l-humbSect:nth-child(3) {
  width: 0%;
}
.swAbout section.l-humbSect:nth-child(4) {
  width: 0%;
}

/* ------ Design ------- */

.swDesign section.l-humbSect:nth-child(1) {
  width: 100%;
  background: transparent;
}
.swDesign section.l-humbSect:nth-child(1) .l-humbSect__title {
  opacity: 0;
  transition-delay: 0s;
  transition: 0.1s;
}

.swDesign section.l-humbSect:nth-child(2),
.swDesign section.l-humbSect:nth-child(2):hover {
  width: 100%;
}
.swDesign section.l-humbSect:nth-child(3) {
  width: 0%;
}
.swDesign section.l-humbSect:nth-child(4) {
  width: 0%;
}

/* ------ Works ------- */

.swWorks section.l-humbSect:nth-child(1) {
  width: 100%;
  background: transparent;
}
.swWorks section.l-humbSect:nth-child(1) .l-humbSect__title {
  opacity: 0;
  transition-delay: 0s;
  transition: 0.1s;
}

.swWorks section.l-humbSect:nth-child(2) {
  width: 0%;
}
.swWorks section.l-humbSect:nth-child(3),
.swWorks section.l-humbSect:nth-child(3):hover {
  width: 100%;
}
.swWorks section.l-humbSect:nth-child(4) {
  width: 0%;
}

/* ------ Contact ------- */

.swContact section.l-humbSect:nth-child(1) {
  width: 100%;
  background: transparent;
}
.swContact section.l-humbSect:nth-child(1) .l-humbSect__title {
  opacity: 0;
  transition-delay: 0s;
  transition: 0.1s;
}

.swContact section.l-humbSect:nth-child(2) {
  width: 0%;
}
.swContact section.l-humbSect:nth-child(3) {
  width: 0%;
}
.swContact section.l-humbSect:nth-child(4),
.swContact section.l-humbSect:nth-child(4):hover {
  width: 100%;
}

/* --------------------------- 
  ■ Menu
--------------------------- */

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

.l-humbSect__menu {
  font-family: minion-3-display, serif;
  font-size: 1.2rem;
  font-weight: 600;
  letter-spacing: 0.47em;
  display: block;
  position: fixed;
  z-index: 100;
  visibility: hidden;
  opacity: 0;
  transition: all ease 0.3s;
  transition-delay: 0s;

  transform: rotate(-90deg);
  transform-origin: top right;
  text-transform: uppercase;
  color: #ffffff;
  letter-spacing: 0.83em;
  text-align: center;
  padding-top: 1.5rem;
  padding-bottom: 1.1rem;
  padding-left: 3.2rem;
  padding-right: 2.2rem;
  top: 4rem;
  right: 4.1rem;
  border-radius: 2.5rem 2.5rem 0 0;
  filter: drop-shadow(4px 3px 3px rgba(0, 0, 0, 0.2));
  background-color: rgba(52, 52, 52, 0.4);
  backdrop-filter: blur(4px);

}
.l-humbSect__menu.active {
  visibility: visible;
  opacity: 1;
  transition: all ease .9s;
  transition-delay: 0s;
}



/* ------ arrow ------- */



/* --------------------------- 
  ■ SectCont
--------------------------- */

/* ------ cont ------- */

.l-humbSect__cont {
  display: block;
}
.l-humbSect__cont > .inner {
  height: 100%;
  padding-top: 9rem;
  overflow-y: scroll;
}
.l-humbSect__cont a {
  color: #000;
}

/*
active
*/

section.l-humbSect.active a,
section.l-humbSect.active .serviceLink {
  color: #000;
}

/* ------ title ------- */

body.humbActive section.l-humbSect.active .l-humbSect__title {
  width: 0;
  margin: initial;
}


/* ------ box ------- */

/* common */

.l-humbSect__box {
  width: 83%;
  margin: 0 auto;
  color: #000;
}

/*
ver
*/

.l-humbSect__box.ver > .inner {
  padding-top: 7rem;
  padding-bottom: 7rem;
  display: flex;
  flex-flow: wrap;
}


/*
hor
*/

.l-humbSect__box.hor > .inner {
  padding-top: 6.5rem;
  padding-bottom: 6.5rem;
}

/*
contact
*/

.l-humbSect__box.contact .l-footer_cont {
  margin-top: 4.5rem;
}
.l-humbSect__box.contact .l-footer_cont .desc {
  display: block;
  font-size: 1.2rem;
  line-height: 2.2;
}
.l-humbSect__box.contact a.underbar.white:before {
  bottom: -0.6rem;
  background-color: rgba(0, 0, 0, 0.44);
}
.l-humbSect__box.contact .l-footer_cont .insta {
  display: none;
}
.l-humbSect__box.contact .l-footer_cont .mail a {
  font-size: 1.7rem;
}

.l-humbSect__box.contact .l-footer_cont .tel {
  margin-top: 2rem;
}
.l-humbSect__box.contact .l-footer_cont .tel .sub {
  font-size: 1.5rem;
  text-transform: capitalize;
}

/* policy */

.l-humbSect__box.policy > .inner {
  padding:3rem 0;
}
.l-humbList__policy {
  font-size: 1.2rem;
  letter-spacing: 0.05em;
}

/* sns */

.l-humbList__sns {
  font-size: 1.3rem;
}
.l-humbList__sns img.wh {
  display: none;
}
.l-humbList__sns img.bl {
  display: block;
}

.l-humbList__sns span {
  margin-left: 1.5rem;
}


/* ------ list ------- */

/* ver */

.l-humbList__ver .left {
  width: 50%;
}
.l-humbList__ver .right {
  width: 34%;
  margin-left: 15.8%;
}
.l-humbList__ver:nth-child(3) {
  margin-left: 0;
  margin-top: 3.8rem;
}

/* hor */

.l-humbList__hor {
  width: 100%;
  display: flex;
}
.l-humbList__hor .left {
  width: 33%;
}
.l-humbList__hor .right {
  width: 38%;
  margin-left: 28%;
}

/*
contact
*/

.contact .l-humbList__hor .left {
  width: 38%;
}
.contact .l-humbList__hor .right {
  width: 53%;
  margin-top: 1rem;
  margin-left: 9%;
}

/*
sect
*/

.sect .l-humbList__hor .right {
  width: 38%;
  margin-left: 28%;
}


/* ------ title ------- */

.l-humbList__title {
  font-size: 2.6rem;
  letter-spacing: 0.28em;
}
.l-humbList__title .normal {  
  margin-top: -1.4rem;
}

/*
hor
*/

.l-humbList__hor .l-humbList__title {
  font-size: 3.1rem;
  letter-spacing: 0.35em;
}
.l-humbList__hor .l-humbList__title .normal {
  margin-top: -1.7rem;
}

/*
sect
*/

.l-humbSect__box.sect .l-humbList__title {
  font-size: 3.2rem;
}
.l-humbSect__box.sect .l-humbList__title .normal {
  margin-top: -1.9rem;
}

/* info */

.l-humbList__infoTitle .jpn {
  font-size: 1rem;
  letter-spacing: 0.13em;
  margin-left: 1.5rem;
}

/*
nav
*/

.l-humbSect__box.nav .l-humbList__infoTitle {
  margin-top: 1rem;
}
.l-humbSect__box.nav .l-humbList__infoTitle .bold {
  font-size: 2rem;
  letter-spacing: 0.3em;
}

/* ------ sub ------- */

.l-humbList__sub {
  font-size: 0.9rem;
  margin-top: -0.4rem;
  margin-bottom: 2.6rem;
}


/* ------ desc ------- */

.l-humbList__desc {
  font-size: 0.9rem;
  opacity: 0.35;
}

/* ------ btn ------- */

.l-humbList__btn {
  font-size: 1.3rem;
  width: 25rem;
  margin-top: 0.4rem;
  border-radius: 0.2rem;
}
.l-humbList__btn a,
.l-humbList__btn .btn {
  padding-top: 1.6rem;
  padding-bottom: 1.2rem;
}

/* hor */

.l-humbSect__box.hor .l-humbList__btn {
  margin-top: 2.7rem;
}

/* ------ image ------- */

.l-humbList__image {
  height: 17vw;
}

/* hor */

.l-humbList__hor .l-humbList__image {
  height: 22.3vw;
}

/*
sect
*/

.sect .l-humbList__hor .l-humbList__image {
  height: 24.2vw;
}

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

/* base */

.formBox + .formBox {
  margin-top: 1.7rem;
}
.formBox:before {
  font-size: 1.3rem;
  letter-spacing: 0.05em;
  margin-bottom: 1.2rem;
}

/* form */

.l-humbSect__box.contact input {
  font-size: 1.4rem;
}

/* area */

.l-humbSect__box.contact textarea {
  font-size: 1.4rem;
  height: 26rem;
}

/* btn */

.l-humbSect__box.contact .formBtn {
  margin-top: 1.8rem;
}
.l-humbSect__box.contact .formBtn input {
  font-size: 1.2rem;
  letter-spacing: 0.09em;
  padding-top: 0.3rem;
  border-radius: 5rem;
  background-color: #cfcfcf;
}
.l-humbSect__box.contact .formBtn input:hover {
  background-color: #cfcfcf;
}


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ Header

><><><><><><><><><><><><><><><><><><><>

/* --------------------------- 
  ■ Common
--------------------------- */

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

header.l-header {
  background: initial;
  backdrop-filter:initial;
  width: 100%;
  height: initial;
  left: initial;
  z-index: 95;
}

/*
contact
*/

body.contact header.l-header {
  content-visibility: visible;
  visibility: visible;
}


/* --------------------------- 
  ■ btn
--------------------------- */

.l-header__btn {
  width: 4.7rem;
  height: 1rem;
  top: 4.6rem;
  right: 4.3rem;
  left: initial;
  transform: initial;
  z-index: 10;
}
.l-header__btn span {
  transition: all 0.8s cubic-bezier(0.08, 0.92, 0.35, 1) !important;
}
.l-header__btn span:nth-child(1) {
  left: initial;
  top: 0;
  width: 0%;
  height: 1px;
}
.l-header__btn span:nth-child(2) {
  right: initial;
  bottom: 0;
  width: 0%;
  height: 1px;
  transition-delay: 0.2s !important;
}
.l-header__btn:hover span:nth-child(1) {
  transform: initial;
  transition-delay: initial;
}
.l-header__btn:hover span:nth-child(2) {
  transform: initial;
  transition-delay: initial;
}


.l-header__btn span:nth-child(3),
.l-header__btn span:nth-child(4) {
  display: none;
} 
.l-header__btn:hover span:nth-child(3) {
  transform: initial;
  transition-delay: initial;
}
.l-header__btn:hover span:nth-child(4) {
  transform: initial;
  transition-delay:initial;
}

/*
last
*/

body.last .l-header__btn span:nth-child(2) {
  transition-delay: 0s !important;
}

/*
loading
*/

body.two .l-header__btn span:nth-child(1) {
  width: 100%;
}
body.two .l-header__btn span:nth-child(2) {
  width: 100%;
}

/*
humbWh
*/

body.humbWh .l-header__btn span:nth-child(1),
body.humbWh .l-header__btn span:nth-child(2) {
  background: #fff;
}

body.contact.humbWh .l-header__btn span:nth-child(1),
body.contact.humbWh .l-header__btn span:nth-child(2) {
  background: #000;
}

/*
active
*/

body.two.humbActive .l-header__btn span {
  background-color: #c3c3c3;
  transition: all ease .5s;
  transform-origin: center;
}
body.two.humbActive .l-header__btn span:nth-child(1) {
  top:50%;
  transform: rotate(-16deg) translateY(-50%);
}
body.two.humbActive .l-header__btn span:nth-child(2) {
  bottom:50%;
  transform: rotate(16deg) translateY(50%);
}


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ Main

><><><><><><><><><><><><><><><><><><><>

/* --------------------------- 
  ■ Common
--------------------------- */

.area-scroll {
  position: initial;
  white-space: initial;
}
.area-scroll main {
  display: flex;
  flex-flow: column;
}

/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ Footer

><><><><><><><><><><><><><><><><><><><>

/* --------------------------- 
  ■ Common
--------------------------- */

footer.l-footer {
  align-items: center;
  justify-content: center;
  height: 99.2vh;
  width: 98%;
  margin:0 auto;
  border-right: initial;
  border-bottom: 1rem solid #fff;
}
footer.l-footer > .inner {
  width: 66%;
  height: 70%;
  flex-flow: column;
}
footer.l-footer .left {
  width: 100%;
}
footer.l-footer .right {
  width: 100%;
}

footer.l-footer:before {
  height: 100%
}

/*
contact
*/

body.contact footer.l-footer > .inner {
  margin-top: 9rem;
  width: 63%;
  margin-left: initial;
}

/* --------------------------- 
  ■ title
--------------------------- */

.l-footer_title {
  font-size: 4.45rem;
  letter-spacing: 0.525em;
}

/* --------------------------- 
  ■ cont
--------------------------- */

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

.l-footer_cont {
  margin-top: 7.8rem;
}

/* ------ desc ------- */

.l-footer_cont .desc {
  display: none
}

/* ------ mail ------- */

.l-footer_cont .mail a {
  font-size: 2rem;
  margin-left: 2rem;
}

/* ------ address ------- */

.l-footer_cont address {
  font-size: 1.53rem;
  line-height: 2.15;
  margin-top: 5.2rem;
}

/* ------ instagram ------- */

.l-footer_cont .insta {
  font-size: 1.6rem;
}
.l-footer_cont .insta a {
  padding-left: 2.4rem;
}

/*
margin
*/

.l-footer_cont .insta:before {
  margin-top: 3.8rem;
  margin-bottom: 4.9rem;
}

/* ------ tel ------- */

.l-footer_cont .tel {
  margin-top: 0.4rem;
}
.l-footer_cont .tel .sub {
  font-size: 1.4rem;
}
.l-footer_cont .tel a {
  font-size: 1.55rem;
}


/* ------ btn ------- */

.l-footer_cont .btn {
  width: 100%;
  margin-top: 12rem;
}
.l-footer_cont .btn a {
  font-size: 1.8rem;
  padding: 4.7rem 0 4.3rem;
}

/*
contact
*/

body.contact .l-footer_cont .btn {
  width: 100%;
}


/* 
=======================================


// ● Section  //


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ fv

><><><><><><><><><><><><><><><><><><><>

/* --------------------------- 
  ■ section
--------------------------- */

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

section.l-fv {
  width: 100%;
  height: 95vw;
}
section.l-fv:before {
  top: 0;
  width: 100%;
  height: 0%;
}

/*
loading
*/

body.three section.l-fv:before {
  width: 100%;
  height: 100%;
}

/*
margin
*/

.l-mvArea + section.l-fv {
  width: 99%;
  height: 99vw;
  padding-left: initial;
  padding-right: initial;
}

/*
service
*/

section.l-fv.service {
  height: 126vw;
  z-index: 0;
  position: sticky;
  top: 0;
  padding-right: initial;
  transition: all ease .35s;
}
section.l-fv.service:before {
  background-color: rgba(0,0,0,0);
}
body.three section.l-fv.service:before {
  background-color: rgba(0,0,0,0.3);
  width: 98%;
  left: 1%;
  top: 0;
}

section.l-fv.field {
  background: #d2cfca;
}

/*
scroll
*/

body.stickyOp section.l-fv.service {
  opacity: 0;
}

/*
design
*/

section.l-fv.service.design {
  height: 126vw;
  z-index: 0;
  position: sticky;
  top: 0;
  padding-right: initial;
  transition: all ease .35s;
}
body.three section.l-fv.service.design:before {
  background-color: rgba(0,0,0,0.3);
  width: 98%;
  left: 1%;
  top: 0;
}

/*
archive
*/

body.archive section.l-fv {
  width: 100%;
  height: initial;
}
body.archive section.l-fv:before {
  height: 100%;
}
body.archive section.l-fv .l-fv__cont {
  display: none;
}

body.archive section.l-fv.arrow {
  height: 83vw;
}
body.archive section.l-fv.arrow .l-fv__cont {
  display: flex;
}

/*
policy
*/

body.policy section.l-fv:before {
  height: 100%;
}


/*
single
*/

section.l-fv.single > .inner {
  display: flex;
  flex-flow: column;
  align-items: initial;
}

/*
news
*/

body.news section.l-fv {
  width: 100%;
  height: initial;
}
body.news section.l-fv > .inner {
  display: flex;
  align-items: initial;
  flex-flow: column;
}

/*
contact
*/

body.contact section.l-fv {
  height: initial;
}


/* --------------------------- 
  ■ l-fv__head
--------------------------- */

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

.l-fv__head {
  position: absolute;
  width: 100%;
  height: initial;
  top: 0;
  opacity: 1;
  transition: all ease .35s;
}

/* ------ logo ------- */

.l-fv__logo {
  width: 8rem;
  height: 8rem;
  margin-top: 4rem;
  margin-left: 4.3rem;
}

/* ------ btn ------- */

.l-fv__btn {
  display: none
}


/* --------------------------- 
  ■ l-fv__cont
--------------------------- */

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

.l-fv__cont {
  /*margin-top: 20rem;
  margin-bottom: 20rem;*/
}
.l-fv__cont > .inner {
  width: 66%;
  margin: 2.3rem auto 0;
}

/*
service
*/

section.l-fv.service .l-fv__cont > .inner {
  width: 64.9%;
  height: 66%;
  margin: -4rem auto 0;
}

/*
arrow
*/

section.l-fv.arrow .l-fv__cont > .inner {
  height: 68%;
  width: 67%;
  margin: 3.3rem auto 0;
}

/*
single
*/

section.l-fv.single .l-fv__cont > .inner {
  width: 63.2%;
  margin: 2.2rem auto 0;
}

/*
news
*/

body.news section.l-fv .l-fv__cont > .inner {
  margin: 21.3rem auto 0;
}


/* ------ copy ------- */

.l-fv__copy .title {
  font-size: 4.5rem;
  line-height: 1.75;
}
.l-fv__copy .title .normal {
  margin-left: 0em;
  font-size: 100%;
}

/*
top
*/

body.top section.l-fv.firsrt .l-fv__copy .title .normal {
  margin-left: 0em;
}

/*
philosophy
*/

body.philosophy .l-fv__copy .title {
  font-size: 4.3rem;
  letter-spacing: 0.7em;
}

/*
graphic
*/

body.graphic section.l-fv.firsrt .l-fv__copy .title {
  text-align: left;
}

/*
single
*/

section.l-fv.single .l-fv__copy .title {
  font-size: 4rem;
}

/*
arrow
*/

section.l-fv.arrow .l-fv__copy .title {
  font-size: 4.65rem;
}

/* eng */

.l-fv__copy .eng {
  font-size: 1.3rem;
  letter-spacing: 0.08em;
  margin-top: 1.7rem;
}

/*
bgColor
*/

section.l-fv.service .l-fv__copy .title {
  color: #fff;
  text-shadow: initial;
}

/*
single
*/

section.l-fv.single .l-fv__copy .eng {
  font-size: 1.3rem;
}

/*
design
*/

section.l-fv.service.design .l-fv__copy .title {
  
}
section.l-fv.design .l-fv__copy .title .normal {
  text-align: left;
}

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

.l-fv__copy .titlePolicy {
  padding-bottom: 4rem 
}
.l-fv__copy .titlePolicy .eg {
  font-size: 4.05rem;
}


/* ------ desc ------- */

.l-fv__desc {
  font-size: 1.25rem;
  color: #d1d1d1;
  margin-top: 9.1rem;
  line-height: 2.4;
  margin-left: auto;
  width: 32rem;
  margin-right: 0rem;
}

/*
service
*/

section.l-fv.service .l-fv__desc {
  margin-top: auto;
  text-shadow: initial;
  margin-left: auto;
}

/*
design
*/

section.l-fv.service.design .l-fv__desc {
  
}


/* ------ info ------- */

.l-fv__info {
  margin-top: 11.4rem;
  margin-left: auto;
  text-align: right;
}

/* list */

.l-fv__info ul li + li {
  margin-top: 3.1rem;
}
.l-fv__info ul li .txt {
  font-size: 1.2rem;
  margin-top: 0.8rem;
  margin-left: -0.1rem;
}


/* --------------------------- 
  ■ l-fv__image
--------------------------- */

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

.l-fv__image {
  height: 94vw;
  width: 96vw;
  margin: 21.4rem auto 0;
}


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ mv

><><><><><><><><><><><><><><><><><><><>

/* --------------------------- 
  ■ l-mv
--------------------------- */

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

section.l-mv {
  width: 100%;
  height: 100%;
}

/*
loading
*/

body.two section.l-mv {
  width: 98%;
  height: 100%;
}

/* top */

body.top section.l-mv > .image.second {
  
}


/* --------------------------- 
  ■ l-mvArea
--------------------------- */

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

section.l-mvArea {
  width: 100%;
  height: 100vw;
}

/*
change
*/

body.top section.l-mv.change > .image.first {
  opacity: 1;
}

/*
margin
*/

section.l-intro + section.l-mvArea {
  display: none;
}


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ Intro

><><><><><><><><><><><><><><><><><><><>

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

section.l-intro {
  align-items: center;
  flex-flow: column;
  height: initial;
}
section.l-intro > .inner {
  flex-flow: column;
  align-items: initial;
  padding-left: initial;
  padding-right: initial;
  width: 69%;
  margin-top: initial;
  flex-flow: column;
  padding-top: 12.3rem;
  padding-bottom: 21rem
}

/*
about
*/

body.about section.l-intro > .inner {
  padding-bottom: initial;
}

/*
joinus
*/

body.join section.l-intro > .inner {
  padding-bottom: initial;
}

/*
single
*/

section.l-fv.single + section.l-mvArea + section.l-intro > .inner {
  padding-left: initial;
  padding-bottom: initial;
  padding-right: initial;
}


/* --------------------------- 
  ■ copy
--------------------------- */

.l-intro__copy {
  margin-top: initial;
}

/* jpn */

.l-intro__copy .jpn {
  font-size: 2.7rem;
}

/* eng */

.l-intro__copy .eng {
  font-size: 1.3rem;
  margin-left: initial;
  margin-top: 1.8rem;
}


/* --------------------------- 
  ■ desc
--------------------------- */

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

.l-intro__desc {
  margin-left: initial;
  flex-flow: column;
  margin-top: 6.2rem
}

/* ------ txt ------- */

.l-intro__desc .txt {
  font-size: 1.4rem;
  line-height: 2.75;
  letter-spacing: 0.06em;
  width: 100%;
}
.l-intro__desc .txt + .txt {
  margin-left: initial;
  margin-top: 3em;
}

/*
single
*/

body.single .l-intro__desc .txt {
  width: 83%;
}
body.single .l-intro__desc .txt + .txt {
  margin-left: initial;
}
body.single .l-intro__desc .txt br {
  display: none;
}

/* --------------------------- 
  ■ Mov & Video
--------------------------- */

/* ------ Mov ------- */

.l-introMov {
  width: 124%;
  margin-top: 9.5rem;
  margin-left: -12%;
  margin-bottom: -11rem;
  height: 60vw;
}

/* --- video --- */

.l-introVideo video {
  height: initial;
  width: 89%;
}



/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ sectList

><><><><><><><><><><><><><><><><><><><>

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

section.l-sectList {
  display: initial;
  position: relative;
  padding-right: initial;
  padding-top: 0rem;
  padding-bottom: 0rem;
  padding-left: 0;
  margin-left: 0;
  justify-content: initial;
  align-items: initial;
}
.l-sectList > .inner {
  flex-flow: column;
}

section.l-sectList ul {
  flex-flow: column;
  margin-left: initial;
  margin: initial;
  width: 100%;
}

/*
bgColor
*/

.l-sectList.bgColor {
  background-color: #f5f4f4;
}

/*
archive
*/

body.archive section.l-sectList {
  padding-top: 9rem;
  padding-bottom: 0;
}
body.archive .l-sectList > .inner {
  transform: translateY(0.6rem);
}
body.archive.four .l-sectList > .inner {
  opacity: 1;
  transform: translateY(0rem);
  transition-delay: 0.3s;
}

/*
workflow
*/

section.l-sectList.flow ul {
  margin: initial;
}
section.l-sectList.flow .top {
  margin-top: 0;
}
section.l-sectList.flow li.l-sectList__cont {
  height: initial;
  width: 100%;
  padding: initial;
  padding-top: 12rem;
  padding-bottom: 14rem;
}
section.l-sectList.flow li.l-sectList__cont + li {
  
}
section.l-sectList.flow li.l-sectList__cont .cont {
  width: 81%;
  margin: 5.8rem auto 0;
}
section.l-sectList.flow  li.l-sectList__cont > .bottom {
  margin: 0 auto;
  align-items: initial;
}

/*
num
*/

section.l-sectList.flow li.l-sectList__cont .num {
  font-size: 1.85rem;
  margin-left: initial;
  width: initial;
}

/*
title
*/

section.l-sectList.flow li.l-sectList__cont .title {
  margin-top: 1.8rem;
}
section.l-sectList.flow li.l-sectList__cont .title .main {
  font-size: 3.65rem;
  font-weight: 500;
  letter-spacing: 0.14em;
}

/*
sub
*/

section.l-sectList.flow li.l-sectList__cont .title .sub {
  font-size: 1.25rem;
  margin-top: 0.6rem;
}

/*
txt
*/

section.l-sectList.flow li.l-sectList__cont .txt {
  font-size: 1.4rem;
  line-height: 2.45;
}


/* --------------------------- 
  ■ l-sectList__cont
--------------------------- */

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

li.l-sectList__cont {
  height: initial;
  width: 100%;
  padding: initial;
  margin-top: initial;
  padding-top: 13.5rem;
  padding-bottom: 10.5rem;
  position: sticky;
  top: -35vw;
  background-color: #fff;
  transition: all ease .25s;
}

li.l-sectList__cont:nth-child(2n) {
  background-color: #fbfafa;
}
body.listColor li.l-sectList__cont:nth-child(2n) {
  background-color: #fff;
}


li.l-sectList__cont > .top {
  flex-flow: column;
  width: 69%;
  margin: 0 auto;
  text-align: left;
}
li.l-sectList__cont > .bottom {
  width: 86.4%;
  margin: 8.9rem auto 0;
  flex-flow: column;
  align-items: initial;
}

li.l-sectList__cont + li {
  border-left: initial;
  border-top: 1px solid #f2f2f2;
  padding-top: 14.5rem;
}

/*
works
*/

section.l-sectList.works li.l-sectList__cont {
  width: 100%;
  padding-top: 12rem;
  padding-bottom: 18.5rem;
  padding-left: initial;
  padding-right: initial;
}
section.l-sectList.works li.l-sectList__cont > .top {
  text-align: left;
}
section.l-sectList.works li.l-sectList__cont > .bottom {
  margin: 12rem auto 0;
}


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

/* num */

li.l-sectList__cont .num {
  font-size: 1.95rem;
  margin-left: 0.3rem;
  width: 100%;
}

/* title */

li.l-sectList__cont .title {
  margin-top: 2.3rem;
  width: 100%;
}
li.l-sectList__cont.graphic .title {
  text-align: left;
}

/*
main
*/

li.l-sectList__cont .title .main {
  font-size: 4.15rem;
}
section.l-sectList.works li.l-sectList__cont .title .main {
  font-size: 3.85rem;
}

li.l-sectList__cont .title .main .normal {
  margin-left: initial;
}


/*
sub
*/

li.l-sectList__cont .title .sub {
  font-size: 1.2rem;
  letter-spacing: 0.2em;
  margin-top: 1.6rem;
  margin-left: 0;
}

/*
cat
*/

li.l-sectList__cont .title .cat {
  margin-top: 2.3rem;
  font-size: 1.2rem;
}
li.l-sectList__cont .title .cat:before {
  margin-left: 0.1rem;
  margin-right: 0.7rem;
}

/* ------ bottom ------- */

/* image */

li.l-sectList__cont .image {
  width: 36%;
  height: 44vw;
  margin-left: auto;
  margin-right: 4.5%;
}

/*
works
*/

section.l-sectList.works li.l-sectList__cont > .bottom {
  width: 78.4%;
} 
section.l-sectList.works li.l-sectList__cont .image {
  width: 46%;
  height: 49vw;
}

/* cont */

li.l-sectList__cont .cont {
  width: 51.5%;
  margin: initial;
  margin-left: 9%;
  margin-top: 10rem;
}

/*
txt
*/

li.l-sectList__cont .txt {
  font-size: 1.35rem;
  line-height: 2.6;
  text-align: left;
  letter-spacing: 0.05em;
}

/*
btn
*/

li.l-sectList__cont .btn {
  position: relative;
  right: 10rem;
  top: initial;
}


/* --------------------------- 
  ■ l-sectList_btn
--------------------------- */

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

.l-sectList_btn {
  font-size: 1.5rem;
  transform: initial;
  margin-left: initial;
  margin-right: initial;
  text-align: center;
  margin-top: -4rem;
  padding-top: 0rem;
  padding-bottom: 14rem;
}

/*
news
*/

body.news .l-sectList_btn {
  margin-top: 12.2rem;
  margin-bottom: srem;
  transform: translateY(0.6rem);
  opacity: 0;
  transition: 2.55s all cubic-bezier(.275,0,0,1);
  transition-delay: 2s;
}
body.four.news  .l-sectList_btn {
  transform: translateY(0rem);
  opacity: 1;
}

/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ sectArrow

><><><><><><><><><><><><><><><><><><><>

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

section.l-sectArrow {
  justify-content: center;
}
section.l-sectArrow > .inner {
  height: 85vw;
  width: 68%;
  padding-left: initial;
  padding-right: initial;
  border-left:initial;
}

/*
margin
*/

section.l-intro + section.l-sectArrow > .inner {
  border-left: 0px solid #f2f2f2;
  margin-left: initial;
  padding-left: 0rem;
  padding-right: initial;
  height: 25vw;
}

/*
philosophy
*/

body.philosophy section.l-sectArrow {
  display: none;
}

/*
single
*/

section.l-intro + section.l-sectArrow > .inner {
  margin-top: 15rem;
  height: initial;
  justify-content: center;
}


/* --------------------------- 
  ■ cont
--------------------------- */

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

.l-sectArrow__cont {
  width: 100%;
  height: 61%;
  margin-top: auto;
  display: flex;
}
.l-sectArrow__cont a {
  flex-flow: column;
  height: 100%;
  margin-left:auto;
}

/* ------ arrow ------- */

.l-sectArrow__cont .arrow {
  order: 2;
  border: 1px solid #e6e6e6;
  width: 10.8rem;
  height: 10.8rem;
  margin-top: auto;
  margin-left: auto;
  margin-right: initial;
}

/*
Design
*/

li.l-sectList__cont .btn .l-sectArrow__cont a {
  display: block;
}
li.l-sectList__cont .btn .l-sectArrow__cont .arrow {
  margin-top: -4rem;
  margin-left: auto;
  margin-right: 15.7%;
}

/*
CircleBase
*/

.arrow .circleBase {
  display: none;
}

/*
CircleArrow
*/

.arrow .circleArrow {
  display: none;
}

/*
arrow - normal
*/

.l-sectArrow__cont .arrow:before {
  width: 1.3rem;
  height: 1.25rem;
}


/* ------ cont ------- */

.l-sectArrow__cont .cont {
  order: 1;
  margin-left: initial;
  width: 100%;
}

/* eng */

.l-sectArrow__cont .eng {
  font-size: 4.3rem;
  letter-spacing: 0.08em;
  text-transform: initial;
}

/* jpn */

.l-sectArrow__cont .jpn {
  font-size: 1.2rem;
  letter-spacing: 0.18em;
  margin-top: -0.4rem;
}

/* engOnly */

.l-sectArrow__cont .engOnly {
  font-size: 4.05rem;
  letter-spacing: 0.125em;
}

/*
single
*/

section.l-intro + section.l-sectArrow .l-sectArrow__cont .cont {
  display: none;
}

/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ gallery

><><><><><><><><><><><><><><><><><><><>

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

section.l-gallery {
  height: initial;
  width: 100%;
  padding-top: 4rem;
  padding-right: initial;
  padding-bottom: 0.9rem;
}
section.l-gallery ul {
  flex-flow: column;
  height: initial;
}

/* --------------------------- 
  ■ image
--------------------------- */

li.l-gallery__cont {
  width: 96%;
  height: 94vw;
}
li.l-gallery__cont + li.l-gallery__cont {
  margin-left: initial;
  margin-top: 1.2rem;
}


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ credit

><><><><><><><><><><><><><><><><><><><>

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

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

section.l-sectCredit {
  height: initial;
  display: flex;
  align-items: initial;
  justify-content: center;
  padding-left: initial;
  padding-right: initial;
  margin-left: initial;
}
section.l-sectCredit > .inner {
  width: 70%;
  height: initial;
  padding-top: 15rem;
  padding-bottom: 33rem;
}

/* --------------------------- 
  ■ list
--------------------------- */

.l-sectCredit__cont {
  margin-top: 7rem;
  flex-flow: column;
}
.l-sectCredit__list + .l-sectCredit__list {
  margin-left: initial;
  margin-top: 3.7rem;
}
.l-sectCredit__list li + li {
  margin-top: 5.4rem;
}

/* credit */

.l-sectCredit__list .credit {
  font-size: 1.55rem;
  letter-spacing: 0.035em;
  margin-top: 1.3rem;
}


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ sectInfo

><><><><><><><><><><><><><><><><><><><>

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

section.l-sectInfo {
  width: 100%;
  min-height: 91vw;
  height: initial;
  margin-top: initial;
  position: relative;
  background-color: #f2f2f2;
}
section.l-sectInfo > .inner {
  width: 81.5%;
  height: initial;
  flex-flow: column;
  padding-top: 4rem;
  padding-bottom: 4rem;
}

/*
service
*/

section.l-sectInfo.service {
  min-height: initial;
  display: flex;
  flex-flow: column;
}
section.l-sectInfo.service > .inner {
  padding-top: 15rem;
  padding-bottom: 11rem;
}
section.l-sectInfo.service:before {
  content:"";
  display: block;
  width: 96%;
  margin:0 auto;
  border-top: 1px solid #f2f2f2;
}

/*
about
*/

section.l-sectInfo.service.about > .inner {
  padding-bottom: 20rem;
  height: 72%;
}

/*
policy
*/

section.l-sectInfo.policy > .inner {
  height: initial;
  padding-left: initial;
  padding-right: initial;
  width: 80%;
  margin:0 auto;
}
.l-policy__list {
  width: 100%;
}
.l-policy__list + .l-policy__list {
  margin-left: initial;
  margin-top: 6.9rem;
  padding-top: 6.9rem;
  border-top: 1px solid #e5e5e5;
}


/* --------------------------- 
  ■ cont
--------------------------- */

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

/*
about
*/

section.l-sectInfo.service.about {
  width: 100%;
}
section.l-sectInfo.service.about .l-sectInfo__cont {
  width: 100%;
  margin-top: 9rem;
  margin-bottom: 0;
}

/* ------ list ------- */

.l-sectInfo__list > ul {
  width: 38%;
}
.l-sectInfo__list ul.main > li + li {
  margin-top: 3rem;
}

/* info */

.l-sectInfo__list dt {
  font-size: 1.4rem;
}
.l-sectInfo__list dd {
  font-size: 1.45rem;
  margin-top: 0.9rem;
  line-height: 1.95;
}
.l-sectInfo__list dd.little {
  font-size: 1.35rem;
}


/* --------------------------- 
  ■ copy
--------------------------- */

/* ------ title ------- */

.l-sectInfo__copy .title {
  font-size: 4.1rem;
}
.l-sectInfo__copy .title .normal {
  margin-left: initial;
}


/* --------------------------- 
  ■ cont
--------------------------- */

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

.l-sectInfo__cont {
  width: 100%;
  margin-top: 7.6rem;
}

/* ------ desc ------- */

.l-sectInfo__cont .desc {
  font-size: 1.45rem;
  color: #404040;
  opacity: 0;
  letter-spacing: 0.05em;
  line-height: 2.55;
}

/* ------ btn ------- */

.l-sectInfo__cont .btn {
  margin-top: 6.1rem;
}
.l-sectInfo__cont .btn a {
  font-size: 1.8rem;
  padding: 4.2rem 0 4rem;
  border: 1px dotted rgba(0,0,0,0.1);
}

.l-sectInfo__cont .btn + .btn {
  margin-top: 0.4rem;
  margin-bottom: initial;
} 


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ seviceList

><><><><><><><><><><><><><><><><><><><>

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

section.l-seviceList {
  align-items: initial;
  justify-content: center;
  margin-left: initial;
  padding-bottom: 0rem;
  padding-left: initial;
  padding-right: initial;
  background-color: #fff;
}
section.l-seviceList > .inner {
  width: 100%;
  height: initial;
  display: flex;
  flex-flow: column;
  align-items: initial;
}
section.l-seviceList ul {
  align-items: initial;
  flex-flow: column;
  height: initial;
  margin-left: initial;
}

/*
design
*/

section.l-seviceList.design ul {
  margin-left: initial;
  margin-right: initial;
}

/* --------------------------- 
  ■ l-seviceList__cont
--------------------------- */

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

li.l-seviceList__cont {
  height: initial;
  padding: initial;
  width: 100%;
  padding-top: 13rem;
  padding-bottom: 13rem;
  position: sticky;
  top: 0;
  background-color: #fff;
  transition: 1.85s all ease;
}
li.l-seviceList__cont + li.l-seviceList__cont {
  border-left: initial;
  margin-top: initial;
}

li.l-seviceList__cont > .inner {
  width: 77%;
  margin: 0 auto;
}

.l-seviceList__cont:nth-child(2n) {
  background-color: #fbfafa;
}
section.l-seviceList.bgColor .l-seviceList__cont {
  background-color: #d1cec7;
}


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

li.l-seviceList__cont .top {
  margin: 0rem auto 0;
  width: 97%;
}

/* title */

li.l-seviceList__cont .title .eng {
  font-size: 4.05rem;
  letter-spacing: 0.175em;
}

/* ------ bottom ------- */

li.l-seviceList__cont .bottom {
  margin-top: 11rem;
  margin-left: -1.4rem;
}

/* image */

li.l-seviceList__cont .image {
  height: 50.5vw;
  width: 46.5%;
  padding: 0.3rem;
  margin-left: auto;
}

/* desc */

li.l-seviceList__cont .desc {
  width: 38%;
  margin-left: 14.4%;
  line-height: 2.45;
  font-size: 1.3rem;
}

/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ sectNews

><><><><><><><><><><><><><><><><><><><>

/* --------------------------- 
  ■ l-sectNews__list
--------------------------- */

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

ul.l-sectNews__list {
  width: 82%;
  margin: 0rem auto 0;
}
ul.l-sectNews__list li a > .inner {
  padding-top: 7rem;
  padding-bottom: 7rem;
}

/* ------ date ------- */

ul.l-sectNews__list .date {
  font-size: 1.4rem;
  width: 20.9%;
}

/* ------ title ------- */

ul.l-sectNews__list .title {
  font-size: 1.6rem;
}

/* ------ image ------- */

ul.l-sectNews__list .image {
  height: 13.4vw;
  width: 14vw;
}


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ pagenation

><><><><><><><><><><><><><><><><><><><>

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

section.l-pagenation {
  width: 100%;  
  height: initial;
  margin-top: -3.9rem;
  padding-bottom: 17rem;
  margin-left: initial;
  padding-left: initial;
}
.c-pagenation ul li + li {
  margin-left: 0.7rem;
}


/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ semiOrder

><><><><><><><><><><><><><><><><><><><>

/* --------------------------- 
  ■ sample
--------------------------- */

/* ------ sample ------- */

.semiOrder_sample {

}

/*
active
*/

.semiOrder_sample.active {
  width: 99%;
}

/* 
><><><><><><><><><><><><><><><><><><><>

  ▼ Price

><><><><><><><><><><><><><><><><><><><>

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

section.l-sectPrice {      
  flex-flow: column;
  align-items: initial;
  padding-left: initial;
  padding-right: initial;
  justify-content: center;
}
section.l-sectPrice > .inner {
  height: initial;
  display: initial;
  width: 73%;
  margin: 13rem auto 18rem;
}

/* --------------------------- 
  ■ List
--------------------------- */

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

.l-sectPrice__cont + .l-sectPrice__cont {
  margin-left: initial;
  padding-left: initial;
  margin-top: 8.5rem;
}

/* ------ title ------- */

.l-sectPrice__cont .title {
  font-size: 1.7rem;
  letter-spacing: 0.17em;
}

/* ------ list ------- */

.l-sectPrice__cont .list  {
  display: block;
  margin-top: 3.4rem;
}
ul.l-sectPrice__list + ul.l-sectPrice__list {
  margin-left: 0;
  margin-top: 4.8rem;
}

ul.l-sectPrice__list li {
  width: 100%;
}
ul.l-sectPrice__list li + li {
  margin-top: 3.7rem;
}

/* item */

ul.l-sectPrice__list li .item .eng {
  font-size: 2.2rem;
}





/*
END
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-==-=-=-=-=-=-=-
*/
}