/* common.css */

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

  0. Common
  1. Header
  2. Footer
  3. Common
  4. Index
  5. UnderCommon
  6. Journal
  7. Design
  8. Philosophy
  9. Company
  10. Contact
  11. Privacy Policy


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

/*
---------------------------------------------------
  0. Common
---------------------------------------------------
*/

/* inview */

.inview {
  padding-top: 15px;
  opacity: 0;
}

.inview.fadeInUp {
  padding-top: 0px;
  opacity: 1;
  transition:all ease .5s;
  transition-delay: .15s;
}


/* cursor */

.btnCursor {
  cursor: pointer;
}
#stalker {
  position: fixed;
  -webkit-transform:
  translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: #ccc;
  width: 15px;
  height: 15px;
  border-radius: 100%;
  transition: all 0.2s ease;
  opacity: 0.2;
  pointer-events: none;
  z-index: 99;
}
#stalker.active {
  transform: scale(3);
}

#stalker.change {
  left: -50%;
  -webkit-transform:
  translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  width: 82px;
  height: 82px;
  opacity: 1;
  -webkit-transition: all 0s ease;
  transition: all 0s ease;
  background-color: #eee;
}
#stalker.change:before {
  content:"";
  position: absolute;
  top: 46%;
  left: 65%;
  width: 6px;
  height: 6px;
  border-top: 1px solid #666;
  border-right: 1px solid #666;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
#stalker.change:after {
  content:"";
  position: absolute;
  top: 46%;
  left: 26%;
  width: 6px;
  height: 6px;
  border-top: 1px solid #666;
  border-right: 1px solid #666;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}



/* wrapper */

.wrapper.under {
  opacity: 0;
  -webkit-transition: all ease .75s;
  transition: all ease .75s;
  padding-top: 15px;
}
.wrapper.under.opacity {
  opacity: 1;
  transition: all ease .75s;
  transition-delay:.05s;
  padding-top: 0px;
}


/* slideMenu */

.slideMenu {
  position: fixed;
  top: 170px;
  width: 100%;
  background-color: #fff;
  z-index: 0;
  visibility: hidden;
  opacity: 0;
  transition: all ease 0.4s;
  box-shadow:0px 6px 8px -5px rgba(0,0,0,0.2);
  transition-delay: 0.2s;
}
.slideMenu.scroll {
 top: 116px;
}
.slideMenu.active {
  visibility: visible;
  opacity: 1;
  z-index: 2;
  transition: all ease .5s;
}
.slideMenu > .inner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  width: 96.9%;
  margin:0 auto;
}
.slideCont {
  margin-top: 39px;
  margin-bottom: 41px;
  padding-top: 25px;
  padding-bottom: 54px;
  width: 33.333%;
}
.slideCont >  .inner {
  width: 69%;
  margin:0 auto;
}
.slideCont + .slideCont {
  border-left: 1px solid #b0e0e6;
}

/*
Left - slideMenu
*/

.slideTitle {
  font-size: 2.25rem;
  letter-spacing: 0.04em;
}
.slideTitle span {
  font-size: 1.2rem;
  font-family: century-gothic, sans-serif;
  letter-spacing: 0.7px;
  margin-top: 10px;
  margin-left: 1px;
  color: #b0e0e6;
  display: block;
}

/*
Middle - slideMenu
*/

.slideNav {
  margin-top: 2px;
}
.slideNav li {
  font-size: 1.9rem;
  letter-spacing: 0.06em;
}
.slideNav li span {
  display: block;
  font-size: 1.15rem;
  font-family: century-gothic, sans-serif;
  letter-spacing: 0.6px;
  margin-top: 11px;
  margin-left: 1px;
  color: #b0e0e6;
}
.slideNav li a {
  transition:all ease .3s;
}
.slideNav li a:hover {
  color:#a7a7a7;
  transition:all ease .3s;
}
.slideNav li a:hover span {
  color:#c5c5c5;
  transition:all ease .3s;
}
.slideNav li + li {
  margin-top: 49px;
}

/*
Right - slideMenu
*/

.slideSub li + li {
  margin-top: 63px;
}
.slideSub .image {
  height: 8.3vw;
  width: 100%;
  overflow:hidden;
}
.slideSub .image .img {
  height: 100%;
  width: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all ease .5s;
  position: relative;
}
.slideSub .image .img:hover {
  transform:scale(1.07);
  transition: all ease .5s;
}
.slideSub .mediaImg {
  background-image: url(../img/thumb/slideMenu/01_media.jpg);
}
.slideSub .designImg {
 background-image: url(../img/thumb/slideMenu/02_production.jpg);
}
.slideSub .philoImg {
 background-image: url(../img/thumb/slideMenu/03_philosophy.jpg);
}
.slideSub .compImg {
 background-image: url(../img/thumb/slideMenu/04_company.jpg);
}

.slideSub .title {
  font-size: 1.75rem;
  letter-spacing: 0.07em;
  margin-top: 23px;
}
.slideSub .title:hover {
  color:#a7a7a7;
  transition:all ease .3s;
}


/* humb */

.humbBg {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0;
  z-index: 5;
  background-color: rgba(0,0,0,0);
  visibility: hidden;
  transition:all ease .5s;
}
.humbBg.active {
  visibility: visible;
  background-color: rgba(0,0,0,0.2);
}

.humbCont.pc {
  display: block;
}
.humbCont.sp {
  display: none;
}
.humbCont {
  position: fixed;
  top: 0;
  height: 0vh;
  width: 100%;
  -webkit-transition: 1s cubic-bezier(.6,0,.25,1);
  transition: 1s cubic-bezier(.6,0,.25,1);
  background-color: #fff;
  z-index: 5;
  transition-delay: 0.3s;
  visibility: hidden;
}
.humbCont.active {
  height: 100vh;
  -webkit-transition: 1s cubic-bezier(.6,0,.25,1);
  transition: 1s cubic-bezier(.6,0,.25,1);
  transition-delay: 0.3s;
  visibility: visible;
  z-index: 10;
}
.humbCont > .inner {
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: all ease .5s;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.humbCont.active >  .inner {
  opacity: 1;
  visibility: visible;
  -webkit-transition: 1s cubic-bezier(.6,0,.25,1);
  transition: 1s cubic-bezier(.6,0,.25,1);
  transition-delay: 1.1s;
}

/* Left */

.humbCont .left {
  width: 32%;
  height: 100%;
  position: relative;
}
.humbCont .left .inner {
  width: 32%;
  height: 100%;
  margin:0 auto;
  position: relative;
}
.humbCont .humbNav {
  font-family: garamond-premier-pro-display, serif;
  font-size: 4.9rem;
  letter-spacing: 1.3px;
  font-weight: 300;
  padding-top: 13.1vh;
}
.humbCont .humbNav ul li + li {
  margin-top: 29px;
}
.humbCont .humbNav ul li a {
  transition:all ease .3s;
}
.humbCont .humbNav ul li a:hover {
  color:#969696;
  transition:all ease .3s;
}
.humbNavBtn a {
  transition: all ease .5s;
}
.humbNavBtn.active a {
  color:#969696;
  transition: all ease .5s;
}
.humbCont .humbNav ul li {
  transition:all ease .3s;
}
.humbCont .humbNav ul li:hover {
  color:#969696;
  transition:all ease .3s;
}
.humbNavBtn {
  transition: all ease .5s;
}
.humbNavBtn.active {
  transition: all ease .5s;
}

.humbCont .humbNav ul li {
  position: relative;
  display: inline-block;
}
.humbCont .humbNav ul li:after {
  position: absolute;
  bottom: -4px;
  left: 0;
  content: '';
  width: 100%;
  height: 0px;
  background: rgba(0,0,0,0.15);
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.humbCont .humbNav ul li:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}



.humbInfo {
  position: absolute;
  bottom: 93px;
  font-family: 'Helvetica Neue LT W01_41488878';
  font-size: 1.3rem;
  letter-spacing: 0.8px;
  line-height: 29px;
}
.humbInfo a {
  position: relative;
}
.humbInfo a:after {
  position: absolute;
  bottom: -6px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: rgba(0,0,0,0.15);
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.humbInfo a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}

.humbInfo .tel {
  margin-top: 15px;
}


/* Middle */

.humbCont .middle {
  position: relative;
  width: 56%;
  border-left: 1px solid #b0e0e6;
  border-right: 1px solid #b0e0e6;
}
.humbCont .middle .inner {
  width: 72%;
  height: 100%;
  position: relative;
  margin:0 auto;
}

.humbSubCont {
  width: 100%;
  position: absolute;
  top:12.1vh;
  left: 50%;
  transform:translateX(-50%);
  visibility: hidden;
  transition: all ease .5s;
  opacity: 0;
}
.humbSubCont.active {
  visibility: visible;
  opacity: 1;
  transition: all ease .5s;
  z-index: 1;
}
.humbSubCont .image {
  width: 100%;
  height: 0vw;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all ease .5s;
  position: relative;
}
.humbSubCont .image.delay {
  height: 26vw;
}
.humbCont.active .humbSubCont .image {
  height: 26vw;
}
.humbSubCont .subImage {
  width: 100%;
  height: 25.6vw;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  position: absolute;
  top: 0;
  opacity: 0;
  transition: all ease .5s;
}

.humbSubCont .normalImage {
  background-image: url(../img/seasidewedding_menu.jpg);
}
.humbSubCont .normalImage:before {
  content:"";
  position: absolute;
  top: 0;
  right: -1px;
  width: 101%;
  height: 100%;
  background-color: rgba(255,255,255,1);
  transition: all 1.4s cubic-bezier(.26,0,.07,1);
  transition-delay: 0.3s;
}
.humbSubCont .normalImage.slideIn:before {
   width: 0%;
   transition-delay: 1.3s;
}

.humbSubCont .journalImage.active {
  background-image: url(../img/plan_menu.jpg);
}
.humbSubCont .serviceImage {
  background-image: url(../img/place_menu.jpg);
  transition: all ease .5s;
}
.humbSubCont .serviceImage.none {
  visibility: hidden;
  opacity: 0;
  transition: all ease .5s;
}
.humbSubCont .subImageAbout {
 background-image: url(../img/place_shonan_menu.jpg);
 transition: all ease .5s;
}
.humbSubCont .subImageMedia {
 background-image: url(../img/place_yokohma_menu.jpg);
 transition: all ease .5s;
}
.humbSubCont .subImageProduct {
 background-image: url(../img/place_osaka_menu.jpg);
 transition: all ease .5s;
}
.humbSubCont .subImageWorks {
 background-image: url(../img/place_menu.jpg);
 transition: all ease .5s;
}

.humbSubCont .aboutImage {
 background-image: url(../img/pickup_menu.jpg);
}
.humbSubCont .aboutImage.none {
  visibility: hidden;
  opacity: 0;
  transition: all ease .5s;
}
.humbSubCont .subImageUs {
 background-image: url(../img/pickup_dress_menu.jpg);
 transition: all ease .5s;
}
.humbSubCont .subImagePhilo {
 background-image: url(../img/pickup_flower_menu.jpg);
 transition: all ease .5s;
}
.humbSubCont .subImageCompany {
 background-image: url(../img/pickup_photo_menu.jpg);
 transition: all ease .5s;
}
.humbSubCont .subImageJoinus {
 background-image: url(../img/pickup_menu.jpg);
 transition: all ease .5s;
}

.humbSubCont .contactImage {
  background-image: url(../img/info_menu.jpg);
}

.humbSubNav {
  margin-top: 40px;
  margin-left: 9px;
  display: none;
}
.humbCont.active .humbSubNav {
  display: block;
}
.humbSubNav ul {
  font-size: 0;
}
.humbSubNav ul li {
  font-size: 1.8rem;
  letter-spacing: 0.06em;
  display: inline-block;
  width: 50%;
  position: relative;
}
.humbSubNav ul li a {
  position: relative;
  display: inline-block;
  opacity: 1;
  transition: all ease .45s;
}
.humbSubNav ul li a:hover {
  opacity: 0.5;
  transition: all ease .45s;
}
.humbSubNav ul li:nth-child(-n+2) {
  margin-bottom: 14px;
}
.humbSubNav ul li span {
  font-size: 1.2rem;
  font-family: century-gothic, sans-serif;
  letter-spacing: 0.9px;
  display: block;
  color: #b0e0e6;
  margin-top: 12px;
  margin-left: 1px;
  transition: all ease .45s;
}
.humbSubNav ul li:before {
  content: "\A" ;
  white-space: pre;
}


/* Right */

.humbCont .right {
  width: 12%;
  height: 100%;
  position: relative;
}
.humbCont .right > .inner {
  width: 70%;
  height: 100%;
  margin:0 auto;
  position: relative;
}

.humbClose {
  position: absolute;
  width: 27px;
  height: 27px;
  left: 50%;
  transform: translateX(-50%);
  top: 47px;
  z-index: 4;
}
.humbClose span {
  position: absolute;
  height: 1px;
  width: 100%;
  background-color: #000;
}
.humbClose span:nth-child(1) {
  top: 16px;
  transform:rotate(45deg);
}
.humbClose span:nth-child(2) {
  transform:rotate(-45deg);
  top: 16px;
}

.humbCont .langNav {
  font-size: 1.45rem;
  font-family:'Helvetica Neue LT W01_41488878';
  position: absolute;
  top: 49.4%;
  left: 50%;
  transform:translateX(-50%);
  display: none;
}
.humbCont .langNav li {
  display: inline-block;
  position: relative;
}
.humbCont .langNav li + li {
  margin-left: 10px;
}
.humbCont .langNav li + li:before {
  content:"/";
  position: absolute;
  top: 0;
  left: -11px;
  color:#999;
}
.humbCont .langNav li a {
  position: relative;
}
.humbCont .langNav li a:before {
  content:"";
  position: absolute;
  bottom: -6px;
  height: 2px;
  width: 0%;
  background-color: #000;
  transition:all ease 0.3s;
}
.humbCont .langNav li a:hover:before {
  width: 100%;
  transition:all ease 0.3s;
}
.humbCont .langNav li a.active {
  width: 100%;
}

.humbSocial {
  font-size: 1.35rem;
  font-family:'Helvetica Neue LT W01_41488878';
  letter-spacing: 0.7px;
  line-height: 28px;
  position: absolute;
  bottom: 65px;
  left: 50%;
  transform:translateX(-50%);
  text-align: right;
}
.humbSocial a {
  position: relative;
}
.humbSocial a:after {
  position: absolute;
  bottom: -5px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: rgba(0,0,0,0.15);
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.humbSocial a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}




/*
---------------------------------------------------
  1. Header
---------------------------------------------------
*/

/* commmon */

header {
  height: 170px;
  position: fixed;
  top: -171px;
  width: 100%;
  z-index: 3;
  opacity: 1;
  background-color: #fff;
  transition: all .5s ease;
}
header.slideIn {
  top: 0px;
}

header.active {
  height: 116px;
  margin-top: 0px;
}
header.humbActive {
  margin-top: -171px;
  transition: all 1s cubic-bezier(.86,0,.07,1);
}
header.active.humbActive {
  margin-top: -111px;
}
header.humbActive2 {
  margin-top: 0px;
  transition: all 1s cubic-bezier(.86,0,.07,1);
}
header.humbActive > .inner {
  opacity: 0;
  transition: all .7s ease;
}
header.humbActive2 > .inner {
  opacity:  1;
  transition: all 1.5s ease;
}

header .headeWrap {
  height: 100%;
  width: 92%;
  margin:0 auto;
  border-bottom: 0px solid #fff;
  transition: all .5s ease;
  box-sizing: border-box;
}
header #headWrap {
  border-bottom: 1px solid #b0e0e6;
}
header .headeWrap > .inner {
  height: 100%;
  width: 95.5%;
  margin:0 auto;
  position: relative;
  opacity: 1;
  transition: all 1s cubic-bezier(.86,0,.07,1);
}
header.active .headeWrap {
  border-bottom: 1px solid #b0e0e6;
  transition: all .5s ease;
}

header .mainNav {
  position: absolute;
  top: 10px;
  left: 12px;
  opacity: 0;
  transition: all .3s ease;
  height: 100%;

}
header .mainNav.slideIn {
  top: 0;
  opacity: 1;
  transition: all .5s ease;
}
header.active .mainNav {
  top:0;
}
header.active .mainNav ul li .btnInner {
  margin-top: -3px;
}

header .mainNav ul {
  height: 100%;
   vertical-align: middle;
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
   display: -o-flex;
   display: flex;
   justify-content: center;
   align-items: center;
}
header .mainNav ul li {
  font-size: 1.6rem;
  font-family:'Helvetica Neue LT W01_41488878';
  letter-spacing: 0.06em;
  position: relative;
  text-decoration: none;
  transition: .3s;
  height: 100%;
  display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
   display: -o-flex;
   display: flex;
   justify-content: center;
   align-items: center;
}
header .mainNav ul li + li {
  margin-left: 53px;
}
header .mainNav ul li:before {
  content:"";
  position: absolute;
  width: 0;
  height: 2px;
  bottom:-2px;
  left: 0;
  background-color: #20b2aa;
  z-index: 2;
  transition: all 0.8s cubic-bezier(0.08, 0.92, 0.35, 1);
}
header .mainNav ul li.journalBtn:hover:before {
  width: 100%;
}
header .mainNav ul li.addCurrent:before {
  width: 100%;
}
header .mainNav ul li.addCurrent.closeline:before,
header .mainNav ul li.addCurrent.closeline2:before {
  width: 0%;
}
header .mainNav ul li.underline:before {
  width: 100%;
}

header .mainNav ul li a.btnInner {
  margin-top: -3px;
  opacity: 1;
  transition: all ease .35s;
}
header .mainNav ul li a.btnInner:hover {
  opacity: 0.5;
  transition: all ease 0.15s;
}


/* title */

header .title {
  position: absolute;
  left: 51.5%;
  top:56.6%;
  transform: translate(-50%,-50%);
  font-family: garamond-premier-pro-display, serif;
  font-weight: 400;
  letter-spacing: 6.6px;
  font-size: 3.5rem;
  transition: all .3s ease;
  opacity: 0;
}
header .title.slideIn {
  top:52%;
  opacity: 1;
  transition: all .5s ease;
}
header.active .title {
  font-size: 2.8rem;
  letter-spacing: 5.4px;
  top: 52%;
  transition: all .3s ease;
}


/* humb */

header .humb {
  position: absolute;
  top: 53%;
  transform: translateY(-50%);
  right: 2px;
  width: 31px;
  height: 14px;
  z-index:11;
  transition: all .3s ease;
  opacity: 0;
}
header .humb.slideIn {
  top: 48%;
  opacity: 1;
  transition: all .5s ease;
}
header.active .humb {
  top: 49%;
}

header .humb span {
  position: absolute;
  height: 1px;
  background-color: #000;
  width: 100%;
  display: inline-block;
}
header .humb span:nth-child(1) {
  top: 0;
}
header .humb span:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
}
header .humb span:nth-child(3) {
  bottom: 0;
}



/*
---------------------------------------------------
  2. Footer
---------------------------------------------------
*/

/* common */

footer {
  background-color: #add8e6;
  color:#fff;
}
footer a {
  color:#696969 !important;
}
footer >  .inner {
  width: 80%;
  margin: 0px auto 0px;
  padding-top: 131px;
  position: relative;
  opacity: 0;
  transition: all ease .8s;
  transition-delay: 0.15s;
}
footer >  .inner.fadeIn {
  opacity: 1;
}
.footTop {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}

.footUnder {
  margin-top: 255px;
  padding-bottom: 43px;
}


/* navCont */

.navCont {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.navCont .navTitle {
    font-size: 2.3rem;
    font-family: garamond-premier-pro-display, serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 2.5px;
    white-space: nowrap;
    margin-bottom: 22px;
    padding-top: 5px;
}
.footNav +  .footNav {
  margin-left: 90px;
}
.footNav ul li {
  font-size: 1.3rem;
  opacity: 0.55;
  font-family: 'Avenir LT W01_35 Light1475496';
  letter-spacing: 0.5px;
}
.footNav ul li +  li {
  margin-top: 16px;
}
.footNav ul li a {
  position: relative;
  padding-left: 17px;
  display: inline-block;
  transition: .3s;
}
.footNav ul li a:before {
  position: absolute;
    content: "";
    top: 6px;
    left: -1px;
    width: 4px;
    height: 4px;
    border-top: 1px solid #20b2aa;
    border-right: 1px solid #20b2aa;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 0;
}

.footNav ul li a::after {
  position: absolute;
  bottom: -6px;
  left: 15px;
  content: '';
  width: calc(96% - 15px);
  height: 1px;
  background: #20b2aa;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.footNav ul li a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}


/* socialCont */

.socialCont {
  position: absolute;
  bottom:43px;
  right: 40px;
  z-index: 1;
}
.socialCont .socialNav ul {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.socialCont .socialNav ul li {
  font-size: 1.75rem;
  height: 56px;
  width: 56px;
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 100%;
  text-align: center;
  line-height: 56px;
  background-color: rgba(255,255,255,0);
}
.socialCont .socialNav ul li:last-child {
  display: none;
}
.socialCont .socialNav ul li a {
  display: inline-block;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  transition:all ease .35s;
}
.socialCont .socialNav ul li a:hover {
  background-color: #fff;
  transition:all ease .35s;
}
.socialCont .socialNav ul li i {
  color:#ccc;
  opacity: 0.7;
  transition:all ease .35s;
}
.socialCont .socialNav ul li a:hover i {
  color:#333;
  transition:all ease .35s;
}
.socialCont .socialNav ul li + li {
  margin-left: 8px;
}


/* producedCont */

.producedCont {
  width: 266px;
  margin-left: auto;
  position: relative;
  padding-right: 0px;
}
.producedCont:before {
  content:"";
  position: absolute;
  width:1px;
  height: 112%;
  background-color: #20b2aa;
  left: -100px;
}
.producedCont .title {
  font-size: 3.4rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 3.6px;
  font-weight: 500;
  margin-top: 6px;
  color: #696969;
}
.producedCont .desc {
  opacity: 0.55;
  font-size: 1.2rem;
  font-family: 'Avenir LT W01_35 Light1475496';
  letter-spacing: 0.05em;
  line-height: 2.1;
  margin-top: 14px;
}
.producedCont .address {
  opacity: 0.55;
  font-size: 1.15rem;
  letter-spacing: 0.3px;
  font-family: 'Avenir LT W01_35 Light1475496';
  margin-top: 31px;
}
.producedCont .address + .address {
    margin-top: 18px;
}
.producedCont .address a {
  position: relative;
}
.producedCont .address a:before {
  content:"";
  position: absolute;
  bottom:-6px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #20b2aa;
  transform: scale(1, 1);
  transform-origin: left top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.producedCont .address a:hover::before {
  transform-origin: right top;
  transform: scale(0, 1);
}
.producedCont .address a:after {
  content:"";
  position: absolute;
  bottom:-6px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #20b2aa;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition-delay: 0.3s;
}
.producedCont .address a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}

/* navproducedCont */


.navproducedCont .title {
  font-size: 3.4rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 3.6px;
  font-weight: 500;
  margin-top: 6px;
  color: #696969;
}
.navproducedCont .desc {
  opacity: 0.55;
  font-size: 1.2rem;
  font-family: 'Avenir LT W01_35 Light1475496';
  letter-spacing: 0.05em;
  line-height: 2.1;
  margin-top: 14px;
}
.navproducedCont .address {
  opacity: 0.55;
  font-size: 1.15rem;
  letter-spacing: 0.3px;
  font-family: 'Avenir LT W01_35 Light1475496';
  margin-top: 10px;
}
.navproducedCont .address + .address {
    margin-top: 18px;
}
.producedCont .address a {
  position: relative;
}




/* footUnder */

.footUnder {
  position: relative;
}
.footUnder .copy {
    font-size: 1.1rem;
    font-family: arial, sans-serif;
    opacity: 0.35;
    line-height: 2;
    letter-spacing: 0.08em;
    color: #696969;
}
.footUnder .copy span:nth-child(1) {

}
.footUnder .copy span:nth-child(2) {
  margin-left: 6px;
  letter-spacing: 0.3px;
}
.footUnder .copy span:nth-child(3) {
  margin-left: 5px;
  letter-spacing: 0.6px;
}

.totop {
  position: absolute;
  height: 67px;
  width: 67px;
  border: 1px solid #20b2aa;
  right: -105px;
  bottom: 39px;
  cursor: pointer;
  transition:all ease .35s;
}
.totop:hover {
  background-color: rgba(255,255,255,1);
  transition:all ease .35s;
}
.totop:before {
  position: absolute;
    content: "";
    top: 55%;
    left: 50%;
    width: 8px;
    height: 8px;
    border-top: 2px solid #20b2aa;
    border-right: 2px solid #20b2aa;
    -webkit-transform: translate(-50%,-50%) rotate(-45deg);
    transform: translate(-50%,-50%) rotate(-45deg);
    z-index: 0;
}



/*
---------------------------------------------------
  3. Common
---------------------------------------------------
*/


/* postList */

.postList {
  font-size: 0;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-bottom: 55px;
}
.postList li {
  width: 20.7%;
  margin-bottom: 0px;
  vertical-align: top;
  padding-right: 2.75%;
  padding-bottom: 104px;
}
.postList li + li {
  margin-left: 2.75%;
}
.postList li:nth-child(4n + 4) {
  padding-right: 0;
  border-right: initial;
}
.postList li:nth-child(4n + 5) {
  margin-left: 0;
}
.postList li:nth-last-child(-n + 4) {
  padding-bottom: 60px;
}

.postList .postImg {
  position: relative;
  height: 24.1vw;
  background-color: #ccc;
  overflow: hidden;
}
.postList .postImg > a {
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
  display: inline-block;
  height: 100%;
  width: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all ease .5s;
}
.postList .postImg:hover > a {
  display: inline-block;
  height: 110%;
  width: 110%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all ease .5s;
}
.postList li:nth-child(1) .postImg:hover > a {
  display: inline-block;
  height: 105%;
  width: 105%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all ease .5s;
}
.postList .postCont {
  padding-top: 30px;
  width: 98%;
  margin:0 auto;
}
.postList .postCont h3.title {
  font-size: 1.7rem;
  font-weight: 500;
  margin-top: 5px;
  line-height: 1.95;
  letter-spacing: 0.05em;
}
.postList .postCont .date {
  font-size: 1.05rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  color: #a5a5a5;
  letter-spacing: 0.1em;
  margin-top: 3px;
  margin-left: 1px;
}
.postList .postCont .desc {
  font-size: 1.2rem;
  margin-top: 9px;
  display: none;
}
.postList .postCont .desc a {
  color:#555;
}

.postList .postCont .cat {
  font-size: 1rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  letter-spacing: 0.9px;
  margin-left: 1px;
  margin-top: 11px;
  position: relative;
  display: inline-block;
}
.postList .postCont .cat a {
  color: #383533;
  position: relative;
}
.postList .postCont .cat a:before {
  content:"";
  position: absolute;
  bottom: -7px;
  width: 100%;
  height: 1px;
  background-color: #dbcca8;
  transform: scale(1, 1);
  transform-origin: left top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.postList .postCont .cat a:hover::before {
  transform-origin: right top;
  transform: scale(0, 1);
}
.postList .postCont .cat a:after {
  content:"";
  position: absolute;
  bottom: -7px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #dbcca8;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition-delay: 0.3s;
}
.postList .postCont .cat a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}

/* pagenation */

.pagenation {
  margin-bottom: 66px;
  display: inline-block;
}
.pagenation ul li {
  font-size: 1.5rem;
  display: inline-block;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  position: relative;
  width: 58px;
  height: 58px;
  border:1px solid #eee;
  text-align: center;
  line-height: 60px;
  transition:all ease .35s;
  vertical-align: top;
}
.pagenation ul li.active {
  color:#fff;
  background-color: #161616;
  border: 1px solid #161616;
}
.pagenation ul li a {
  display: inline-block;
  width: 100%;
  height: 100%;
  transition:all ease .35s;
}
.pagenation ul li a:hover {
  background-color: #161616;
  transition:all ease .35s;
  color:#fff;
}
.pagenation ul li + li {
  margin-left: 3px;
}

.pagenation ul li.prev, .pagenation ul li.next {
  color:#ccc;
  position: relative;
}
li.next:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 46%;
    width: 7px;
    height: 7px;
    border-top: 2px solid #cdb99c;
    border-right: 2px solid #cdb99c;
    -webkit-transform: translate(-50%,-50%) rotate(45deg);
    transform: translate(-50%,-50%) rotate(45deg);
    z-index: 0;
}
li.prev:before {
    position: absolute;
    content: "";
    top: 50%;
    left: 51%;
    width: 7px;
    height: 7px;
    border-top: 2px solid #cdb99c;
    border-right: 2px solid #cdb99c;
    -webkit-transform:translate(-50%,-50%) rotate(-135deg);
    transform: translate(-50%,-50%) rotate(-135deg);
    z-index: 0;
}

.imgtop{
  background-image: url(../img/thumb/wedding_top.jpg);
}


/* btn */

.btn {
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  font-size: 1.5rem;
  letter-spacing: -0.2px;
  position: relative;
  display: inline-block;
  margin-top: 0px;
  margin-left: 35px;
}
.btn:before {
  position: absolute;
  top: -7px;
  left: -35px;
  content:"";
  font-size: 2.5rem;
  color:#bfb191;
  transition: all ease .25s;
}
.btn:hover:before{
  left: -31px;
  transition: all ease .25s;
}

.postList + .btn {
  margin-top: 48px;
}


/*
---------------------------------------------------
  4. Index
---------------------------------------------------
*/

/* mv */

.mv {
  width: calc(100% - 19px);
  height: calc(100vh - 28px);
  left: 0px;
  max-height: 62vw;
  min-height: 730px;
  margin:10px auto;
  position: relative;
  margin-bottom: 20px;
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
  opacity:0;
  transition: all ease 1.5s;
}
.mv.opacity {
  opacity:1;
  transition: all ease 1.5s;
}
.mv .slick-track,.mv .slick-slide {
  width: 100% !important;
}


/* slider */

.slider,.slick-list,.slick-track,.slick-slide > div,.slide {
 height: 100%;
}
.slide {
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
}
.mv .slide {
  transform: scale(1.3);
  transition: all ease 3s;
}
.mv .slide.scale {
  transform: scale(1);
  transition: all ease 3s;
}


/* mainCopy */

.mainCopy {
  position: absolute;
  width: 429px;
  top: 215px;
  left: 81px;
  z-index: 1;
  transition: all ease .5s;
}
.mainCopy.fadeOut {
  opacity: 0;
  top: 160px;
}

.mainCopy .title {
  font-size: 4.35rem;
  text-transform: uppercase;
  font-family: garamond-premier-pro-display, serif;
  font-weight: 500;
  line-height: 1.625;
  letter-spacing: 0.42em;
  color: #fff;
  height: 200px;
  overflow: hidden;
}
.mainCopy .title span {
  display: block;
  margin-top: 12px;
  transition:all .6s ease;
  opacity: 0;
}
.mainCopy.fadeInUp .title span {
  display: block;
  margin-top: 0px;
  transition:all .6s ease;
  opacity: 1;
}


.mainCopy .desc {
  font-size: 1.3rem;
  font-family: a-otf-ryumin-pr6n, serif;
  width: 253px;
  letter-spacing: 0.8px;
  line-height: 2.5;
  margin-top: 41px;
  color: #fff;
  transition:all .6s ease;
  opacity: 0;
}
.mainCopy.fadeInUp .desc {
  margin-top: 27px;
  transition:all .6s ease;
  transition-delay: 0.3s;
  opacity: 0.75;
}


/* scrollNav */

.scrollNav {
  position: absolute;
  bottom: 15px;
  left: 80px;
  opacity: 0;
  transition:all .6s ease;
  cursor: pointer;
}
.scrollNav.fadeInUp {
  opacity: 1;
  bottom: 41px;
  transition:all .6s ease;
}
.scrollNav.fadeOut {
  opacity: 0;
  bottom: 62px;
  transition:all .6s ease;
}
.scrollNav .txt {
  font-family:'Helvetica Neue LT W01_41488878';
  display: inline-block;
  letter-spacing: 1.1px;
  position: relative;
  color:#fff;
  margin-left: 0px;
  padding-left: 0px;
  opacity: 0.8;
  font-size: 1.1rem;
}
.scrollNav .txt:after {
  position: absolute;
  bottom: -8px;
  left: -3%;
  content: '';
  width: 104%;
  height: 1px;
  background: rgba(255,255,255,0.2);
  transform: scale(1, 1);
  transform-origin: left top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.scrollNav .txt:hover::after {
  transform-origin: right top;
  transform: scale(0, 1);
}

/* latestInfo */

.latestInfo {
  position: absolute;
  right: 22px;
  bottom:-10px;
  height: 163px;
  width: 478px;
  background-color: rgba(255,255,255,1);
  transition:all .6s ease;
  opacity: 0;
  border: 0px solid #000;
  box-shadow: 0px 0px 6px 1px rgba(0,0,0,0.1);
  border-radius: 2px;
  display: none;
}
.latestInfo.fadeInUp {
  bottom:12px;
  transition:all .6s ease;
  opacity: 1;
}
.latestInfo.fadeOut {
  bottom:38px;
  transition:all .6s ease;
  opacity: 0;
}
.latestInfo a {
  display: inline-block;
  height: 100%;
  width: 100%;
  transition:all ease .35s;
}
.latestInfo a:hover {
  color:#444;
  transition:all ease .35s;
}
.latestInfo .inner {
  height: calc(100% - 50px);
  padding:27px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  transition:all ease .35s;
}
.latestInfo .left {
  padding-left: 8px;
  width: 60%;
}
.latestInfo .left .subTitle {
  font-size: 1.15rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  text-transform: capitalize;
  letter-spacing: 0.6px;
  border-bottom: 1px solid #e1e1e1;
  padding-bottom: 13px;
  margin-bottom: 23px;
  padding-left: 1px;
  margin-top: 2px;
  transition: all ease .35s;
}
.latestInfo .left .title {
  font-size: 1.85rem;
  line-height: 23px;
  margin-top: 12px;
  letter-spacing: 0.01em;
  font-weight: 500;
}
.latestInfo .left .date {
  font-size: 1rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  letter-spacing: 1.1px;
  color:#8c8c8c;
  margin-left: 1px;
  margin-top: 0px;
}
.latestInfo .left .link {
  margin-top: 5px;
}

.latestInfo .right {
  height: 100%;
  margin-left: auto;
}
.latestInfo .right .newsImg {
  width: 112px;
  height: 100%;
  background-color: #ccc;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  box-shadow: 1.6px 1.4px 4px 0px rgba(162, 162, 162, 0.85);
}


/* section - Common */

.sectCommon h2.title {
  font-family: garamond-premier-pro-display, serif;
  font-size: 7.1rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-left: 5px;
}

.sectCommon h2.title span {
  font-size: 1.35rem;
  font-family: a-otf-ryumin-pr6n, serif;
  color: rgba(125, 125, 125,1);
  letter-spacing: 0.06em;
  display: block;
  position: relative;
  margin-top: 6px;
  margin-left: -1px;
}



/* section - News */

.latestNews {
  position: relative;
  width: calc(100% - 12.5%);
  margin:0 auto 115px;
  padding-top: 85px;
}


a.latestBtn {
  position: absolute;
  top:68px;
  right: 3px;
  font-size: 2.8rem;
  color: #b28850;
  height: 60px;
  width: 60px;
  border-radius: 100%;
  border: 1px solid #e1e1e1;
  text-align: center;
  line-height: 62px;
  display: inline-block;
  transition: all ease .5s;
  box-shadow: 1.6px 1.4px 4px 0px rgba(162, 162, 162, 0.15);
  display: none;
}
a.latestBtn:hover {
  right: -10px;
  transition: all ease .5s;
}

.latestList {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  margin-top: 70px;
}
.latestList .left {
  width: 46.9%;
  padding-right: 3.1%;
  position: sticky;
  position: -webkit-sticky;
  bottom: 0px;
  align-self: flex-end;
}
.latestList .left .latestMain {
  padding-bottom: 71px;
}
.latestList .left .postImg {
  position: relative;
  height: 31.5vw;
  background-color: #ccc;
  overflow: hidden;
}
.latestList .left .postImg > a {
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
  display: inline-block;
  height: 100%;
  width: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all ease .5s;
}
.latestList .left .postImg:hover > a {
  display: inline-block;
  height: 108%;
  width: 108%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all ease .5s;
}
.latestList .left .postCont {
  text-align: left;
  padding-top: 25px;
}
.latestList .left .postCont h3.title {
  font-size: 2.2rem;
  letter-spacing: 0.02em;
  width: 97%;
  font-weight: 500;
  line-height: 1.55;
  margin-top: 10px;
  margin-left: 0;
}
.latestList .left .postCont .date {
  font-size: 1.15rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  color: #a5a5a5;
  letter-spacing: 0.09em;
  margin-top: 11px;
  margin-left: 1px;
}
.latestList .left .postCont .cat {
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  letter-spacing: 0.06em;
  margin-left: 1px;
  margin-top: 22px;
  position: relative;
  display: inline-block;
  font-size: 1.2rem;
}


.latestList .right {
  width: 50%;
}
.latestList .right .latestPost {
  font-size: 0   display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
}
.latestList .right .latestPost li {
  width: 43.8%;
  padding-right: 6.2%;
  padding-left: 3.1%;
  display: inline-block;
  vertical-align: top;
  padding-bottom: 44px;
}
.latestList .right .latestPost li:nth-child(1) {
  display: none;
}
.latestList .right .latestPost li +  li:nth-child(2n +  3) {
  padding-right: 0;
  border:none;
}
.latestList .right .latestPost li:nth-child(n + 4) {
  padding-top: 33px;
}



.latestList .right .postImg {
  position: relative;
  height: 25vw;
  background-color: #ccc;
  overflow: hidden;
}
.latestList .right .postImg > a {
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
  display: inline-block;
  height: 100%;
  width: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all ease .5s;
}
.latestList .right .postImg:hover > a {
  display: inline-block;
  height: 107%;
  width: 107%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all ease .5s;
}
.latestList .postCont {
  padding-top: 26px;
}
.latestList .postCont .title {
  font-size: 1.8rem;
  font-weight: 500;
  margin: 5px auto 0;
  line-height: 1.9;
  letter-spacing: 0.04em;
}
.latestList .postCont .date {
  font-size: 1rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  color: #a5a5a5;
  letter-spacing: 0.09em;
  margin-top: 3px;
}
.latestList .postCont .desc {
  font-size: 1.2rem;
  margin-top: 9px;
  display: none;
}
.latestList .postCont .desc a {
  color:#555;
}
.latestList .postCont .cat {
  font-size: 1rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  letter-spacing: 0.06em;
  margin-top: 11px;
  margin-left: 1px;
  position: relative;
  display: inline-block;
}
.latestList .postCont .cat a {
  color: #383533;
  position: relative;
}
.latestList .postCont .cat a:before {
  content:"";
  position: absolute;
  bottom:-5px;
  width: 100%;
  height: 1px;
  background-color: #dbcca8;
  transform: scale(1, 1);
  transform-origin: left top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.latestList .postCont .cat a:hover::before {
  transform-origin: right top;
  transform: scale(0, 1);
}
.latestList .postCont .cat a:after {
  content:"";
  position: absolute;
  bottom:-5px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #dbcca8;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition-delay: 0.3s;
}
.latestList .postCont .cat a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}



/* section - Service */

.sectService {
  position: relative;
  color:#fff;
  background-color: #add8e6;
}
.sectService .navInner {
  position: relative;
  padding-top: 124px;
  padding-bottom: 260px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  z-index: 1;
}
.sectService .navInner .left {
  margin-left: 8%;
  width: 42%;
}
.sectService h2.title span:before {
  width: 200px;
  background-color: rgba(255,255,255,0.4);
}
.sectService .navInner .left .title {
  font-size: 6.6rem;
  line-height: 1.2;
  letter-spacing: 7.6px;
  margin-top: 6px;
}
.sectService .navInner .left h2.title span {
  line-height: 23px;
  font-size: 1.5rem;
  color: rgba(255,255,255,0.8);
  margin-top: 11px;
}

.sectService .navInner .right {
  width: 48.5%;
  padding-left: 1.5%;
}
.serviceSubTitle {
  font-size: 1.25rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  position: relative;
  margin-top: 12px;
  margin-left: 91px;
  margin-bottom: 60px;
}
.serviceSubTitle.inview.fadeInUp {
  opacity: 0.8 !important;
}
.serviceSubTitle:before {
  content:"";
  position: absolute;
  width: 68px;
  height: 1px;
  background-color: #20b2aa;
  top: 51%;
  left: -81px;
}
.sectService .navInner .right .serviceList {
  font-size: 5.4rem;
  font-family: garamond-premier-pro-display, serif;
  font-variant: small-caps;
  letter-spacing: 3.5px;
  margin-top: 0px;
}
.sectService .navInner .right .serviceList li span.jpn {
  font-family: "���S�V�b�N��", YuGothic, "���S�V�b�N Medium", "Yu Gothic Medium", "���S�V�b�N", "Yu Gothic", sans-serif;
  font-size: 1.3rem;
  letter-spacing: 0.8px;
  position: absolute;
  display: inline-block;
  top: 21px;
  height: 17px;
  overflow: hidden;
  letter-spacing: 0px;
  margin-left: 27px;
  visibility: hidden;
  white-space: nowrap;
  opacity: 0;
  transition:all ease .6s;
}
.sectService .navInner .right .serviceList li span.jpn span {
  display: inline-block;
  margin-top: 0px;
  opacity: 0;
  transition:all ease .6s;
}
.sectService .navInner .right .serviceList li.active span.jpn {
  visibility: visible;
  opacity: 0.7;
  transition:all ease .6s;
}
.sectService .navInner .right .serviceList li.active span.jpn span {
  visibility: visible;
  margin-top: 0;
  opacity: 1;
  transition:all ease .3s;
  transition-delay: 0s;
}



.sectService .navInner .right .serviceList li.inview {
  opacity: 0;
}
.sectService .navInner .right .serviceList li.inview.fadeInUp {
  opacity: 0.7;
  transition:all ease .6s;
  position: relative;
}
.sectService .navInner .right .serviceList li span.bar {
  position: relative;
  display: inline-block;
  height: 21px;
}
.sectService .navInner .right .serviceList li span.bar:before {
  content:"";
  position: absolute;
  height: 1px;
  width: 0px;
  background-color: #20b2aa;
  top: 48%;
  right: 9px;
  transition:all ease 0.3s;
  opacity: 0;
}
.sectService .navInner .right .serviceList li.active span.bar:before {
  width: 95px;
  transition:all ease .6s;
  opacity: 1;
}

.sectService .navInner .right .serviceList li + li {
  margin-top: 31px;
}

.sectService .navInner .right .serviceList li.inview.fadeInUp.active {
  opacity: 1;
  transition:all ease .6s;
  margin-left: 30px;
}

.sectService .navInner .right .contTxt {
  position: absolute;
  top: 0;
  left: 40%;
  right: 0;
  height: 100%;
  width: 60%;
  background-color: #add8e6;
  visibility: hidden;
  opacity: 0;
  transition:all ease 0.4s;
}
.sectService .navInner .right .contTxt.active {
  width: 60%;
  visibility: visible;
  opacity: 1;
  transition:all ease 0.4s;
}


.sectService .navInner .right .contMain {
  width: 51%;
  margin:0 auto;
  opacity: 0;
  transition:all ease 0.4s;
}
.sectService .navInner .right .contTxt.active .contMain {
  opacity: 1;
  transition:all ease 0.4s;
  transition-delay: .5s;
}


.sectService .navInner .right .contMain .number {
  font-size: 1.4rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  letter-spacing: 0px;
  margin-top: 141px;
  margin-left: 5px;
  position: relative;
  display: inline-block;
}
.sectService .navInner .right .contMain .number:before {
  content:"";
  position: absolute;
  bottom:-6px;
  width: 104%;
  left: -7%;
  height: 1px;
  background-color: #20b2aa;
}

.sectService .navInner .right .contMain .title {
  font-size: 7rem;
  font-family: garamond-premier-pro-display, serif;
  font-weight: 500;
  font-variant: small-caps;
  letter-spacing: 2.9px;
  padding-top: 21px;
}
.sectService .navInner .right .contMain .title span {
  position: relative;
  display: block;
  font-size: 1.3rem;
  font-family: a-otf-ryumin-pr6n, serif;
  letter-spacing: 0.8px;
  margin-top: 5px;
  margin-left: 1px;
  opacity: 0.8;
}

.sectService .navInner .right .contMain .desc {
  font-size: 1.35rem;
  letter-spacing: 0.05em;
  opacity: 0.9;
  margin-top: 39px;
  margin-left: 39px;
  line-height: 3.3;
  position: relative;
}
.sectService .navInner .right .contMain .desc a {
  color:#fff;
  text-decoration: underline;
}
.sectService .navInner .right .contMain .desc:before {
  content:"";
  position: absolute;
  top: 9px;
  left: -33px;
  width: 1px;
  height: 91%;
  background-color: #20b2aa;
}

a.servBtn {
  font-size: 2.2rem;
  font-family: "��������", "Yu Mincho", YuMincho, "�q���M�m���� Pro", "Hiragino Mincho Pro", "MS P����", "MS PMincho", serif;
  color: #20b2aa;
  height: 82px;
  width: 82px;
  border-radius: 100%;
  border:1px solid rgba(255,255,255,0.3);
  text-align: center;
  line-height: 82px;
  margin-top: 37px;
  display: inline-block;
  transition: all ease .5s;
}
a.servBtn:hover {
  margin-left: 10px;
  transition: all ease .5s;
  background-color: #fff;
}

.servClose {
  position: absolute;
  top:45px;
  right: 37px;
  height: 36px;
  width: 36px;
}
.servClose span {
  position: absolute;
  top: 19px;
  height: 1px;
  width: 100%;
  background-color: #fff;
}
.servClose span:nth-child(1) {
  transform: rotate(45deg);
}
.servClose span:nth-child(2) {
  transform: rotate(-45deg);
}


.sectService .contInner {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.sectService .contInner .left {
  height: 100%;
  width: 50%;
  position: relative;
}

.sectService .contInner .left .contImg {
  position: absolute;
  height: 100%;
  width: 100%;
  opacity: 0;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition:all ease .6s;
}
.sectService .contInner .left .contImg.active {
  opacity: 0.6;
  transition:all ease .6s;
}
.sectService .contInner .left .contImg.active2 {
  opacity: 1;
  transition:all ease .6s;
}
.sectService .contInner .left .contImg:before {
  content:"";
  position: absolute;
  background-color: #add8e6;
  height: 100%;
  width: 100%;
  right: 0;
  transition:all ease .6s;
}

.sectService .contInner .left .servServImg.inview2.active:before {
  width: 100%;
  transition:all ease .6s;
}
.sectService .contInner .left .servServImg.inview2.slideIn.active:before {
  width: 27%;
  transition:all ease .6s;
}
.sectService .contInner .left .servServImg {
   background-image: url(../img/place_01.jpg);
}

.sectService .contInner .left  .servClickImg.active:before {
  width: 27%;
  transition:all ease .6s;
}
.sectService .contInner .left  .servClickImg.active2:before {
  width: 19%;
  transition:all ease .6s;
}
.sectService .contInner .left .servAboutImg {
  background-image: url(../img/place_shonan.jpg);
}
.sectService .contInner .left .servMediaImg {
  background-image: url(../img/place_yokohama.jpg);
}
.sectService .contInner .left .servProductImg {
  background-image: url(../img/place_osaka.jpg);
}


.sectService .contInner .right {
  width: 50%;
}


/* section - Design */

/*
Common
*/

section.sectDesign {
  margin-top: 120px;
  margin-bottom: 220px;
}
section.sectDesign > .inner {
  position: relative;
}

section.sectShonan {
  margin-top: 120px;
  margin-bottom: 220px;
}
section.sectShonan > .inner {
  position: relative;
}

section.sectYokohama {
  margin-top: 120px;
  margin-bottom: 220px;
}
section.sectYokohama > .inner {
  position: relative;
}

section.sectOsaka {
  margin-top: 120px;
  margin-bottom: 220px;
}
section.sectOsaka > .inner {
  position: relative;
}

/*
Head
*/

.sectCommon .sectHead {
  width: 83%;
  margin:0 auto;
  position: relative;
}
section.sectDesign .title {
  font-size: 7.2rem;
  letter-spacing: 0.07em;
  margin-left: 0px;
  white-space: nowrap;
}


.sectDesign .slick-dots {
  position: absolute;
  top: -116px;
  right: 9.5%;
  display: -webkit-flex !important;
  display: -moz-flex !important;
  display: -ms-flex !important;
  display: -o-flex !important;
  display: flex !important;
}
.sectDesign .slick-dots li + li {
  margin-left: 21px;
}
.sectDesign .slick-dots li button {
  background-color: transparent;
  border:none;
  font-size: 0;
  outline: none;
}
.sectDesign .slick-dots li button:before {
  font-size: 1.45rem;
  font-family: 'Helvetica Neue LT W01_41488878';
  letter-spacing: 0.05em;
}

.sectDesign .slick-dots li:nth-child(1) button:before {
  content:"All Day Party";
}
.sectDesign .slick-dots li:nth-child(2) button:before {
  content:"Seaside";
}
.sectDesign .slick-dots li:nth-child(3) button:before {
  content:"Ceremony";
}
.sectDesign .slick-dots li:nth-child(4) button:before {
  content:"Second Party";
}

.sectDesign .slick-dots li:nth-child(5) button:before {
  content:"Photo";
}

.sectDesign .slick-dots li:nth-child(6) button:before {
  content:"After Wedding";
}


.sectDesign .slick-dots li {
  position: relative;
}
.sectDesign .slick-dots li:after {
  content:"";
  position: absolute;
  height: 1px;
  width: 0;
  left: calc((100% - 22px)/2);
  bottom: -11px;
  background-color: #add8e6;
  transition: all 0.8s cubic-bezier(0.08, 0.92, 0.35, 1.5);
}
.sectDesign .slick-dots li:hover:after {
  width: 22px;
  transition:all ease .35s;
}
.sectDesign .slick-dots li.slick-active:after {
  width: 22px;
  transition:all ease .35s;
}
.sectDesign .slick-dots li.current.addCurrent:after {
  width: 22px;
}
.sectDesign .slick-dots li.is-active:after {
  width: 22px;
}

section.sectShonan .title {
  font-size: 7.2rem;
  letter-spacing: 0.07em;
  margin-left: 0px;
  white-space: nowrap;
}


.sectShonan .slick-dots {
  position: absolute;
  top: -116px;
  right: 9.5%;
  display: -webkit-flex !important;
  display: -moz-flex !important;
  display: -ms-flex !important;
  display: -o-flex !important;
  display: flex !important;
}
.sectShonan .slick-dots li + li {
  margin-left: 21px;
}
.sectShonan .slick-dots li button {
  background-color: transparent;
  border:none;
  font-size: 0;
  outline: none;
}
.sectShonan .slick-dots li button:before {
  font-size: 1.45rem;
  font-family: 'Helvetica Neue LT W01_41488878';
  letter-spacing: 0.05em;
}

.sectShonan .slick-dots li:nth-child(1) button:before {
  content:"Beach";
}
.sectShonan .slick-dots li:nth-child(2) button:before {
  content:"Hall";
}
.sectShonan .slick-dots li:nth-child(3) button:before {
  content:"Seahouse";
}
.sectShonan .slick-dots li:nth-child(4) button:before {
  content:"Shrine";
}

.sectShonan .slick-dots li:nth-child(5) button:before {
  content:"Boat";
}


.sectShonan .slick-dots li {
  position: relative;
}
.sectShonan .slick-dots li:after {
  content:"";
  position: absolute;
  height: 1px;
  width: 0;
  left: calc((100% - 22px)/2);
  bottom: -11px;
  background-color: #add8e6;
  transition: all 0.8s cubic-bezier(0.08, 0.92, 0.35, 1.5);
}
.sectShonan .slick-dots li:hover:after {
  width: 22px;
  transition:all ease .35s;
}
.sectShonan .slick-dots li.slick-active:after {
  width: 22px;
  transition:all ease .35s;
}
.sectShonan .slick-dots li.current.addCurrent:after {
  width: 22px;
}
.sectShonan .slick-dots li.is-active:after {
  width: 22px;
}


section.sectYokohama .title {
  font-size: 7.2rem;
  letter-spacing: 0.07em;
  margin-left: 0px;
  white-space: nowrap;
}


.sectYokohama .slick-dots {
  position: absolute;
  top: -116px;
  right: 9.5%;
  display: -webkit-flex !important;
  display: -moz-flex !important;
  display: -ms-flex !important;
  display: -o-flex !important;
  display: flex !important;
}
.sectYokohama .slick-dots li + li {
  margin-left: 21px;
}
.sectYokohama .slick-dots li button {
  background-color: transparent;
  border:none;
  font-size: 0;
  outline: none;
}
.sectYokohama .slick-dots li button:before {
  font-size: 1.45rem;
  font-family: 'Helvetica Neue LT W01_41488878';
  letter-spacing: 0.05em;
}

.sectYokohama .slick-dots li:nth-child(1) button:before {
  content:"Ceremony";
}

.sectYokohama .slick-dots li:nth-child(2) button:before {
  content:"Party";
}

.sectYokohama .slick-dots li {
  position: relative;
}
.sectYokohama .slick-dots li:after {
  content:"";
  position: absolute;
  height: 1px;
  width: 0;
  left: calc((100% - 22px)/2);
  bottom: -11px;
  background-color: #add8e6;
  transition: all 0.8s cubic-bezier(0.08, 0.92, 0.35, 1.5);
}
.sectYokohama .slick-dots li:hover:after {
  width: 22px;
  transition:all ease .35s;
}
.sectYokohama .slick-dots li.slick-active:after {
  width: 22px;
  transition:all ease .35s;
}
.sectYokohama .slick-dots li.current.addCurrent:after {
  width: 22px;
}
.sectYokohama .slick-dots li.is-active:after {
  width: 22px;
}


section.sectOsaka .title {
  font-size: 7.2rem;
  letter-spacing: 0.07em;
  margin-left: 0px;
  white-space: nowrap;
}


.sectOsaka .slick-dots {
  position: absolute;
  top: -116px;
  right: 9.5%;
  display: -webkit-flex !important;
  display: -moz-flex !important;
  display: -ms-flex !important;
  display: -o-flex !important;
  display: flex !important;
}
.sectOsaka .slick-dots li + li {
  margin-left: 21px;
}
.sectOsaka .slick-dots li button {
  background-color: transparent;
  border:none;
  font-size: 0;
  outline: none;
}
.sectOsaka .slick-dots li button:before {
  font-size: 1.45rem;
  font-family: 'Helvetica Neue LT W01_41488878';
  letter-spacing: 0.05em;
}

.sectOsaka .slick-dots li:nth-child(1) button:before {
  content:"Marina";
}
.sectOsaka .slick-dots li:nth-child(2) button:before {
  content:"Hall";
}
.sectOsaka .slick-dots li:nth-child(3) button:before {
  content:"Cruising";
}
.sectOsaka .slick-dots li:nth-child(4) button:before {
  content:"Boat";
}
.sectOsaka .slick-dots li:nth-child(5) button:before {
  content:"Party";
}


.sectOsaka .slick-dots li {
  position: relative;
}
.sectOsaka .slick-dots li:after {
  content:"";
  position: absolute;
  height: 1px;
  width: 0;
  left: calc((100% - 22px)/2);
  bottom: -11px;
  background-color: #add8e6;
  transition: all 0.8s cubic-bezier(0.08, 0.92, 0.35, 1.5);
}
.sectOsaka .slick-dots li:hover:after {
  width: 22px;
  transition:all ease .35s;
}
.sectOsaka .slick-dots li.slick-active:after {
  width: 22px;
  transition:all ease .35s;
}
.sectOsaka .slick-dots li.current.addCurrent:after {
  width: 22px;
}
.sectOsaka .slick-dots li.is-active:after {
  width: 22px;
}


/*
Cont
*/

.sectDesign .sectCont {
  margin-top: 40px;
}
.sectDesign .slick-list {
  padding-left: 2vw;
  position: relative;
  overflow: initial !important;
}
.sectDesign .slick-list:before {
  content: "";
  position: absolute;
  width: 0%;
  height: 77%;
  background-color: #f8f8f8;
  top: 22vw;
  right: 0vw;
  z-index: -1;
  transition: all 0.7s cubic-bezier(.26,0,.07,1);
  transition-delay: 0.25s;
}
.sectDesign .slideIn .slick-list:before {
    width: 0%;
}

.sectDesign .slick-track {
  display: flex !important;
  align-items: center;
}

.sectShonan .sectCont {
  margin-top: 40px;
}
.sectShonan .slick-list {
  padding-left: 2vw;
  position: relative;
  overflow: initial !important;
}
.sectShonan .slick-list:before {
  content: "";
  position: absolute;
  width: 0%;
  height: 77%;
  background-color: #f8f8f8;
  top: 22vw;
  right: 0vw;
  z-index: -1;
  transition: all 0.7s cubic-bezier(.26,0,.07,1);
  transition-delay: 0.25s;
}
.sectShonan .slideIn .slick-list:before {
    width: 0%;
}

.sectShonan .slick-track {
  display: flex !important;
  align-items: center;
}

.sectYokohama .sectCont {
  margin-top: 40px;
}
.sectYokohama .slick-list {
  padding-left: 2vw;
  position: relative;
  overflow: initial !important;
}
.sectYokohama .slick-list:before {
  content: "";
  position: absolute;
  width: 0%;
  height: 77%;
  background-color: #f8f8f8;
  top: 22vw;
  right: 0vw;
  z-index: -1;
  transition: all 0.7s cubic-bezier(.26,0,.07,1);
  transition-delay: 0.25s;
}
.sectYokohama .slideIn .slick-list:before {
    width: 0%;
}

.sectYokohama .slick-track {
  display: flex !important;
  align-items: center;
}

.sectOsaka .sectCont {
  margin-top: 40px;
}
.sectOsaka .slick-list {
  padding-left: 2vw;
  position: relative;
  overflow: initial !important;
}
.sectOsaka .slick-list:before {
  content: "";
  position: absolute;
  width: 0%;
  height: 77%;
  background-color: #f8f8f8;
  top: 22vw;
  right: 0vw;
  z-index: -1;
  transition: all 0.7s cubic-bezier(.26,0,.07,1);
  transition-delay: 0.25s;
}
.sectOsaka .slideIn .slick-list:before {
    width: 0%;
}

.sectOsaka .slick-track {
  display: flex !important;
  align-items: center;
}


.designSlider {
  cursor: grab;
}
.designSlider .slick-slide {
  transition: all ease .5s;
  transition-delay: 1s;
  margin-top: 35px;
  opacity: 0;
}
.designSlider.slideIn .slick-slide {
  margin-top: 0px;
  opacity: 1;
}

.designSlider .slick-slide {
  width: 80vw;
  outline: none;
}
.designSlider .slick-slide  + .slick-slide  {
  padding-left: 9vw;
}

.designSlider li {
  display: -webkit-flex !important;
  display: -moz-flex !important;
  display: -ms-flex !important;
  display: -o-flex !important;
  display: flex !important;
  align-items: center;
}

.designSlider li .left {
  width: 50%;
}
.designSlider li .left .cont {
  width: 71%;
  margin: 60px auto 0;
  opacity: 0;
  transition:all ease .5s;
  transition-delay: 0s;
}
.designSlider .slick-current li .left .cont,
.designSlider .is-active-next li .left .cont {
  margin: 0px auto 0;
  opacity: 1;
  transition-delay: 0.35s;
}

.designSlider li .left .slick-counter {
  font-size: 2.1rem;
  font-family: athelas, serif;
  margin-bottom: 63px;
  letter-spacing: 0.04em;
  position: relative;
  padding-left: 69px;
  display: none;
}
.designSlider li .left .slick-counter:before {
  content:"";
  position: absolute;
  display: block;
  height: 1px;
  width: 48px;
  background-color: #b5b29b;
  left: 5px;
  top: 50%;
}

.designSlider li .left .slick-counter span {
  font-size: 2.1rem;
  font-family: adobe-garamond-pro, serif;
}

.designSlider li .left .title {
  font-size: 3.9rem;
  font-weight: 300;
  line-height: 1.7;
  letter-spacing: 0.07em;
}
.designSlider li .left .title span {
  display: block;
  font-size: 1.75rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 0.06em;
  margin-top: 13px;
  margin-left: 2px;
  color: #b0e0e6;
}
.designSlider li .left .desc {
  font-size: 1.4rem;
  line-height: 3.2;
  letter-spacing: 0.08em;
  margin-top: 34px;
}

.designSlider li .left .readMore {
  font-size: 1.25rem;
  margin-top: 42px;
}


.designSlider li .right {
  width: 50%;
  position: relative;
  height: 45vw;
}
.designSlider li .right .image {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  overflow: hidden;
  transition:all ease .5s;
  transition-delay: 0.2s;
}
.designSlider li .right .image.active {
  transform: translateY(-50%) scale(.95);
}

.designSlider li .right .image figure {
  height: 35vw;
  transition:all ease .5s;
}
.designSlider li .right .image.active figure {
  transform: scale(1.2);
  transition-delay: 0s;
}

.designSlider .slick-current li .right .image figure,
.designSlider .is-active-next li .right .image figure {
  height: 45vw;
  transition:all ease .5s;
  opacity: 1;
  transition-delay: 0.2s;
}

.designSlider li .right .image figure {
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
}
.designSlider li.top .right .image figure {
  background-image: url(../img/allday01.jpg);
}
.designSlider li.seaside .right .image figure {
  background-image: url(../img/seasaide01.jpg);
}

.designSlider li.service .right .image figure {
  background-image: url(../img/weddingceremony01.jpg);
}
.designSlider li.guide .right .image figure {
  background-image: url(../img/secondparty01.jpg);
}
.designSlider li.works .right .image figure {
  background-image: url(../img/photoplan01.jpg);
}

.designSlider li.gift .right .image figure {
  background-image: url(../img/gift01.jpg);
}


.designSlider li.beachwedding .right .image figure {
  background-image: url(/img/place/beachwedding01.jpg);
}

.designSlider li.hallwedding .right .image figure {
  background-image: url(/img/place/hallwedding01.jpg);
}

.designSlider li.enoshimaboatwedding .right .image figure {
  background-image: url(/img/place/enoshimaboat01.jpg);
}

.designSlider li.seahousewedding .right .image figure {
  background-image: url(/img/place/seahousewedding01.jpg);
}

.designSlider li.shrinewedding .right .image figure {
  background-image: url(/img/place/shrinewedding01.jpg);
}

.designSlider li.yokohamaparty .right .image figure {
  background-image: url(/img/place/party01.jpg);
}

.designSlider li.yokohamaceremony .right .image figure {
  background-image: url(/img/place/yokohamaceremony01.jpg);
}

.designSlider li.osakacruising .right .image figure {
  background-image: url(/img/place/osakacruisingwedding01.jpg);
}

.designSlider li.osakaboat .right .image figure {
  background-image: url(/img/place/osakaboatwedding01.jpg);
}

.designSlider li.osakamarina .right .image figure {
  background-image: url(/img/place/osakamarinawedding01.jpg);
}

.designSlider li.osakahall .right .image figure {
  background-image: url(/img/place/osakahallwedding01.jpg);
}

.designSlider li.osakaparty .right .image figure {
  background-image: url(/img/place/osakapartywedding01.jpg);
}








/* section - Case */

/*
Common
*/

section.sectCase {
   background-color: #161616;
   color:#fff;
   position: relative;
}

.caseTitle {
  position: absolute;
  z-index: 1;
  width: 44%;
  height: 100%;
  background-color: rgba(0,0,0,0.3);
}
.caseTitle:before {
  content:"";
  position: absolute;
  background-color: #161616;
  height: 100%;
  width: 100%;
  right: 0;
  z-index: 1;
  transition: all ease .6s;
}
.caseTitle.slideIn:before {
  width: 0%;
}

section.sectCase .caseTitle .title {
  font-size: 7.3rem;
  margin-left: 20%;
  margin-top: 150px;
}
section.sectCase p.title span {
  font-size: 1.45rem;
  color:#fff;
  letter-spacing: 0.13em;
}


/*
caseSlider - common
*/

.caseSlider li {
  display: flex !important;
  height: initial;
  cursor: grab;
}
.caseSlider .slick-list {
  padding-top: 0 !important;
}

/*
caseSlider - Left
*/

.caseSlider li .left {
  width: 44%;
}
.caseSlider li .left .image {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.caseSlider li .left .image figure {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  transform: scale(1.2);
  transition: .8s cubic-bezier(.645, .045, .355, 1);
}
.caseSlider .slick-current li .left figure {
  transform: scale(1);
}
.caseSlider .slick-current li .left .image.active figure {
  transform: scale(1.1);
}


/*
caseSlider - Right
*/

.caseSlider li .right {
  width: 56%;
  display: flex;
  justify-content: center;
}

.caseSlider li .right .cont {
  width: 57%;
  margin-top: 153px;
  margin-bottom: 260px;
  z-index: 1;
}

.caseSlider li .right .slick-counter {
  font-size: 1.4rem;
  font-family: century-gothic, sans-serif;
  letter-spacing: -0.1em;
  display: inline-block;
  margin-bottom: 36px;
  margin-left: 3px;
  position: relative;
}
.caseSlider li .right .slick-counter:before {
  content: "";
  position: absolute;
  bottom: -6px;
  left: -2%;
  width: 105%;
  height: 1px;
  background-color: rgba(232, 202, 164, 0.4);
}
.caseSlider li .right .title {
  font-size: 5.6rem;
  font-family: garamond-premier-pro-display, serif;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.caseSlider li .right .subTitle {
  font-size: 1.4rem;
  font-family:'Helvetica Neue LT W01_41488878';
  font-weight: 300;
  letter-spacing: 0.07em;
  position: relative;
  padding-left: 49px;
  margin-top: 34px;
  opacity: 1;
}
.caseSlider li .right .subTitle:before {
  content: "";
  position: absolute;
  width: 45px;
  height: 1px;
  background-color: rgba(232, 202, 164, 0.4);
  transform: rotate(-48deg);
  left: -5px;
  top: 0px;
}
.caseSlider li .right .desc {
  font-size: 1.4rem;
  line-height: 2.95;
  letter-spacing: 0.07em;
  margin-top: 50px;
  width: 64%;
  max-width: 277px;
}

.caseSlider li .right .readMore {
  font-size: 1.3rem;
  color:#fff;
  margin-top: 50px;
}
.caseSlider li .right .readMore a {
  color:#fff;
}
.caseSlider li .right .readMore:before,
.caseSlider li .right .readMore:after {
  background-color: #6a5e4f;
}

.caseSlider button.slick-arrow {
  top:initial;
  bottom: 53px;
  z-index: 2;
}
.caseSlider button.slick-prev {
  right: 49px;
}
.caseSlider button.slick-prev:hover {
  right: 44px;
}
.caseSlider button.slick-next {
  right: 137px;
}
.caseSlider button.slick-next:hover {
  right: 142px;
}



/* section - Media */

/*
Common
*/



/*
Head
*/

section.sectMedia .title {
  font-size: 7.3rem;
  letter-spacing: 0.08em;
  margin-left: 0px;
  white-space: nowrap;
}

/*
Cont
*/

section.sectMedia .sectCont {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  width: 84.4%;
  margin: 80px auto 230px;
  position: relative;
  align-items: center
}

section.sectMedia .sectCont .left {
  width: 48%;
}
section.sectMedia .sectCont .left .image {
  overflow: hidden;
  transition:all ease .5s;
}
section.sectMedia .sectCont .left .image.active {
  transform: scale(.95);
}

section.sectMedia .sectCont .left .image figure {
  height: 45vw;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  background-position: center center;
  background-image: url(../img/cuisine01.jpg);
  transition:all ease .5s;
}



section.sectMedia .sectCont .left .image.active figure {
  transform: scale(1.2);
}


section.sectMedia .sectCont .right {
  width: 52%;
}
section.sectMedia .sectCont .right .cont {
  width: 45%;
  margin:0 auto;
}

section.sectMedia .sectCont .right .title {
  font-size: 3.9rem;
  font-weight: 300;
  line-height: 1.8;
  letter-spacing: 0.07em;
  white-space: nowrap;
}
section.sectMedia .sectCont .right .title span {
  display: block;
  font-size: 1.75rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 0.06em;
  margin-top: 18px;
  margin-leGft: 2px;
  color: #b0e0e6;
}
section.sectMedia .sectCont .right .desc {
  font-size: 1.4rem;
  line-height: 3.2;
  letter-spacing: 0.08em;
  margin-top: 34px;
}
section.sectMedia .sectCont .right .readMore {
  font-size: 1.2rem;
   margin-top: 42px;
}



section.sectParty .title {
  font-size: 7.3rem;
  letter-spacing: 0.08em;
  margin-left: 0px;
  white-space: nowrap;
}

/*
Cont
*/

section.sectParty .sectCont {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  width: 84.4%;
  margin: 80px auto 230px;
  position: relative;
  align-items: center
}

section.sectParty .sectCont .left {
  width: 48%;
}
section.sectParty .sectCont .left .image {
  overflow: hidden;
  transition:all ease .5s;
}
section.sectParty .sectCont .left .image.active {
  transform: scale(.95);
}

section.sectParty .sectCont .left .image figure {
  height: 45vw;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  background-position: center center;
  background-image: url(/img/place/party01.jpg);
  transition:all ease .5s;
}


section.sectParty .sectCont .left .image.active figure {
  transform: scale(1.2);
}


section.sectParty .sectCont .right {
  width: 52%;
}
section.sectParty .sectCont .right .cont {
  width: 45%;
  margin:0 auto;
}

section.sectParty .sectCont .right .title {
  font-size: 3.9rem;
  font-weight: 300;
  line-height: 1.8;
  letter-spacing: 0.07em;
  white-space: nowrap;
}
section.sectParty .sectCont .right .title span {
  display: block;
  font-size: 1.75rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 0.06em;
  margin-top: 18px;
  margin-leGft: 2px;
  color: #b0e0e6;
}
section.sectParty .sectCont .right .desc {
  font-size: 1.4rem;
  line-height: 3.2;
  letter-spacing: 0.08em;
  margin-top: 34px;
}
section.sectParty .sectCont .right .readMore {
  font-size: 1.2rem;
   margin-top: 42px;
}


/* section - About us */

.sectCommon h2.aboutTitle {
  font-size: 7.3rem;
  letter-spacing: 3.1px;
  margin-left: 0px;
  white-space: nowrap;
}
.sectAbout {
  padding-left: 1%;
  margin-left: 7%;
  padding-top: 125px;
  margin-bottom: 250px;
}
.sectAbout > .inner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.sectAbout .left {
  width: 10.3%;
}
.sectAbout .right {
  width: 93%;
}

.aboutSlider {
  cursor: -webkit-grab;
  cursor: grab;
  margin-top: 175px;
  position: relative;
  z-index: 0;
}
.aboutSlider:before {
  content:"";
  position: absolute;
  width: 0%;
  height: 95%;
  background-color: #add8e6;
  top: 8vw;
  right:0vw;
  z-index: -1;
  transition: all 0.7s cubic-bezier(.26,0,.07,1);
}
.aboutSlider.slideIn:before {
  width: 108%;
}
.aboutSlider .slick-slide {
  width: 26vw;
  outline: none;
  transition: all ease .25s;
}
.aboutSlider .slick-slide:hover {
  margin-top: -10px;
  transition: all ease .25s;
}
.slick-list {
  padding-top: 10px !important;
}
.aboutSlider .slick-slide + .slick-slide {
  margin-left: 65px;
}
.aboutSlider .listCont {
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 3px 3px 10px -3px rgba(0,0,0,0.1);
}
.aboutSlider .slick-slide:hover .listCont {
  transition: all ease .5s;
}
.aboutSlider .listCont.fadeInUp {
  transition-delay:0.7s;
}
.aboutSlider .listCont a {
  width: 100%;
  height: 100%;
  display: inline-block;
  opacity: 1;
  transition:all ease .35s;
  cursor: pointer;
}
.aboutSlider .listCont a:hover {
  opacity: 0.7;
}
.aboutSlider .slick-slide .image {
  overflow: hidden;
}
.aboutSlider .slick-slide .image .img {
  height: 17vw;
  width: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all ease .5s;
}
.aboutSlider .slick-slide:hover .image .img {
  transform: scale(1.1);
  transition: all ease .5s;
}
.aboutSlider .slick-slide .image .philoImg {
  background-image: url(../img/dress01.jpg);
}
.aboutSlider .slick-slide .image .compImg {
  background-image: url(../img/flower01.jpg);
}
.aboutSlider .slick-slide .image .joinImg {
  background-image: url(../img/photo01.jpg);
}

.aboutSlider .slick-slide .image .pickupImg {
  background-image: url(../img/pickup_04.jpg);
}


.aboutSlider .slick-slide .image .basicImg {
  background-image: url(/img/place/basiccourse.jpg);
}

.aboutSlider .slick-slide .image .bbqImg {
  background-image: url(/img/place/enoshima_bbq.jpg);
}
.aboutSlider .slick-slide .image .premiumImg {
  background-image: url(/img/place/premiumcourse.jpg);
}

.aboutSlider .slick-slide .image .anniversaryImg {
  background-image: url(/img/place/anniversarycourse.jpg);
}

.aboutSlider .slick-slide .image .oysterImg {
  background-image: url(/img/place/oystercourse.jpg);
}

.aboutSlider .slick-slide .image .drinkImg {
  background-image: url(/img/place/enoshima_drink.jpg);
}

.aboutSlider .slick-slide .image .oysterplanImg {
  background-image: url(/img/place/yokohama_oysterplan.jpg);
}

.aboutSlider .slick-slide .cont .inner {
  width: 71%;
  margin: 50px auto 67px;
}
.aboutSlider .slick-slide .number {
  font-size: 1.25rem;
  font-family: 'Avenir LT W01_35 Light1475496';
  font-weight: 400;
  color: rgb(163, 149, 117);
  letter-spacing: 1px;
  margin-left: 3px;
  display: none;
}
.aboutSlider .slick-slide .title {
  font-size: 2.55rem;
  letter-spacing: 0.05em;
}
.aboutSlider .slick-slide .subTitle {
  font-size: 1.2rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  letter-spacing: 0.05em;
  color: #b0e0e6;
  margin-top: 10px;
  margin-left: 1px;
}

.aboutSlider .slick-slide .desc {
    font-size: 1.15rem;
    color: #5e5e5e;
    line-height: 2.5;
    letter-spacing: 0.03em;
    margin-top: 23px;
    min-height: 5em;
}

button.slick-arrow {
  border:1px solid #b0e0e6;
  border-radius: 100%;
  height: 83px;
  width: 83px;
  color:transparent;
  position: absolute;
  top : -173px;
  outline: none;
  transition: all ease .25s;
  background: #fff;
}
button.slick-next {
  right: 209px;
}
button.slick-next:hover {
  right: 211px;
  transition: all ease .25s;
}
button.slick-prev {
  right: 120px;
}
button.slick-prev:hover {
  right: 116px;
  transition: all ease .25s;
}
button.slick-arrow:before {
  font-size: 2.9rem;
  color:#b0e0e6;
  position: absolute;
  top: 52%;
  left: 51%;
  transform: translate(-50%,-50%);
}
button.slick-prev:before {
  content:"";
  width: 10px;
  height: 13px;
  background-image: url(../img/common/arrowRight.svg);
  background-repeat:no-repeat;
}
button.slick-next:before {
  content:"";
  left: 50%;
  width: 10px;
  height: 13px;
  background-image: url(../img/common/arrowLeft.svg);
  background-repeat:no-repeat;

}

.designSlider button.slick-arrow {
  display: none !important;
}
.designList .slick-slide .image .servImg {
  background-image: url(../img/thumb/design/nav/01_service.jpg);
}
.designList .slick-slide .image .guideImg {
  background-image: url(../img/thumb/design/nav/02_guide.jpg);
}
.designList .slick-slide .image .workImg {
  background-image: url(../img/thumb/design/nav/03_works.jpg);
}
.designList .slick-slide .image .philoImg {
  background-image: url(../img/thumb/design/nav/04_philosophy.jpg);
}


/* designSelect */

.designSelect {
  background-color: #fafafa;
  margin: 200px auto 0px;
  padding-bottom: 150px;
}
.designSelect > .inner {

}

.designSelect .sectIntro {
  width: 82.5%;
  margin:0 auto;
  padding-top: 120px;
}
.designSelect .sectIntro .title {
  font-size: 3.8rem;
  letter-spacing: 0.06em;
  font-weight: 300;
}
.designSelect .sectIntro .title span {
  display: block;
  font-size: 1.2rem;
  font-family: century-gothic, sans-serif;
  letter-spacing: 0.6px;
  margin-top: 14px;
  margin-left: 1px;
  color: rgb(163, 149, 117);
}

.designList {
  margin-top: 90px;
  margin-left: 14.6%;
}
.designList button.slick-arrow {
  top: -164px;
  bottom:initial;
}
.designList button.slick-prev {
  left:initial;
  right: 82px;
}
.designList button.slick-prev:hover {
  left:initial;
  right: 78px;
}

.designList button.slick-next {
  left:initial;
  right: 171px;
}
.designList button.slick-next:hover {
  left:initial;
  right: 175px;
}


.designList:before {
  background-color: transparent;
}





/* section - Contact us */

.sectContact {
  margin-left: 5.7%;
  padding-top: 140px;
  margin-bottom: 245px;
  border-top: 1px solid #b0e0e6;
}
.ourPhilosophy + .sectContact {
  border-top: 0px solid #e5e5e5;
}
.sectContact > .inner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.sectContact .left {
  width: 37%;
}
.sectContact .right {
  width: 67%;
}
.sectContact h2.title span {
  margin-top: 0;
  letter-spacing: 0px;
}
.sectContact h2.title span:before {
  content:none;
}

.contactTitle {
  font-size: 6.7rem;
  font-family: garamond-premier-pro-display, serif;
  font-weight: 500;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: 2.6px;
  margin-top: -14px;
}
.contactTitle span {
  display: none;
}
a.contactBtn {
  display: inline-block;
  font-size: 2.4rem;
  font-family: "��������", "Yu Mincho", YuMincho, "�q���M�m���� Pro", "Hiragino Mincho Pro", "MS P����", "MS PMincho", serif;
  color: #b0e0e6;
  height: 76px;
  width: 76px;
  border-radius: 100%;
  border: 1px solid #b0e0e6;
  text-align: center;
  line-height: 78px;
  margin-top: 28px;
  margin-left: -5px;
}
a.contactBtn:hover {
  margin-left: 10px;
  transition: all ease .5s;
}


/*
---------------------------------------------------
  5. UnderCommon
---------------------------------------------------
*/

/* common */

header#under  .headeWrap {
  border-bottom: 1px solid #eeeeee;
}
.underCont {
  margin-top: 242px;
}
.archiveCont {
  margin-top: 250px;
}
.underTitle {
  font-size: 3.8rem;
  letter-spacing: 0.05em;
  line-height: 1.75;
  font-weight: 500;
  position: sticky;
  position: -webkit-sticky;
  margin-bottom: 135px;
  top: 190px;
}
.underTitle span {
  font-size: 1.35rem;
  font-family: adobe-garamond-pro, serif;
  color: #b0e0e6;
  letter-spacing: 0.03em;
  display: block;
  line-height: 2.2;
  margin-top: 18px;
  margin-left: 1px;
}
.underProduct .underTitle span {
  color: #cfb38c;
  margin-top: -4px;
}

/* underIntro */

.underIntro {
  margin-bottom: 150px;
}
.serviceCont,.designCont,.philosophyCont,.mediaCont {
  margin-bottom: 0;
}
.aboutCont {
  margin-bottom: 30px;
}
.designFieldCont {
  margin-bottom: 0px;
}

.underHead {
  position: relative;
  width: calc(100% - 11.1%);
  margin-left: auto;
  margin-right: auto;
}
.underHead .title {
  font-family: garamond-premier-pro-display, serif;
  font-weight: 400;
  text-transform: uppercase;
  font-size: 6.6rem;
  letter-spacing: 0.06em;
  margin-left: 1%;
}

.companyCont .underHead .title {
  font-size:7rem;

}
.mediaCont .underHead .title {
  font-size: 7rem;
}
.designCont .underHead .title {
  font-size: 6.9rem;
}

.underHead .title .jpn {
  font-size: 1.35rem;
  font-family: a-otf-ryumin-pr6n, serif;
  color: rgba(77, 77, 77, 0.8);
  letter-spacing: 0.1em;
  position: relative;
  margin-top: 1px;
  margin-left: 1px;
}

.underCommonNav {
  position: absolute;
  top: 11px;
  right: 0.7%;
}
.underNav ul {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.underNav ul li +  li {
  margin-left: 63px;
}
.underNav ul li {
  font-size: 1.5rem;
  font-family: garamond-premier-pro-display, serif;
  font-weight: 500;
  letter-spacing: 0.085em;
  text-transform: uppercase;
  text-align: center;
  position: relative;
}
.underNav ul li + li:before {
  content:"";
  position: absolute;
  top: 6px;
  left: -31px;
  width: 1px;
  height: 25px;
  transform:rotate(24deg);
  background-color: #e7e7e7;
}
.underNav ul li:after {
  content:"";
  position: absolute;
  height: 2px;
  width: 0;
  left: calc((100% - 34px)/2);
  bottom: -23px;
  background-color: #000;
  transition: all 0.8s cubic-bezier(0.08, 0.62, 0.35, 1.2);
}
.underNav ul li:hover:after {
  width: 34px;
  transition:all ease .35s;
}
.underNav ul li.current.addCurrent:after {
  width: 34px;
}
.underNav ul li.is-active:after {
  width: 34px;
}
.underNav ul li span {
  font-size: 1rem;
  font-family: a-otf-ryumin-pr6n, serif;
  letter-spacing: 0.04em;
  display: block;
  color: rgba(77, 77, 77, 1);
  margin-top: 5px;
}


.underMainImg {
  height: 41.5vw;
  width: calc(100% - 30px);
  margin:90px auto 0;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
  position: relative;
  opacity: 1;
}
.underMainImg.sp {
  display: none;
}
.underMainImg.animation {
  opacity: 1;
  transition: all ease .5s;
}
.serviceCont .underMainImg {
  background-image: url(../img/thumb/service/main.jpg);
}
.philosophyCont .underMainImg {
  background-image: url(../img/thumb/about/plan_top_main.jpg);
}
.mediaCont .underMainImg {
  background-image: url(../img/thumb/media/main.jpg);
}
.designCont .underMainImg {
  background-image: url(../img/thumb/design/main.jpg);
}

.aboutCont .underMainImg {
  background-image: url(../img/thumb/about/main.jpg);
}

.seasideCont .underMainImg {
  background-image: url(../img/thumb/about/seaside_top_main.jpg);
}

.pickupCont .underMainImg {
  background-image: url(/img/pickupimg/pickup_main_top.jpg);
}

.infotopCont .underMainImg {
  background-image: url(/img/info/info_top_main.jpg);
}

.placeCont .underMainImg {
  background-image: url(/img/place/place_top_main.jpg);
}

.partyCont .underMainImg {
  background-image: url(/img/place/party_main_top.jpg);
}



/* underAbout */

.underAbout {
  width: calc(100% - 23.3%);
  margin-left: auto;
  margin-right: auto;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  margin-top: 125px;
}
.underAbout .left {
  width: 49.5%;
}
.underAbout .right {
  width: 46%;
  margin-top: -2px;
}

.underAbout .right .desc {
  font-size: 1.6rem;
  line-height: 2.95;
  letter-spacing: 0.05em;
  margin-top: 0px;
}
.underAbout.sp {
  display: none;
}

.underAbout .right .sign {
  margin-top: 46px;
  margin-left: -5px;
}

/* underDesc */

.underDesc {
  width: calc(100% - 12.5%);
  margin: 92px auto;
}
.designFieldCont .underDesc {
  margin-bottom: 160px;
}

.underDesc > .inner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: flex-start;
}
.underDesc > .inner.sp {
  display: none;
}

.underDesc > .inner + .inner {
  margin-top: 18%;
}
.underDesc .left {
  width: 60%;
  margin-right: 6.8%;
  position: sticky;
  position: -webkit-sticky;
  position: -webkit-sticky;
  top: 174px;
  overflow: hidden;
  margin-top: 15px;
  opacity: 0;
}

.underDesc .left.animation {
  margin-top: 0;
  opacity: 1;
  transition:all ease .5s;
}

.underDesc .left .image {
  width: 100%;
  height: 73.8vh;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  position: relative;
  transform:scale(1.1);
  transition:all 4s cubic-bezier(0.18, 0.92, 0.35, 1);
}
.underDesc .left.mediaSlide .image {
  transform:scale(1);
}
.underDesc .left .image.slideLeft {
  transform:scale(1);
  transition-delay: 2s;
}
.underDesc .left .image.slideLeft.transition {
  transition-delay: 0s;
  transition:all ease 0.5s;
}


section.designPhiloCont .underDesc .left {
  height: 73.8vh;
}
.underDesc .left .philoImage {
  position: absolute;
  opacity: 0;
}
.underDesc .left .philoImage.show {
  opacity: 1;
}



.underDesc .left .image:before {
  content:"";
  position: absolute;
  top: 0;
  right: 0;
  width: 0%;
  height: 100%;
  background-color: #fff;
}
.underDesc .left .image.slideLeft:before {
  width: 0%;
  transition: all 1s cubic-bezier(.86,0,.07,1);
  transition-delay:1.9s;
}
.mediaSlide {
  cursor: grab;
}
.mediaSlide .slick-list {
  padding-top: 0 !important;
}

.magazineCont .left .image1 {
  background-image: url(../img/thumb/media/magazine.jpg);
}
.magazineCont .left .image2 {
  background-image: url(../img/thumb/media/magazine02.jpg);
}
.magazineCont .left .image3 {
  background-image: url(../img/thumb/media/magazine03.jpg);
}

.musicCont .left .image1 {
  background-image: url(../img/thumb/media/music.jpg);
}
.musicCont .left .image2 {
  background-image: url(../img/thumb/media/music02.jpg);
}
.musicCont .left .image3 {
  background-image: url(../img/thumb/media/music03.jpg);
}
.musicCont .left .image4 {
  background-image: url(../img/thumb/media/music04.jpg);
}


.designPhiloCont .left .philoImageOne {
  background-image: url(../../assets/img/thumb/service/02_productionMain.jpg);
}
.designPhiloCont .left .philoImageTwo {
  background-image: url(../../../../../photo-1586205985089-21e11a976566.jpeg);
}
.designPhiloCont .left .philoImageThree {
  background-image: url(../../../../../photo-1504768698754-83a2eef21732.jpeg);
}



.companyCont .left .image {
  background-image: url(../img/thumb/about/02_companyMain.jpg);
}
.joinusCont .left .image {
  background-image: url(../img/thumb/about/03_joinusMain.jpg);
}


.underDesc .right {
  width: 33%;
  top: 140px;
  position: sticky;
  position: -webkit-sticky;
  margin-top: 15px;
  opacity: 0;
}
.underDesc .right .philoScroll + .philoScroll{
  margin-top: 140px;
}
.underDesc .right .philoScroll:last-of-type {
  margin-bottom: 150px;
}
.underDesc .right .philoScroll {
  opacity: 0;
  transition:all ease 0.8s;
}
.underDesc .right .philoScroll.show {
  opacity: 1;
  transition:all ease 0.8s;
}


.underDesc .right.animation {
  margin-top: 0;
  opacity: 1;
  transition:all ease .5s;
}

.underDesc .right .title {
  font-size: 3.6rem;
  letter-spacing: 0.02em;
  line-height: 1.75;
  margin-top: -10px;
  font-weight: 500;
  margin-bottom: 45px;
}
.underDesc .right .title br {
  display: none;
}
.underDesc .right .title span {
  display: block;
  font-size: 1.55rem;
  font-family: adobe-garamond-pro, serif;
  letter-spacing: 0.05em;
  color: #b0e0e6;
  margin-top: 12px;
  margin-left: 2px;
}
.underDesc .right .desc {
  font-size: 1.55rem;
  line-height: 3.1;
  letter-spacing: 0.05em;
  margin-top: 0px;
  margin-bottom: 65px;
  opacity: 0.8;
}


.detailBtn {
  font-size: 1.3rem;
  letter-spacing: 0px;
  background: #f1f1f1;
  text-align: center;
  line-height: 63px;
  margin-top: 44px;
  border-radius: 32px;
}
.detailBtn.eng {
  font-size: 1.55rem;
  font-family: adobe-garamond-pro, serif;
  letter-spacing: 1px;
}
.detailBtn a {
  color:#000;
  display: inline-block;
  width: 100%;
  height: 100%;
  border-radius: 32px;
  position: relative;
  transition: all ease 0.35s;
}
.detailBtn a:hover {
  background: #ebebeb;
  transition: all ease 0.35s;
}
.detailBtn span {
  display: inline-block;
  margin-left: -13px;
  padding-left: 24px;
  position: relative;
}
.detailBtn span:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 1px #b6a389;
  border-right: solid 1px #b6a389;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 51%;
  left: 0;
  margin-top: -4px;
}


/* underCompany */

.underCompany {
  margin-top: -3px;
  padding-bottom: 150px;
}
.underCompany dl dt {
  font-size: 1.1rem;
  letter-spacing: 0.4px;
}
.underCompany dl dt:before {
  content:"[";
  margin-left: 1px;
  margin-right: 3px;
}
.underCompany dl dt:after {
  content:"]";
  margin-left: 3px;
}
.underCompany dl dd {
  margin-top: 8px;
  font-size: 1.5rem;
  line-height: 1.9;
  letter-spacing: 0.05em;
}
.underCompany dl + dl {
  margin-top: 23px;
}
.businessList {
  font-size: 1.4rem;
}
.businessList li + li {
  margin-top: 10px;
}


/* selectList */


/*
common
*/

.underSelect {
  margin: 210px auto 0px;
  padding-bottom: 65px;
  padding-top: 65px;
  background-color:#add8e6;
  border-top: 0px solid #add8e6;
}
.underSelect >  .inner {
  width: calc(100% - 16%);
  margin-left: auto;
  margin-right: auto;
  padding-left: 3.9%;
  padding-right: 3.9%;
  padding-bottom: 48px;
  background-color: #fff;
  border-radius: 3px;
  box-shadow: 1.6px 1.4px 4px 0px rgba(162, 162, 162, 0.15);
}


.listCont.inview.fadeInUp.scale.transition .image .img,
.listCont.inview.fadeInUp.transition .image .img {
    transition: all ease .5s;
}


.readMore {
  font-size: 1.1rem;
  font-family:'Helvetica Neue LT W01_41488878';
  font-weight: 400;
  color: #333333;
  letter-spacing: 0.1em;
  margin-top: 30px;
  margin-left: 1px;
  transition: all ease .25s;
  position: relative;
  display: inline-block;
}
.readMore:before {
  content:"";
  position: absolute;
  bottom:-8px;
  left: -3%;
  width: 104%;
  height: 1px;
  background-color: #add8e6;
  transform: scale(1, 1);
  transform-origin: left top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.readMore.hover:hover:before {
  transform-origin: right top;
  transform: scale(0, 1);
}

.readMore:after {
  content:"";
  position: absolute;
  bottom:-8px;
  left: -3%;
  left: 0;
  width: 104%;
  height: 1px;
  background-color: #add8e6;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition-delay: 0.3s;
}
.readMore.hover:hover:after {
  transform-origin: left top;
  transform: scale(1, 1);
}



/*
About
*/

.aboutSelect {
  width: calc(100% - 12.7%);
  padding-top: 9px;
  padding:9px 6.35% 0px;
  opacity: 0;
  margin-top: 15px;
}
.designFieldCont .aboutSelect {
  background: #f7f7f7;
  padding-top: 30px;
  padding-bottom: 100px;
}

.aboutSelect.animation {
  opacity: 1;
  margin-top:0;
  transition: all ease .5s;
}

.aboutSelect .selectList {
  padding-top: 78px;
}
.selectList {
  padding-top:64px;
  font-size: 0;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
}
.selectList .listCont {
  width: 29.2%;
  margin-right: 3.1%;
  border-radius: 5px;
}
.aboutSelect .listCont:nth-child(n + 4) {

}
.selectList .listCont + .listCont {
  margin-left: 3.1%;
}
.selectList .listCont:nth-child(3n + 3){
  margin-right: 0;
}
.selectList .listCont:nth-child(3n + 4){
  margin-left: 0;
}
.selectList .listCont .image {
  height: 16.5vw;
  width: 100%;
  overflow: hidden;
  position: relative;
  display: inline-block;
  border-radius: 5px 5px 0 0;
}

.selectList .listCont .image .img {
  width: 100%;
  height: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition:all ease .5s;
}
.aboutSelect .selectList .listCont .image .img {
  transform:scale(1.2);
  transition:all 4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.selectList .listCont:hover .image .img {
  transform:scale(1.075);
  transition:all ease .5s;
}

.aboutSelect .selectList .listCont.fadeInUp.scale .image .img {
  transform:scale(1);
}
.aboutSelect .selectList .listCont.fadeInUp.scale:hover .image .img {
  transform:scale(1.075);
  transition:all ease .5s;
}
.selectList .listCont .image:after {
  content:"";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  transition: all ease .5s;
}
.selectList .cont .inner {
    width: 71%;
    margin: 45px auto 63px;
}
.selectList .listCont {
  margin-bottom: 90px;
  box-sizing: border-box;
  border: 1px solid hsla(10,12%,63%,0.1);
  box-shadow: 3px 3px 10px -3px rgba(0,0,0,0.1);
}
.selectList .number {
    font-size: 1.2rem;
    font-family: century-gothic, sans-serif;
    font-weight: 400;
    letter-spacing: 0.7px;
    margin-left: 3px;
    transition:all ease .25s;
    display: none;
}
.selectList .title {
    font-size: 2.25rem;
    letter-spacing: 0.05em;
    margin-top: 0px;
    transition:all ease .25s;
}
.selectList .subTitle {
    font-size: 1.2rem;
    font-family: century-gothic, sans-serif;
    font-weight: 400;
    letter-spacing: 0.075em;
    color: #b0e0e6;
    margin-top: 10px;
    margin-left: 1px;
}
.selectList .desc {
    font-size: 1.15rem;
    color: #565656;
    width: 100%;
    line-height: 2.6;
    letter-spacing: 0.4px;
    margin: 27px 0 0;
}

.selectList .listCont:hover .readMore::before  {
  transform-origin: right top;
  transform: scale(0, 1);
}
.selectList .listCont:hover .readMore::after {
  transform-origin: left top;
  transform: scale(1, 1);
}


.aboutSelect .listCont .image .beachImg {
  background-image: url(../img/list/enoshima_beach_ceremony.jpg);
}
.aboutSelect .listCont .image .hallImg {
  background-image: url(../img/list/enoshima_hall_ceremony.jpg);
}
.aboutSelect .listCont .image .seahouseImg {
  background-image: url(../img/list/enoshima_seahouse_ceremony.jpg);
}
.aboutSelect .listCont .image .shrinImg {
  background-image: url(../img/list/enoshima_shrin_ceremony.jpg);
}
.aboutSelect .listCont .image .boatImg {
  background-image: url(../img/list/enoshima_boat_ceremony.jpg);
}

.aboutSelect .listCont .image .yokohamahallImg {
  background-image: url(../img/list/yokohama_hall_ceremony.jpg);
}


.aboutSelect .listCont .image .osakamarinaImg {
  background-image: url(../img/list/osaka_marina_ceremony.jpg);
}

.aboutSelect .listCont .image .osakahallImg {
  background-image: url(../img/list/osaka_hall_ceremony.jpg);
}
.aboutSelect .listCont .image .osakacruisingImg {
  background-image: url(../img/list/osaka_cruising_ceremony.jpg);
}
.aboutSelect .listCont .image .osakaboatImg {
  background-image: url(../img/list/osaka_boat_ceremony.jpg);
}



/*
Circle
*/

.circleList {
  padding-top: 68px;
  font-size: 0;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
}
.circleList .listCont {
  width: 27.8%;
  padding-right: 4%;
  border-right: 1px solid #add8e6;
}
.circleList .listCont + .listCont {
  padding-left: 4%;
}
.circleList .listCont:nth-child(3n + 3){
  padding-right: 0;
  border: none;
}
.circleList .listCont:nth-child(3n + 4){
  padding-left: 0;
}
.circleList .listCont .image {
  height: 17.6vw;
  width: 17.6vw;
  border-radius: 100%;
  z-index: 1;
  overflow: hidden;
  position: relative;
  display: inline-block;
  box-shadow: 1.6px 1.4px 4px 0px rgba(162, 162, 162, 0.45);
}

.circleList .listCont .image .img {
  width: 100%;
  height: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  border-radius: 100%;
  transform:scale(1.2);
  transition:all 4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.circleList .listCont .image .img {
  transform:scale(1.2);
  transition:all 4s cubic-bezier(0.08, 0.92, 0.35, 1);
}

.circleList .listCont.fadeInUp .image .img {
  transform:scale(1);
}
.circleList .listCont.fadeInUp:hover .image .img {
  transform:scale(1.1);
  transition:all ease .5s;
}

.circleList .listCont:hover .image {
  border-radius: 100%;
  overflow:hidden;
}
.circleList .listCont:hover .image .img {
  border-radius: 100%;
}
.circleList .listCont .image:after {
  border-radius: 100%;
  display: none;
}
.circleList .listCont .image:hover:after {
  border-radius: 100%;
}
.circleList .cont .inner {
  width: 99%;
  margin: 58px auto 0;
}

.circleList .listCont {
    padding-bottom: 20px;
    padding-top: 20px;
    text-align: center;
}
.circleList .title {
  font-size: 2.7rem;
  letter-spacing: 0.05em;
  margin-top: 0px;
  transition:all ease .25s;
}
.circleList .subTitle {
  font-size: 1.25rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  letter-spacing: 0.9px;
  color: #b0e0e6;
  margin-top: 14px;
  margin-left: 1px;
}
.circleList .desc {
  font-size: 1.2rem;
  color: #6d6d6d;
  width: 65%;
  margin: 34px auto 0;
  line-height: 2.45;
  letter-spacing: 0.04em;
}

.circleList .readMore {
  margin-top: 49px;
  margin-left: 0px;
}
.circleList .listCont:hover .readMore::before  {
  transform-origin: right top;
  transform: scale(0, 1);
}
.circleList .listCont:hover .readMore::after {
  transform-origin: left top;
  transform: scale(1, 1);
}


.underSelect .listCont .image .mediaImg {
  background-image: url(../img/thumb/service/01_media.jpg);
}
.underSelect .listCont .image .productImg {
  background-image: url(../img/thumb/service/02_production.jpg);
}
.underSelect .listCont .image .worksImg {
  background-image: url(../img/thumb/service/03_works.jpg);
}

.underSelect .listCont .image .dressImg {
  background-image: url(/img/pickupimg/pickup_dress_icon.jpg);
}

.underSelect .listCont .image .flowerImg {
  background-image: url(/img/pickupimg/pickup_flower_icon.jpg);
}

.underSelect .listCont .image .pickupphotoImg {
  background-image: url(/img/pickupimg/pickup_photo_icon.jpg);
}



.underSelect .listCont .image .allImg {
  background-image: url(../img/thumb/about/plan_all.jpg);
}
.underSelect .listCont .image .seasideImg {
  background-image: url(../img/thumb/about/plan_seaside.jpg);;
}
.underSelect .listCont .image .ceremonyImg {
  background-image: url(../img/thumb/about/plan_ceremony.jpg);
}

.underSelect .listCont .image .secondImg {
  background-image: url(../img/thumb/about/plan_second.jpg);
}
.underSelect .listCont .image .photoImg {
  background-image: url(../img/thumb/about/plan_photo.jpg);;
}
.underSelect .listCont .image .afterImg {
  background-image: url(../img/thumb/about/plan_after.jpg);
}

.designFieldList .listCont .image .webImg {
  background-image: url(../img/thumb/design/field/01_web_btn.jpg);
}
.designFieldList .listCont .image .graphicImg {
  background-image: url(../img/thumb/design/field/02_graphic_btn.jpg) ;
}
.designFieldList .listCont .image .brandImg {
  background-image: url(../img/thumb/design/field/03_brand_btn.jpg);
}

.underSelect .listCont .image .reserveiconImg {
  background-image: url(/img/info/info_reserve_icon.jpg);
}

.underSelect .listCont .image .contacticonImg {
  background-image: url(/img/info/info_contact_icon.jpg);
}

.underSelect .listCont .image .flowiconImg {
  background-image: url(/img/info/info_flow_icon.jpg);
}

.underSelect .listCont .image .shonaniconImg {
  background-image: url(/img/place/place_shonan_icon.jpg);
}

.underSelect .listCont .image .yokohamaiconImg {
  background-image: url(/img/place/place_yokohama_icon.jpg);
}

.underSelect .listCont .image .osakaiconImg {
  background-image: url(/img/place/place_osaka_icon.jpg);
}


/*
Design Field
*/

.designFieldList .listCont {
  margin-bottom: initial;
  cursor: pointer;
  background: #fff;
}
.designFieldList .cont .inner {
  text-align: center;
  margin:42px auto 81px;
}
.designFieldList .number {
  font-size: 1.9rem;
  font-family: athelas, sans-serif;
  color:#bfb3a2;
  font-weight: 400;
  letter-spacing: 0.7px;
  transition: all ease .25s;
  display: block;
}
.designFieldList .title {
  font-family: garamond-premier-pro-display, serif;
  text-transform: uppercase;
  font-size: 4.3rem;
  font-weight: 400;
  line-height: 1.23;
  letter-spacing: 0.08em;
  margin-top: 14px;
  transition: all ease .25s;
}
.designFieldList .desc {
  width: 90%;
  text-align: justify;
  margin: 34px auto 0;
  display: none;
}
.designFieldList .readMore {
  margin-top: 38px;
}


/* Media */

/*
Common
*/

.underMedia {
  background-color: #f8f8f8;
  margin-top: 202px;
  padding-bottom: 165px;
  padding-top: 0px;
}


/*
Left
*/

.underMedia .cont .left {
   width: 50%;
}

.mediaSlider li {
  height: 48vw;
}
.mediaSlider li figure {
  height: 100%;
  width: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
}

.mediaSlider li.zero figure {
  background-image: url(../img/thumb/media/magazine01.jpg);
}
.mediaSlider li.one figure {
  background-image: url(../img/thumb/media/magazine.jpg);
}
.mediaSlider li.two figure {
  background-image: url(../img/thumb/media/magazine02.jpg);
}
.mediaSlider li.three figure {
  background-image: url(../img/thumb/media/magazine03.jpg);
}



/*
Right
*/

.underMedia .cont {
  width: 82.4%;
  margin: 80px auto 0;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.underMedia .cont .right {
  width: 50%;
  display: flex;
  align-items: center;
}
.underMedia .cont .right > .inner {
  width: 74%;
  margin-left: 21.5%;
}

.underMedia .cont .right .title {
  font-size: 3.8rem;
  letter-spacing: 0.05em;
  margin-top: 2px;
}
.underMedia .cont .right .title span {
  display: block;
  font-size: 1.55rem;
  font-family: adobe-garamond-pro, serif;
  letter-spacing: 0.05em;
  color: #bfb3a2;
  margin-top: 20px;
  margin-left: 5px;
}
.underMedia .cont .right .desc {
  font-size: 1.45rem;
  line-height: 2.9;
  letter-spacing: 0.06em;
  text-align: justify;
  margin-top: 50px;
  margin-left: 3px;
}
.underMedia .cont .right .readMore {
  font-size: 1.4rem;
  letter-spacing: 0.06em;
  margin-top: 61px;
}

.mediaSlider button.slick-arrow {
  top: -180px;
}
.mediaSlider button.slick-prev {
    right: -99%;
}
.mediaSlider button.slick-prev:hover {
    right: -99.5%;
}
.mediaSlider button.slick-next {
    right: -84.1%;
}
.mediaSlider button.slick-next:hover {
    right: -83.6%;
}


.visitMore {
  display: inline-block;
  height: 65px;
  line-height: 65px;
  width: 100%;
  background-color: #f0f0f0;
  text-align: center;
  border-radius: 36px;
  margin-top: 40px;
  text-transform: capitalize;
  transition: all ease .35s;
}
.visitMore a {
  font-size: 1.4rem;
  position: relative;
  display: inline-block;
  font-family: 'Avenir LT W01_45 Book1475508';
  letter-spacing: 0.01em;
  color:#3a3a3a;
  width: 100%;
  height: 100%;
}
.visitMore a span {
  position: relative;
  padding-left: 17px;
}
.visitMore a span:before {
  content: '';
  width: 4px;
  height: 4px;
  border: 0px;
  border-top: solid 1px #b6a389;
  border-right: solid 1px #b6a389;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 56%;
  left: 0;
  margin-top: -4px;
}
.visitMore a:hover span:before {
  animation: arrowD .4s;
}
@keyframes arrowD {
  50% {
    left:3px;
  }
  100% {
    left:0px;
  }
}


/*
---------------------------------------------------
  6. Journal
---------------------------------------------------
*/

/* contents */

.newsCont {
  margin-top: 214px;
}
.newsCont .underHead {
  width: 92%;
  border-bottom: 1px solid #eeeeee;
  padding-bottom: 43px;
  text-align: center;
}

.underNewsNav {
  display: inline-block;
  margin-left: 6px;
}

.underNewsNav ul li.sp {
  display: none;
}
.underNewsNav ul li.pc {
  display: block;
  position: relative;
}
.underNewsNav ul li.pc:hover:after,.underNewsNav ul li.pc li:hover:after {
  width: 0px;
  transition:all ease .35s;
}

.underNewsNav ul li {
  font-size: 1.5rem;
  font-family: 'Helvetica Neue LT W01_41488878';
  letter-spacing: 1.5px;
  line-height: 20px;
  text-transform: capitalize;
  position: relative;
  cursor: pointer;
}
.underNewsNav ul li:after {
  bottom:-44px;
}
.underNewsNav ul li + li:nth-child(3) {
    margin-left: 47px;
}
.underNewsNav ul li + li:nth-child(5) {
    margin-left: 56px;
}
.underNewsNav ul li + li:before {
   content:initial;
}
.underNewsNav ul li a {
  padding-top: 2px;
  display: inline-block;
}
 .underNewsNav .arrowInner {
  position: relative;
  width: 100%;
  display: inline-block;
}
.underNewsNav .arrowInner::after {
  content:"";
  position: absolute;
  top: 2px;
  right: -21px;
  width: 7px;
  height: 7px;
  border-top: 1px solid #cdb99c;
  border-right: 1px solid #cdb99c;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}
.underNewsNav select {
  position: relative;
  display: inline-block;
  text-align: center;
  background: transparent;
  border:none;
  -webkit-appearance: none;
  appearance: none;
  font-size: 1.5rem;
  letter-spacing: 0.9px;
  text-transform: capitalize;
  border-radius: initial;
  cursor: pointer;
}
.underNewsNav select option {
  font-family: 'Helvetica Neue LT W01_41488878';
}

.underNewsNav .btnParent {
  position: relative;
}
.underNewsNav .btnParent::after {
  content:"";
  position: absolute;
  top: 7px;
  right: -19px;
  width: 5px;
  height: 5px;
  border-top: 1px solid #cdb99c;
  border-right: 1px solid #cdb99c;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

.underNewsNav .btnChild {
  position: absolute;
  background: #fff;
  border:1px solid #eeeeee;
  padding:21px 32px 22px 32px;
  z-index: 1;
  left: 50%;
  transform:translateX(-50%);
  box-shadow: 1.6px 1.2px 4px 0px rgba(162, 162, 162, 0.1);
  visibility: hidden;
  opacity: 0;
  transition:all ease 0.3s;
  top: 20px;
}
.catBtn:hover .btnChild,.yearBtn:hover .btnChild {
  visibility: visible;
  opacity: 1;
  transition:all ease 0.3s;
  top: 25px;
}

.underNewsNav .btnChild a {
  color:#444;
  position: relative;
  padding-left: 0px;
  transition:all ease .4s;
}
.underNewsNav .btnChild a:before {
  position: absolute;
 /* content: "";*/
  top: 10px;
  left: -16px;
  width: 4px;
  height: 4px;
  border-top: 1px solid #cdb99c;
  border-right: 1px solid #cdb99c;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  z-index: 0;
}
.underNewsNav .btnChild a::after {
  position: absolute;
  bottom: 0px;
  left: 0px;
  content: '';
  width: 100%;
  height: 1px;
  background: #cdb99c;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.underNewsNav .btnChild a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}
.underNewsNav .btnChild ul {
  display: block;
}
.underNewsNav .btnChild ul li {
  font-size: 1.25rem;
  letter-spacing: 0.7px;
  text-align: left;
  text-transform: capitalize;
}
.underNewsNav .btnChild ul li + li  {
  margin-left: 0;
  margin-top: 5px;
}


.newsCont >  .inner {
  width: calc(100% - 9.6%);
  margin-left: auto;
  margin-right: auto;
  margin-top: 85px;
}


/* detail */

.singleNews {
  width: calc(100% - 5%);
  margin: 259px auto 0p;
}

.singleHead {
  width: 100%;
  margin-left: 8px;
  position: relative;
  text-align: center;
}
.singleHead .postTitle {
  font-size: 3.8rem;
  letter-spacing: 0.03em;
  line-height: 55px;
  font-weight: 500;
  width: 637px;
  text-align: center;
  margin:7px auto;
}
.singleHead .postDate {
  font-size: 1.3rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  position: relative;
  color: #b5b29b;
  letter-spacing: 0.9px;
  margin-left: -2px;
  margin-top: 13px;
  text-align: center;
  display: inline-block;
}
.singleHead .postDate:before {
  content:"";
  position: absolute;
  height: 0px;
  width: 100%;
  background-color: #ccc;
  bottom:-6px;
}


.singleCont {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  margin-top: 111px;
}

.singleCont .left {
  width: 56%;
  position: sticky;
  position: -webkit-sticky;
  bottom: 30px;
  align-self: flex-end;
}
.singleCont .left .images {

}
.singleCont .left .images .image + .image {
    margin-top: 7px;
}
.singleCont .left .images .image {
  overflow:hidden;
}
.singleCont .left img {
  width: 100%;
  height: auto;
  transform:scale(1.1);
  transition:all ease 2.5s;
}
.singleCont .left .image.fadeInUp img {
  transform:scale(1);
  transition-delay: 1.75s;
}

.singleCont .right {
  width: 32%;
  margin-left: 5.2%;
  bottom: 30px;
  /*align-self: flex-end;*/
  position: sticky;
  position: -webkit-sticky;
}
.singleCont .right .article {
  font-size: 1.55rem;
  font-family: adobe-garamond-pro,a-otf-ryumin-pr6n,serif;
  letter-spacing: 0.04em;
  line-height: 2.65;
  margin-top: -8px;
}
.singleCont .right .article a {
  color: #9e8f78;
  font-weight: bold;
  background: linear-gradient(transparent 96%, #9e8f78 0%);
}
.singleCont .cat {
  font-size: 1.35rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  letter-spacing: 0.5px;
  margin-top: 50px;
  margin-bottom: 60px;
  display: inline-block;
  position: relative;
}
.singleCont .cat a {
  color: #383533;
  position: relative;
}
.singleCont .cat a:before {
  content:"";
  position: absolute;
  bottom:-6px;
  width: 100%;
  height: 1px;
  background-color: #dbcca8;
  transform: scale(1, 1);
  transform-origin: left top;
  transition: transform .3s;
}
.singleCont .cat a:hover::before {
  transform-origin: right top;
  transform: scale(0, 1);
}
.singleCont .cat a:after {
  content:"";
  position: absolute;
  bottom:-6px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #dbcca8;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform .3s;
  transition-delay: 0.3s;
}
.singleCont .cat a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}



/* postNav */

.postNav {
  position: fixed;
  top: 55.5%;
  right: 0;
  transform: translateY(-50%);
  z-index: 1;
  transition: all .4s ease;
}
.postNav {
  right: -55px;
}
.postNav.slideIn {
  right: 0;
}
.postNav.active {
  top: 50%;
}

.postBtn {
  font-size: 2.6rem;
  color:#fff;
  text-align: center;
  height: 72px;
  width: 72px;
  line-height: 67px;
  transition:all ease .3s;
  position: relative;
  background-color: #d4d4d4;
}
.postBtn a {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background-color: #b5b5b5;
}
.postBtn.shareBtn {
  background-color: #b5b5b5;
}
.postBtn.next:before {
  position: absolute;
  content: "";
  top: 43%;
  left: 39%;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  z-index: 0;
}
.postBtn.prev:before {
  position: absolute;
  content: "";
  top: 43%;
  left: 46%;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
  z-index: 0;
}
.postBtn.next a:before {
  position: absolute;
  content: "";
  top: 43%;
  left: 39%;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  z-index: 1;
}
.postBtn.prev a:before {
  position: absolute;
  content: "";
  top: 43%;
  left: 46%;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
  z-index: 1;
}
.postBtn.shareBtn:before {
  content:"";
  position: absolute;
  width: 14px;
  height: 2px;
  background-color: #fff;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  transition: all ease .15s;
}
.postBtn.shareBtn:hover:before {
  transform:translate(-50%,-50%) rotate(45deg);
  transition: all ease .15s;
}

.postBtn.shareBtn:after {
  content:"";
  position: absolute;
  width: 14px;
  height: 2px;
  background-color: #fff;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%) rotate(-90deg);
  transition: all ease .15s;
}
.postBtn.shareBtn:hover:after {
  transform: translate(-50%,-50%) rotate(-45deg);
  transition: all ease .15s;
}


.postBtn a {
  width: 100%;
  height: 100%;
  display: inline-block;
  color:#fff;
}
.postBtn + .postBtn {
  margin-top: 2px;
}

.postBtn a:hover {
  background-color: #888;
  transition:all ease .3s;
}
.postBtn.shareBtn:hover {
  background-color: #888;
  transition:all ease .3s;
}
.shareBtn.active {
  background-color: #888;
  transition:all ease .3s;
}
.postBtn.share {
  position: absolute;
}
.postBtn.facebook {
  bottom: -67px;
  font-size: 2rem;
  visibility: hidden;
  opacity: 0;
  transition:all ease .3s;
}
.postBtn.twitter {
  bottom: -134px;
  font-size: 2rem;
  visibility: hidden;
  opacity: 0;
  transition:all ease .3s;
}

.postBtn.facebook.active {
  visibility: visible;
  opacity: 1;
  transition:all ease .3s;
  transition-delay:.15s;
}
.postBtn.twitter.active {
  visibility: visible;
  opacity: 1;
  transition:all ease .3s;
  transition-delay:.15s;
}


/* prevNext */

section.prevNext {
    width: calc(100% - 10.2%);
    margin: 115px auto 120px;
}
.prevNext .inner {
    display: flex;
    border-top: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
    padding-top: 80px;
    padding-bottom: 80px;
}
.prevNext .navPost {
  font-size: 1.9rem;
  width: calc(50% - 45px);
  position: relative;
}
.prevNext .navPost a:before {
  position: absolute;
  content: "";
  top: 53%;
  width: 6px;
  height: 6px;
  border-top: 1px solid #cdb99c;
  border-right: 1px solid #cdb99c;
  z-index: 0;
}
.prevNext .navPost.nextPost {
  padding-left: 32px;
  margin-left: 30px;
}
.prevNext .nextPost a:before {
  left: -32px;
   -webkit-transform: translateY(-41%) rotate(-135deg);
  transform: translateY(-41%) rotate(-135deg);
}
.prevNext .navPost.prevPost {
  text-align: right;
  padding-right: 32px;
  margin-right: 30px;
}
.prevNext .prevPost a:before {
  right: -32px;
   -webkit-transform: translateY(-41%) rotate(45deg);
  transform: translateY(-41%) rotate(45deg);
}

.prevNext .navPost a {
  display: inline-block;
  position: relative;
}
.prevNext .navPost a::after {
  position: absolute;
  bottom: -6px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #cdb99c;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.prevNext .navPost a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}


.prevNext .toIndex {
  width: 30px;
  height: 27px;
  transition: all ease .35s;
}
.prevNext .toIndex:hover {
  opacity: 0.6;
  transition: all ease .35s;
}
.prevNext .toIndex a {
  width: 100%;
  height: 100%;
}
.prevNext .toIndex ul {
  width: 100%;
  height: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
}
.prevNext .toIndex ul li {
  width: calc(33.333% - 2px);
  height: calc(33.333% - 2px);
  background-color: #000;
}
.prevNext .toIndex ul li + li {
  margin-left: 3px;
}
.prevNext .toIndex ul li:nth-child(3n + 4) {
  margin-left: 0;
}
.prevNext .toIndex ul li:nth-child(n + 4) {
  margin-top: 3px;
}

/*
---------------------------------------------------
  7. Design
---------------------------------------------------
*/

/* DesignField */

.designFieldCont .underDesc .left .image {
  background-image: url(../img/thumb/design/02_fieldMain.jpg);
}

/*
common
*/

body.fixed {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
}

.designBg {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0;
  background-color: rgba(0,0,0,0);
  visibility: hidden;
  transition: all ease .5s;
}
.designBg.bgOne {
  z-index: 5;
}
.designBg.bgTwo {
  z-index: 7;
}
.designBg.active {
  background-color: rgba(0,0,0,0.2);
  visibility: visible;
}

section.fieldSect {
  position: fixed;
  width: 100%;
  overflow-y: scroll;
  overflow-x: hidden;
  height: 0%;
  background-color: #fff;
  bottom: 0;
  -webkit-transition: .8s cubic-bezier(.6,0,.25,1);
  transition: .8s cubic-bezier(.6,0,.25,1);
}
section.fieldSect.z1 {
   z-index: 6;
}
section.fieldSect.active {
  height: 100%;
}
section.fieldSect.z2 {
  z-index: 8;
}
section.fieldSect.active2 {
  height: 100%;
}
section.fieldSect.zIndex {
  z-index: 6;
}

section.fieldSect > .inner {
  opacity: 0;
  transition: all ease 1s;
  transition-delay: 0s;
}
section.fieldSect.active > .inner,
section.fieldSect.active2 > .inner {
  opacity: 1;
  transition: all ease 0.5s;
  transition-delay: 0.8s;
}
section.fieldSect.active.opacity > .inner {
  opacity: 0;
  transition: all ease 0.5s;
  transition-delay: 0s;
}

.fixedClose {
  height: 28px;
  width: 28px;
  position: fixed;
  top: 36px;
  right: 36px;
  cursor: pointer;
}
.fixedClose span {
  position: absolute;
  display: block;
  height: 1px;
  width: 100%;
  background-color: #000;
  top:50%;
}
.fixedClose span:nth-child(1) {
  transform: translateY(-50%) rotate(45deg);
}
.fixedClose span:nth-child(2) {
  transform: translateY(-50%) rotate(-45deg);
}


/*
Mv
*/

.fieldMv > .inner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  width:calc(100% - 30px);
  margin:15px auto 0;
}

.fieldMv .left {
  width: 50%;
}

.fieldMv .cont {
  text-align: center;
  height: 100vh;
  position: relative;
}
.fieldMv .cont .title {
  font-family: garamond-premier-pro-display, serif;
  font-weight: 400;
  text-transform: uppercase;
  font-size: 6.8rem;
  line-height: 1.25;
  letter-spacing: 0.12em;
  position: absolute;
  left: 50%;
  top: 52%;
  transform: translate(-50%,-50%);
  opacity: 0;
  transition: 0.75s cubic-bezier(.6,0,.25,1);
  transition-delay: 0s;
}
.active .fieldMv .cont .title,
.active2 .fieldMv .cont .title {
  opacity: 1;
  top: 50%;
  transition-delay: 1.5s;
}

.fieldMv .cont .title span {
  font-size: 1.4rem;
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  display: block;
  letter-spacing: 0.075em;
  color: #b0e0e6;
  margin-top: 18px;
  text-transform: capitalize;
}

.fieldNav {
  position: absolute;
  bottom: 36px;
  left: 50%;
  transform: translateX(-50%);
  display: none;
}
.fieldNav ul {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.fieldNav ul li {
  font-size: 1.7rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 0.02em;
  padding: 0 30px;
  position: relative;
}


.fieldMv .right {
  width: 50%;
  height: calc(100vh - 30px);
  background-color: #fafafa;
  position: sticky;
  top: 15px;
}
.fieldMv .right .sectImg {
  height: 100%;
  width: 100%;
  overflow: hidden;
}
.fieldMv .right .sectImg figure {
  height: 100%;
  width: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transform: scale(1.1);
  transition: 1.25s cubic-bezier(.6,0,.25,1);
  transition-delay: 0.75s;
}
.active .fieldMv .right .sectImg figure,
.active2 .fieldMv .right .sectImg figure {
    transform: scale(1);
}

.webSect .fieldMv .right .sectImg figure {
  background-image: url(../img/thumb/design/field/01_web_btn.jpg);
}
.graphicSect .fieldMv .right .sectImg figure {
  background-image: url(../img/thumb/design/field/02_graphic_btn.jpg);
}
.brandSect .fieldMv .right .sectImg figure {
  background-image: url(../img/thumb/design/field/03_brand_btn.jpg);
}


/*
FieldCont
*/

.fieldMv + .fieldCont {
  margin-top: 135px;
}
.fieldCont {
  opacity: 0;
  transition:all ease 1s;
}
.fieldCont.fadeIn {
  opacity: 1;
}

.fieldCont > .inner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  width:calc(100% - 30px);
  margin:15px auto 0;
}
.fieldCont .left {
  width: 50%;
  height: calc(100vh - 30px);
  background-color: #fafafa;
  position: sticky;
  top: 15px;
}
.fieldCont .left .sectImg {
  width: 100%;
  height: 100%;
}
.fieldCont .left .sectImg figure {
  width: 100%;
  height: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
}

.webSect .fieldCont .left .sectImg figure {
  background-image: url(../img/thumb/design/field/01_web_cont.jpg);
}
.graphicSect .fieldCont .left .sectImg figure {
  background-image: url(../img/thumb/design/field/02_graphic_cont.jpg);
}
.brandSect .fieldCont .left .sectImg figure {
  background-image: url(../img/thumb/design/field/03_brand_cont.jpg);
}



.fieldCont .right {
  width: 50%;
  text-align: left;
}
.fieldDesc {
  width: 60%;
  margin:100px auto 0;
}
.fieldDesc .lead {
  font-size: 3.6rem;
  letter-spacing: 0.06em;
  line-height: 1.7;
  font-weight: 500;
}
.fieldDesc .lead span {
  font-size: 1.5rem;
  font-family: adobe-garamond-pro, serif;
  color: #b3a587;
  letter-spacing: 0.07em;
  display: block;
  line-height: 2.15;
  margin-top: 13px;
  margin-left: 1px;
}
.fieldDesc .desc {
  font-size: 1.5rem;
  line-height: 3.15;
  letter-spacing: 0.04em;
  margin-top: 57px;
  margin-bottom: 120px;
  text-align: justify;
}


/*
workField
*/

.workField {
  margin-top: 150px;
  height: 750px;
  background-color: #add8e6;
  padding-bottom: 245px;
  opacity: 0;
  transition:all ease 1s;
}
.workField.fadeIn {
  opacity: 1;
}


.sectTitle {
  font-family: garamond-premier-pro-display, serif;
  font-weight: 400;
  text-transform: uppercase;
  font-size: 6.9rem;
  width: 82%;
  margin:0 auto;
  padding-top: 120px;
  letter-spacing: 0.04em;
}
.sectTitle span {
  font-size: 1.35rem;
  font-family: a-otf-ryumin-pr6n, serif;
  color: #fff;
  letter-spacing: 0.12em;
  display: block;
  margin-top: 6px;
  margin-left: 1px;
}

.fieldSlider {
  width: 81.7%;
  margin: 90px auto 0;
}
.fieldSlider .slick-slide {
  width: 33%;
}

.fieldSlider button.slick-arrow {
  top: -188px;
}
.fieldSlider button.slick-prev {
  right: 0px;
}
.fieldSlider button.slick-prev:hover {
  right: -3px;
}
.fieldSlider button.slick-next {
  right: 85px;
}
.fieldSlider button.slick-next:hover {
  right: 88px;
}


.fieldSlider .slick-slide {
  outline: none;
}
.fieldSlider li  {
  border-right: 1px solid #20b2aa;
  outline: none;
}
.fieldSlider li .cont {
  width: 61%;
  margin: 15px auto 40px;
}
.fieldSlider li .cont .num {
  font-size: 1.9rem;
  font-family: athelas, sans-serif;
  color: #fff;
  margin-left: 4px;
  font-weight: 400;
  letter-spacing: 0.5px;
}
.fieldSlider li .cont .title {
  margin-top: 13px;
  font-family: garamond-premier-pro-display, a-otf-ryumin-pr6n, serif;
  font-size: 2.85rem;
  line-height: 1.4;
  letter-spacing: 0.08em;
}
.fieldSlider li .cont .title span {
  display: block;
  font-size: 1.45rem;
  font-family: adobe-garamond-pro, sans-serif;
  font-weight: 400;
  letter-spacing: 0.055em;
  color: #fff;
  margin-left: 2px;
  margin-top: 5px;
}
.fieldSlider li .cont .desc {
  margin-top: 27px;
  line-height: 2.55;
  letter-spacing: 0.05em;
  text-align: justify;
}


/*
caseStudy
*/

.caseStudy {
  opacity: 0;
  transition:all ease 1s;
}
.caseStudy.fadeIn {
  opacity: 1;
}

.graphicSect .caseStudy,
.brandSect .caseStudy {
  display: none;
}


.caseList {
  width: 82%;
  margin: 90px auto 85px;
}

.caseList li {
  margin-top: 80px;
  padding-top: 80px;
  border-top: 1px solid #ededed;
  opacity: 0;
  transition:all ease 1s;
}
.caseList li:nth-child(1) {
  border-top: initial;
  padding-top: 0;
  margin-top: 0;
}
.caseList li.fadeIn {
  opacity: 1;
}


.caseList li > .inner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}

.caseList li .left {
  width: 50%;
}
.caseList li .left .image {
  height: 32.5vw;
  background-color: #fafafa;
  transition:all ease .5s;
  overflow: hidden;
}
.caseList li .left .image:hover,
.caseList li .left .image.active {
  transform:scale(.95);
}

.caseList li .left .image figure {
  height: 100%;
  width: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition:all ease .5s;
}
.caseList li .left .image:hover figure,
.caseList li .left .image.active figure {
  transform:scale(1.15);
}

.caseList li .right {
  width: 50%;
  display: flex;
  align-items: center;
}
.caseList li .right .cont {
  width: 50%;
  margin:0 auto;
}
.caseList li .right .title span.main {
  font-size: 5.6rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 400;
  white-space: nowrap;
  display: block;
}
.caseList li .right .title span.sub {
  font-size: 1.4rem;
  font-family: 'Helvetica Neue LT W01_41488878';
  letter-spacing: 0.05em;
  font-weight: 300;
  display: inline-block;
  margin-left: 2px;
  margin-top: 31px;
  padding-left: 50px;
  position: relative;
  opacity: 0.4;
}
.caseList li .right .title span.sub:before {
  content: "";
  position: absolute;
  height: 1px;
  width: 55px;
  background-color: #cdb99c;
  transform: rotate(-48deg);
  display: block;
  left: -11px;
  top: 2px;
}

.showBtn {
  font-size: 1.55rem;
  font-family: century-gothic, sans-serif;
  letter-spacing: 0.03em;
  width: 88%;
  height: 76px;
  line-height: 80px;
  margin: 0 auto;
  background-color: #f4f4f4;
  transition:all ease .5s;
  text-align: center;
  border-radius: 41px;
}
.showBtn:hover {
  background-color: #f0f0f0;
  transition:all ease .5s;
}
.showBtn a {
  display: inline-block;
  width: 100%;
  height: 100%;
}
.showBtn span {
  position: relative;
  padding-left: 19px;
}
.showBtn span:before {
  content: '';
  width: 5px;
  height: 5px;
  border: 0px;
  border-top: solid 1px #b6a389;
  border-right: solid 1px #b6a389;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 56%;
  left: 0;
  margin-top: -4px;
}
.showBtn:hover span:before {
  animation: arrow .4s;
}
@keyframes arrow {
  50% {
    left:3px;
  }
  100% {
    left:0px;
  }
}


/*
fieldNext
*/

.fieldNext {
  margin: 130px auto 0;
  width: calc(100% - 30px);
  height: 46vw;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  cursor: pointer;
  opacity: 0;
  transition:all ease 1s;
  position: relative;
  overflow: hidden;
}
.fieldNext:before {
  content:"";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.15);
  z-index: 1
}
.fieldNext.fadeIn {
  opacity: 1
}

.fieldNext figure {
  position: absolute;
  width: 100%;
  height: 100%;;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition:all ease .5s;
}
.fieldNext:hover figure {
  transform: scale(1.025);
}

.fieldNext.graphic figure {
  background-image: url(../img/thumb/design/field/02_graphic_btn.jpg);
}
.fieldNext.brand figure {
  background-image: url(../img/thumb/design/field/03_brand_btn.jpg);
}
.fieldNext.web figure {
  background-image: url(../img/thumb/design/field/01_web_next.jpg);
}


.fieldNext > .inner {
  width: 78%;
  margin:0 auto;
  color:#fff;
  position: relative;
  z-index: 1;
}
.fieldNext .num {
  font-size: 2.3rem;
  font-family: athelas, sans-serif;
  letter-spacing: 0.05em;
  margin-left: 4px;
}
.fieldNext .title {
  font-family: garamond-premier-pro-display, serif;
  font-size: 6.2rem;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
  margin-top: 26px;
}
.fieldNext .title span {
  display: block;
  text-transform: initial;
  font-size: 1.3rem;
  font-family: century-gothic, sans-serif;
  letter-spacing: 0.065em;
  opacity: 0.6;
  margin-top: 17px;
}
.fieldNext .readMore {
  font-size: 1.1rem;
  margin-top: 67px;
  color:#fff;
}


/*
sectClose
*/

.sectClose {
  text-align: center;
  padding: 52px 0 45px;
  font-size: 1.4rem;
  font-family: century-gothic, sans-serif;
  letter-spacing: 0.025em;
  cursor: pointer;
}
.sectClose span {
  position: relative;
  display: inline-block;
  padding-left: 22px;
}
.sectClose span:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 1px #b6a389;
  border-right: solid 1px #b6a389;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 55%;
  left: 0;
  margin-top: -4px;
}
.sectClose:hover span:before {
  animation: arrowI .4s;
}
@keyframes arrowI {
  50% {
    left:3px;
  }
  100% {
    left:0px;
  }
}


/* workList */

.workList {
  width: calc(100% - 8.5%);
  margin-left: auto;
  margin-right: auto;
}

.workList li {
}
.workList li > .inner {
  width: 96%;
  margin:0 auto;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  flex-flow: row-reverse;
}
.workList li + li {
  border-top: 1px solid #b0e0e6;
  margin-top: 6vw;
  padding-top: 6vw;
}
.workList li .postCont {
  width: 39.5%;
  margin-left: 10.5%;
}
.workList li .postCont .title {
  font-size: 5.5rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 2px;
  line-height: 1.15;
  font-weight: 400;
  text-transform: uppercase;
}
.workList li .postCont .subTitle {
  font-size: 1.3rem;
  letter-spacing: 0.05em;
  display: none;
  color: #787878;
  margin-top: 4px;
}
.workList li .postCont .desc {
  font-size: 1.3rem;
  line-height: 2.5;
  letter-spacing: 0.06em;
  opacity: 0.7;
  width: 74%;
  text-align: justify;
  margin-top: 20px;
}
.workList li .postCont .detailBtn {
  width: 75%;
  margin-left: -2.1%;
  margin-top: 40px;
}
.workList li .detailBtn.tablet {
  display: none;
}

.workList li .postCont .date {
  font-size: 1.45rem;
  font-family: 'Helvetica Neue LT W01_41488878';
  font-weight: 300;
  font-color: #b0e0e6;
  letter-spacing: 0.06em;
  position: relative;
  padding-left: 49px;
  margin-top: 30px;
  opacity: 0.5;
}
.workList li .postCont .date:before {
  content: "";
  position: absolute;
  width: 40px;
  height: 1px;
  background-color: #b0e0e6;
  transform: rotate(-57deg);
  left: -6px;
  top: 4px;
}
.workList li .postCont .cat {
  font-size: 1.45rem;
  letter-spacing: 0.3px;
  font-family:'Avenir LT W01_45 Book1475508';
  margin-top: 28px;
  display: none;
}
.workList li .postCont .cat a {
  color: #a7a7a7;
}
.workList li .postCont .cat a + a:before {
  content:",";
  margin-right: 3px;
}

.workList li .postImg {
  width: 50%;
  height: 31vw;
  position: relative;
  overflow:hidden;
}

.workList li .postImg .img {
  display: inline-block;
  width: 100%;
  height: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all 1s cubic-bezier(.26,0,.07,1);
}
.workList li .postImg .img.otherWorks {
  background-image: url(../img/thumb/design/02_fieldMain.jpg);
}

.workList li .postImg:hover .img {
  transform: scale(1.1);
  transition: all 1s cubic-bezier(.26,0,.07,1);
}
.workList li .postImg a {
  width: 100%;
  height: 100%;
}
.workList li .postImg a:hover {
  transform: scale(1);
  transition: all 1s cubic-bezier(.26,0,.07,1);
}
.workList li .postImg a:after {
  content:"";
  position: absolute;
  box-sizing: border-box;
  width: 100%;
  right: 0;
  top: 0;
  height: 100%;
  border:0px solid #fff;
  transition: all 1s cubic-bezier(.26,0,.07,1);
}
.workList li .postImg a:hover:after {
  border:20px solid #fff;
  transition: all 1s cubic-bezier(.26,0,.07,1);
}


.workList li .postImg:before {
  content:"";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 100%;
  background-color: #fff;
  transition: all 1s cubic-bezier(.86,0,.07,1);
}
.workList li:nth-child(1) .postImg.slideLeft:before {
  width: 0%;
  transition-delay:1.9s;
}
.workList li .postImg.slideLeft:before {
  width: 0%
}


/* Design Guide */

/*
mv
*/

.guideCont .underDesc .left .image {
  background-image: url(../img/plan/allday_plan_top.jpg);
}

.beachCont .underDesc .left .image {
  background-image: url(../img/place/beach_place_top.jpg);
}

.enoshimahallCont .underDesc .left .image {
  background-image: url(../img/place/enoshimahall_place_top.jpg);
}

.enoshimaseahouseCont .underDesc .left .image {
  background-image: url(../img/place/enoshimaseahouse_place_top.jpg);
}

.enoshimashrineCont .underDesc .left .image {
  background-image: url(../img/place/enoshimashrine_place_top.jpg);
}

.enoshimaboatCont .underDesc .left .image {
  background-image: url(../img/place/enoshimaboat_place_top.jpg);
}

.seasideCont .underDesc .left .image {
  background-image: url(../img/plan/seaside_plan_top.jpg);
}

.ceremonyCont .underDesc .left .image {
  background-image: url(../img/plan/ceremony_plan_top.jpg);
}

.secondCont .underDesc .left .image {
  background-image: url(../img/plan/second_plan_top.jpg);
}

.photoweddingCont .underDesc .left .image {
  background-image: url(../img/plan/photowedding_plan_top.jpg);
}

.afterCont .underDesc .left .image {
  background-image: url(../img/plan/after_plan_top.jpg);
}

.dressCont .underDesc .left .image {
  background-image: url(/img/pickupimg/pickup_dress_top.jpg);
}

.flowerCont .underDesc .left .image {
  background-image: url(/img/pickupimg/pickup_flower_top.jpg);
}

.photoCont .underDesc .left .image {
  background-image: url(/img/pickupimg/pickup_photo_top.jpg);
}

.flowCont .underDesc .left .image {
  background-image: url(/img/info/flow_main_top.jpg);
}

.shonanCont .underDesc .left .image {
  background-image: url(../img/place/enoshima_top_main.jpg);
}

.yokohamaCont .underDesc .left .image {
  background-image: url(../img/place/yokohama_top_main.jpg);
}

.osakaCont .underDesc .left .image {
  background-image: url(../img/place/osaka_top_main.jpg);
}

.chottoyachtenoshimaCont .underDesc .left .image {
  background-image: url(../img/place/chottoyachtenoshima_place_top.jpg);
}

.riversideCont .underDesc .left .image {
  background-image: url(../img/place/riverside_place_top.jpg);
}

.hanareCont .underDesc .left .image {
  background-image: url(../img/place/hanare_place_top.jpg);
}

.beachhouseCont .underDesc .left .image {
  background-image: url(../img/place/beachhouse_place_top.jpg);
}

.osakamarinaCont .underDesc .left .image {
  background-image: url(../img/place/osakamarina_place_top.jpg);
}

.osakahallCont .underDesc .left .image {
  background-image: url(../img/place/osakahall_place_top.jpg);
}

.osakacruisingCont .underDesc .left .image {
  background-image: url(../img/place/osakacruising_place_top.jpg);
}

.osakaboatCont .underDesc .left .image {
  background-image: url(../img/place/osakaboat_place_top.jpg);
}

.osakahemingwayCont .underDesc .left .image {
  background-image: url(../img/place/osakahemingway_place_top.jpg);
}

.yokohamaceremonyCont .underDesc .left .image {
  background-image: url(../img/place/yokohamaceremony_place_top.jpg);
}

.yokohamaboatparkCont .underDesc .left .image {
  background-image: url(../img/place/yokohamaboatpark_place_top.jpg);
}

.yokohamatrbuildingCont .underDesc .left .image {
  background-image: url(../img/place/yokohamatrbuilding_place_top.jpg);
}

.steakCont .underDesc .left .image {
  background-image: url(../img/bbq/steak.jpg)!important;
}

.oystersteakCont .underDesc .left .image {
  background-image: url(../img/bbq/oystersteak.jpg)!important;
}

.seafoodsteakCont .underDesc .left .image {
  background-image: url(../img/bbq/seafoodsteak.jpg)!important;
}

.seafoodCont .underDesc .left .image {
  background-image: url(../img/bbq/seafood.jpg)!important;
}

.oysterCont .underDesc .left .image {
  background-image: url(../img/bbq/oyster.jpg) !important;
}

.webSect .fieldMv .right .sectImg figure {
  background-image: url(../img/bbq/bbq_top.jpg);
}

/*
priceList
*/

.priceList {
  margin-bottom: 240px;
}
.priceCont {
    width: 82%;
    margin: 100px 40% 0;
}
.priceCont dl {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.priceCont dl + dl {
  margin-top: 90px;
}
.priceCont dt {
  width: 43%;
  font-size: 1.75rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.priceCont dt span {
  display: inline-block;
  position: relative;
}
.priceCont dt span:before {
  content:"";
  position: absolute;
  height: 1px;
  width: 103%;
  background-color: #f4e8d8;
  left: -1.5%;
  bottom:-5px;
}

.priceCont dd {
  width: 57%;
  margin-top: -7px;
}
.priceCont dd li {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  position: relative;
}
.priceCont dd li:before {
  content:"";
  display: block;
  position: absolute;
  width: 100%;
  border-top: 1px dotted #add8e6;
  top: 58%;
  transform: translateY(-50%);
}
.priceCont dd li + li {
  margin-top: 25px;
}

.priceCont dd li .nmae {
  font-size: 1.65rem;
  background-color: #fff;
  position: relative;
  padding-right: 14px;
}
.priceCont dd li .price {
  margin-left: auto;
  font-size: 1.5rem;
  font-family: cormorant-garamond, serif;;
  letter-spacing: 0.02em;
  padding-left: 17px;
  background-color: #fff;
  position: relative;
}
.priceCont dd li .price span {
  font-size: 2rem;
  margin-left: 7px;
}
.priceCont dd li .price span:after {
  content:"~";
  font-size: 2.3rem;
  margin-left: 4px;
}



/* works - single */

/*
common
*/

.singleWorks {
  margin-bottom: 92px;
}

header.worksHead {
  background-color: transparent;
  color:#fff;
  transition-delay: 0.2s;
}
header.worksHead.humbActive {
  transition-delay:0s;
}
header.worksHead .inner {
  transition:initial;
}
header.worksHead a {
  color:#fff;
  transition: all ease .3s;
  transition-delay: 0.2s;
}

header.worksHead .title a {
  transition: all .3s ease;
}
header.worksHead.active .title a {
  top: 52.8%;
  transition: all .3s ease;
}

header.worksHead .humb span {
  background-color: #fff;
  transition: all ease .3s;
}
header.worksHead .mainNav ul li {
  transition: all ease .3s;
  color:#fff;
}

header.worksHead.workActive {
  background-color: #fff;
  color:#000;
  transition: all ease .3s;
}
header.worksHead.workActive .mainNav ul li {
  transition: all ease .3s;
  color:#000;
}
header.worksHead.workActive a {
  color:#000;
  transition: all ease .3s;
}
header.worksHead.workActive .humb span {
  background-color: #000;
  transition: all ease .3s;
}


header.white.worksHead,header.white2.worksHead {
  background-color: #fff;
  color:#000;
}
header.white,header.white2 {
  transition-delay: 0s;
}
header.white.worksHead .inner,header.white2.worksHead .inner {
  transition:initial;
}
header.white.worksHead a,header.white2.worksHead a {
  color:#000;
  transition: all ease .3s;
  transition-delay: 0s;
}

header.white.worksHead .title a,header.white2.worksHead .title a {

}
header.white.worksHead.active .title a,header.white2.worksHead.active .title a {

}

header.white.worksHead .humb span,header.white2.worksHead .humb span {
  background-color: #000;
  transition: all ease .3s;
}
header.white.worksHead .mainNav ul li,header.white2.worksHead .mainNav ul li {
  transition: all ease .3s;
  color:#000;
}

header.worksHead .mainNav ul li:before {
  background-color: #fff;
}
header.worksHead.white .mainNav ul li:before,
header.worksHead.white2 .mainNav ul li:before,
header.worksHead.workActive .mainNav ul li:before {
  background-color: #000;
}
header.worksHead .mainNav ul li.addCurrent:before {
    width: 100%;
}
header.worksHead .mainNav ul li.journalBtn:hover:before {
  width: 100%;
}
header.worksHead .mainNav ul li.addCurrent:before {
  width: 100%;
}
header.worksHead .mainNav ul li.addCurrent.closeline:before {
  width: 0%;
}
header.worksHead .mainNav ul li.underline:before {
  width: 100%;
}


/*
MV
*/

.worksMv {
  height: 100vh;
  overflow: hidden;
}
.worksMv .bg {
  height: 100%;
  width: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  position: relative;
  transform: scale(1.2);
  transition: all 3.1s cubic-bezier(0.66,0,.07,1);
}
.worksMv .bg.active {
  background-attachment: fixed;
  transform: scale(1.0);
  transition: all 3.1s cubic-bezier(0.66,0,.07,1);
}

.worksMv .bg:before {
  content:"";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.2);
}
.worksMv .mvCont {
  position: absolute;
  top: 55.4%;
  left: 50%;
  transform: translate(-50%,-50%);
  z-index: 1;
  color:#fff;
  text-align: center;
  transition: all ease 0.4s;
}
.worksMv .mvCont.fadeOut {
  top: 50%;
  opacity: 0;
  transition: all ease 0.4s;
}

.mvCont .title {
  font-size: 6.1rem;
  font-family: garamond-premier-pro-display, serif;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 4.4px;
  height: 58px;
  overflow-y: hidden;
  transition: all 1s cubic-bezier(.16,0,.07,1);
}
.mvCont .title span {
  display: inline-block;
  margin-top: 50px;
  transition: all 1s cubic-bezier(.16,0,.07,1);
}
.mvCont .title.active span {
  margin-top: 0px;
  transition: all 1s cubic-bezier(.16,0,.07,1);
}

.mvCont .cat {
  font-size: 1.5rem;
  letter-spacing:0.04em;
  opacity: 0.8;
  font-family: "Avenir LT W01_45 Book1475508";
  margin-top: 28px;
  height: 20px;
  position: relative;
  white-space: nowrap;
  overflow: hidden;
  transition: all 1s cubic-bezier(0.16, 0, 0.07, 1) 0s;
}
.mvCont .cat .inner  {
  position: absolute;
  left: 50%;
  transform:translateX(-50%);
  top: 20px;
  transition: all 1s cubic-bezier(.16,0,.07,1);
}
.mvCont .cat.active .inner {
  top: 0px;
  transition: all 1s cubic-bezier(.16,0,.07,1);
}

.mvCont .cat span + span:before {
  content:",";
  margin-right: 5px;
}


/*
workIntro
*/

.workIntro {
  background-color: #161616;
  color:#fff;
}
.workIntro a {
  color:#fff;
}
.workIntro .inner {
  width: 75%;
  margin:0 auto;
  padding-top: 140px;
  padding-bottom: 200px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.workIntro .left {
  width: 50%;
  margin-top: 12px;
}
.workIntro .left .title {
  font-size: 5.5rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 1.1px;
  font-weight: 500;
}
.workIntro .left .date {
  font-size: 1.5rem;
  font-family: 'Helvetica Neue LT W01_41488878';
  letter-spacing: 0.08em;
  position: relative;
  padding-left: 46px;
  margin-top: 33px;
  opacity: 0.8;
}
.workIntro .left .date:before {
  content: "";
  position: absolute;
  width: 50px;
  height: 1px;
  background-color: #cdb99c;
  transform: rotate(-48deg);
  left: -4px;
  top: -1px;
}
.workIntro .left .cat {
  font-size: 1.5rem;
  font-family: "Avenir LT W01_45 Book1475508";
  letter-spacing: 0px;
  margin-top: 32px;
  opacity: 0.8;
  display: none;
}
.workIntro .left .cat span + span:before {
  content:",";
  margin-right: 3px;
}

.workIntro .left .urlBtn {
  display: inline-block;
  height: 46px;
  line-height: 46px;
  width: 161px;
  background-color: #dfdfdf;
  text-align: center;
  border-radius: 23px;
  margin-top: 43px;
  margin-left: -4px;
  transition:all ease .35s;
}
.workIntro .left a.url {
  font-size: 1.3rem;
  position: relative;
  display: inline-block;
  font-family: 'Avenir LT W01_45 Book1475508';
  letter-spacing: 0.01em;
  color:#3a3a3a;
  width: 100%;
  height: 100%;
}
.workIntro .left a span {
  position: relative;
  padding-left: 18px;
}
.workIntro .left a span:before {
  content: '';
  width: 4px;
  height: 4px;
  border: 0px;
  border-top: solid 1px #b6a389;
  border-right: solid 1px #b6a389;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 63%;
  left: 0;
  margin-top: -4px;
}
.workIntro .left a:hover span:before {
  animation: arrowD .4s;
}
@keyframes arrowD {
  50% {
    left:3px;
  }
  100% {
    left:0px;
  }
}



.workIntro .right {
  width: 50%;
  position: relative;
  padding-top: 7px;
}
.workIntro .right:before {
  content:"";
  position: absolute;
  height: 98%;
  width: 1px;
  background-color: rgba(191, 177, 145, 0.4);
  top: 53%;
  left: -69px;
  transform: translateY(-50%);

}
.workIntro .right .desc {
  font-size: 1.45rem;
  opacity: 1;
  letter-spacing: 0.04em;
  line-height: 2.8;
}


/*
workCont
*/

.workCont {
  width: 81%;
  margin:0 auto;
}
.workCont .subTitle {
  font-family: century-gothic, sans-serif;
  font-weight: 400;
  margin-top: 85px;
  margin-bottom: 42px;
  margin-left: 2px;
  text-transform: uppercase;
  font-weight: 500;
}
.workCont .subTitle span.number {
  font-size: 1.1rem;
  font-family: 'Helvetica Neue LT W01_41488878';
  letter-spacing: 0.05em;
  font-weight: 500;
  margin-left: 1px;
  color: #b28850;
  position: relative;
  display: inline-block;
  margin-bottom: 11px;
}

.workCont .subTitle span.txt {
  font-size: 1.45rem;
  display: block;
  font-family: adobe-garamond-pro, serif;
  font-weight: 600;
  letter-spacing: 1.2px;
}

.workCont .image {
  width: 100%;
  margin:0 auto;
}
.workCont .image + .image {
  margin-top: 50px;
}
.workCont .image img {
  width: 100%;
  height: auto;
}

.workCont .credit {
  font-family:'Helvetica Neue LT W01_41488878';
  width: 99%;
  margin-left: 2px;
  text-align: left;
  white-space: nowrap;
  border-top: 1px dotted #eeeeee;
  padding-top: 38px;
}
.workCont .credit +  .credit {
  margin-top: 38px;
}
.workCont .credit +  .credit:last-child {
  border-bottom: 1px dotted #eeeeee;
  padding-bottom: 38px;
}
.workCont .credit > .inner {
  width: 100%;
  display: inline-block;
}
.workCont .credit span {
  display: inline-block;
}
.workCont .credit span:nth-child(1) {
  font-size: 1.15rem;
  letter-spacing: 1px;
  opacity: 0.6;
  width: 50%;
  text-align: left;
}
.workCont .credit span:nth-child(2) {
  font-size: 1.3rem;
  letter-spacing: 1.2px;
  margin-right: 8px;
}
.workCont .credit span:nth-child(3) {
  font-size: 1.2rem;
  letter-spacing: 0.6px;
}


/*
backBtn
*/

.backBtn {
  font-size: 1.45rem;
  letter-spacing: 0.2px;
  width: 83.5%;
  margin: 0 auto;
  font-family: century-gothic, sans-serif;
  background: #f1f1f1;
  text-align: center;
  margin-top: 80px;
  border-radius: 45px;
}
.backBtn a {
  display: inline-block;
  width: 100%;
  height: 100%;
  padding:27px 0;
  position: relative;
  transition: all ease 0.35s;
  border-radius: 45px;
}
.backBtn a:hover {
  background-color: #ebebeb;
  transition: all ease 0.35s;
}
.backBtn span {
  position: relative;
  padding-left: 26px;
}
.backBtn span:before {
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 2px #b6a389;
  border-right: solid 2px #b6a389;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 53%;
  left: 0;
  margin-top: -4px;
}
.backBtn:hover span:before {
  animation: arrowB .4s;
}
@keyframes arrowB {
  50% {
    left:3px;
  }
  100% {
    left:0px;
  }
}



/*
workNext
*/

.workNext {
  background-color: #161616;
  color: #fff;
  height: 680px;
}
.workNext a {
  color: #fff;
}
.workNext > .inner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  height: 100%;
}
.workNext .left {
  width: 50%;
}
.workNext .left .image {
  height: 100%;
  width: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  position: relative;
}
.workNext .left .image:before {
  content:"";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0,0,0,0.2);
  transition:all ease .5s;
}
.workNext.active .left .image:before {
  background-color: rgba(0,0,0,0);
  transition:all ease .5s;
}
.workNext .left .image:after {
  content:"";
  position: absolute;
  width: 100%;
  height: 100%;
  right: 0;
  top: 0;
  background-color: #161616;
  transition:all ease .5s;
}
.workNext .left.slideIn .image:after {
  width: 25%;
}
.workNext.active .left .image:after {
  width: 12%;
}

.workNext .right {
  width: 50%;
  position: relative;
}
.workNext .right .nextCont {
  position: absolute;
  top: 31%;
  left: 4.5%;
  transition:all ease .5s;
}
.workNext.active .right .nextCont {
  left: 8.5%;
  transition:all ease .5s;
}

.workNext .nextNav {
  font-size: 1.9rem;
  font-family: garamond-premier-pro-display, serif;
  font-variant: small-caps;
  letter-spacing: 1.3px;
  position: relative;
  display: inline-block;
}
.workNext .nextNav:before {
  content:"";
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: rgba(255,255,255,0.3);
  bottom:-4px;
}

.workNext .nextTitle {
  font-size: 6rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 2.5px;
  text-transform: capitalize;
  font-variant: small-caps;
  margin-top: 31px;
}

.workNext .nextCat {
  font-size: 1.4rem;
  font-family:'Avenir LT W01_45 Book1475508';
  margin-top: 8px;
  letter-spacing: 0.2px;
  opacity: 0.7;
}
.workNext .nextCat span + span:before {
  content:",";
  margin-right: 5px;
}

.workNext .nextBtn {
  display: inline-block;
  font-size: 2.4rem;
  font-family: "��������", "Yu Mincho", YuMincho, "�q���M�m���� Pro", "Hiragino Mincho Pro", "MS P����", "MS PMincho", serif;
  color: #bfb191;
  height: 76px;
  width: 76px;
  border-radius: 100%;
  border: 1px solid rgba(216, 216, 216, 0.5);
  text-align: center;
  line-height: 78px;
  margin-top: 51px;
  transition: all ease .25s;
}
.workNext .nextBtn:hover {
  background-color: #fff;
  transition:all ease .4s;
}


/*
---------------------------------------------------
  8. Philosophy
---------------------------------------------------
*/

/* common */

html.is-fixed,
html.is-fixed body {
    height: 100%;
    overflow: hidden;
}

.philosophyBg {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0;
  background-color: rgba(0,0,0,0);
  visibility: hidden;
  transition:all ease .5s;
  z-index: 5;
}
.philosophyBg.zIndex {
  z-index: 5 !important;
}
.philosophyBg.active {
  visibility: visible;
  background-color: rgba(0,0,0,0.2);
  z-index: 6;
  transition:all ease .5s;
  height: 100%;
}
.philosophyBg.active2 {
  visibility: visible;
  z-index: 7;
  height: 100%;
}
.philosophyBg.active3 {
  background-color: rgba(0,0,0,0.2);
}


.ourPhilosophy {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 100vh;
  background-color: #fff;
  opacity: 1;
  -webkit-transition: .8s cubic-bezier(.6,0,.25,1);
  transition: .8s cubic-bezier(.6,0,.25,1);
  z-index: 6;
}
.ourPhilosophy.zIndex {
  z-index: 6 !important;
}
.ourPhilosophy.active {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow-y: auto;
  z-index: 6;
}
.ourPhilosophy.active2 {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow-y: auto;
  z-index: 8;
}

.philoInner {
  opacity: 0;
  transition: all ease 0.75s;
}
.philoInner.active {
  opacity: 1;
  transition: all ease 0.75s;
}

.panelList{
    height:1000px;
    border:solid 1px #CCC;
    border-top:none;
    background:#eee;
}

.tab.is-active{
    transition: all 0.2s ease-out;
}


/* contents */


/*
close
*/

.philoClose {
  position: absolute;
  right: 22px;
  top: 18px;
  height: 56px;
  width: 56px;
  border-radius: 100%;
  border:0px solid #d2d2d2;
  z-index: 5;
  opacity: 0;
  transition: all ease .5s;
}
.active .philoClose,.active2 .philoClose {
  opacity: 1;
  transition-delay: 4.45s;
}


.philoClose span {
  display: inline-block;
  height: 1px;
  width: 35px;
  background-color: #fff;
  position: absolute;
  top: 50%;
  left: 20%;
  transform:translate(-50%,-50%);
  z-index: 5;
  transition: all ease .5s;
}


.philoClose span:nth-child(1) {
  transform: rotate(45deg);
}
.philoClose span:nth-child(2) {
  transform: rotate(-45deg);
}

/*
Title
*/


.philoCont .title {
  position: absolute;
  top: 52%;
  transform: translateY(-50%);
  left: 13.2%;
  color: #fff;
  text-align: left;
}
.philoCont .title .eng {
  font-family: garamond-premier-pro-display, serif;
  font-weight: 500;
  font-size: 7.3rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  height: 83px;
  overflow: hidden;
}
.philoCont .title .eng span {
  display: inline-block;
  margin-top: 75px;
  -webkit-transition: 1.2s cubic-bezier(.6,0,.25,1);
  transition: 1.2s cubic-bezier(.6,0,.25,1);
}
.active .philoCont .title .eng span,
.active2 .philoCont .title .eng span {
  margin-top: 0px;
  transition-delay: 1.75s;
}

.philoCont .title .jpn {
    font-size: 1.5rem;
    letter-spacing: 1.6px;
    color: #fff;
    display: block;
    position: relative;
    margin-left: 5px;
    margin-top: 9px;
    font-weight: 500;
    display: inline-block;
}
.philoCont .title .jpn:before {
  content: "";
  position: absolute;
  top: -28px;
  height: 0px;
  width: 0%;
  left: 1%;
  background-color: #fff;
  -webkit-transition: 1.2s cubic-bezier(.6,0,.25,1);
  transition: 1.2s cubic-bezier(.6,0,.25,1);
}
.active .philoCont .title .jpn:before,
.active2 .philoCont .title .jpn:before {
  width: 100%;
  transition-delay: 1.75s;
}

.philoCont .title span.parent {
  display: inline-block;
  height: 20px;
  overflow:hidden;
}
.philoCont .title span.parent span {
  display: inline-block;
  margin-top: 25px;
  -webkit-transition: 1.2s cubic-bezier(.6,0,.25,1);
  transition: 1.2s cubic-bezier(.6,0,.25,1);
}
.active .philoCont .title span.parent span,
.active2 .philoCont .title span.parent span {
  margin-top: 0;
  transition-delay: 1.75s;
}



/*
MainImg
*/

.philoCont {
  position: initial;
}
.philoCont.fixed {
  position: fixed;
  z-index: 1;
}


.philoCont .mainImg {
  height: calc(100vh - 20px);
  min-height: 455px;
  width: calc(100% - 20px);
  margin: 10px auto;
  position: relative;
  -webkit-background-size: 115%;
  background-size: 115%;
  -webkit-transition: 1.6s cubic-bezier(.6,0,.25,1);
  transition: 1.6s cubic-bezier(.6,0,.25,1);
  overflow: hidden;
  transition-delay: 0.5s;
}
.philoCont .mainImg .img {
  height: 100%;
  width: 100%;
  position: relative;
  transform: scale(1.2);
  -webkit-transition: 1.2s cubic-bezier(.6,0,.25,1);
  transition: 1.2s cubic-bezier(.6,0,.25,1);
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
}
.ourPhilosophy.active .philoCont .mainImg .img,.ourPhilosophy.active2 .philoCont .mainImg .img {
  transform: scale(1.1);
  transition-delay: 1s;
}

.philoInner.active .philoCont .mainImg {
  height: 46.7vw;
  transition-delay: 2.25s;
  margin-top: 0;
  width: 100%;
}
.philoCont .mainImg .img:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    background: rgba(0,0,0,0.1);
    transition: all ease .5s;
}

.philoCont .missionImg .img {
  background-image: url(../img/thumb/philosophy/01_story.jpg);
}
.philoCont .visionImg .img {
  background-image: url(../img/thumb/philosophy/02_vision.jpg);
}
.philoCont .valueImg .img {
  background-image: url(../img/thumb/philosophy/03_value.jpg);
}


/*
Nav
*/

.underPhiloNav {
  position: relative;
  border-bottom: 1px solid #eee;
  width: calc(100% - 30px);
  margin:0 auto;
  height: 82px;
  margin-top: 36px;
  display: none;
}
.underPhiloNav ul {
  position: absolute;
  right: 108px;
}
.underPhiloNav ul li:after {
  bottom:-40px;
}


/*
About
*/

.ourPhilosophy .about .left > .inner {
  position: sticky;
  position: -webkit-sticky;
  position: -webkit-sticky;
  top: 94px;
  margin-bottom: 225px;
}

.philoCont .about {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  width: 75%;
  margin: 140px auto 0;
}
.philoCont .about > .left {
  width: 50%;
}
.philoCont .about > .left.inview.fadeInUp,
.philoCont .about > .right.inview.fadeInUp {
  transition-delay: 0.6s;
}
.philoCont .about .left .copy {
  font-size:3.65rem;
  letter-spacing: 0.05em;
  line-height: 1.75;
  font-weight: 500;
}
.philoCont .about .left .copy span.sp {
  display: none;
}
.philoCont .about .left .copy span.pc {
  display: block;
}
.philoCont .about .left .engDesc {
    font-size: 1.5rem;
    font-family: adobe-garamond-pro, serif;
    color: #b3a587;
    letter-spacing: 0.03em;
    display: block;
    line-height: 2.15;
    margin-top: 10px;
    margin-left: 1px;
}
.philoCont .about .left .engDesc span.sp {
  display: none;
}
.philoCont .about .left .engDesc span.pc {
  display: block;
}

.philoCont .about > .right {
  width: 47%;
  margin-top: -5px;
}
.philoCont .about .right .desc {
  font-size: 1.6rem;
  line-height: 2.9;
  letter-spacing: 0.04em;
  margin-top: 0;
}


/*
NextCont
*/

.philoCont .nextCont {
  width: 100%;
  margin: 230px auto 0;
  border-top: 1px solid #eeeeee;
  transition:all ease .5s;
}
.philoCont .nextCont.active {
  background-color: #fff;
  transition:all ease .5s;
}
.philoCont .nextCont > .inner {
  width: 77%;
  margin: 160px auto 175px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}

.philoCont .nextCont .left {
  width: 50%;
}
.philoCont .nextCont .left .image {
  height: 36vw;
  width: 36vw;
  border-radius: 100%;
  position: relative;
  overflow: hidden;
  box-shadow: 1.6px 1.4px 4px 0px rgba(162, 162, 162, 0.45);
}

.philoCont .nextCont .left .image .img {
  width: 100%;
  height: 100%;
  border-radius: 100%;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  transition: all 1s cubic-bezier(.26,0,.07,1);
  position: relative;
}
.philoCont .nextCont.active .left .image .img {
  transform: scale(1.1);
  transition: all 1s cubic-bezier(.26,0,.07,1);
}

.philoCont .nextCont .left .missionNextImg {
  background-image: url(../img/thumb/philosophy/01_story.jpg);
}
.philoCont .nextCont .left .visionNextImg {
  background-image: url(../img/thumb/philosophy/02_vision.jpg);
}
.philoCont .nextCont .left .valueNextImg {
  background-image: url(../img/thumb/philosophy/03_value.jpg);
}

.philoCont .nextCont .right {
  width: 60%;
  position: relative;
}
.philoCont .nextCont .right > .inner {
  display: inline-block;
  position: absolute;
  top: 21.4%;
  left: 50.5%;
  transform: translateX(-50%);
}

.workNext .right .nextCont {
  position: absolute;
  top: 31%;
  left: 4.5%;
  transition:all ease .5s;
}
.workNext.active .right .nextCont {
  left: 8.5%;
  transition:all ease .5s;
}

.philoCont .nextCont .nextNav {
  font-size: 1.45rem;
  font-family: garamond-premier-pro-display, serif;
  font-weight: 300;
  font-variant: small-caps;
  letter-spacing: 1.4px;
  position: relative;
  display: inline-block;
  margin-left: 2px;
}
.philoCont .nextCont .nextNav:before {
  content:"";
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: rgba(0,0,0,0.1);
  bottom:-5px;
}

.philoCont .nextCont .nextTitle {
  font-size: 7.7rem;
  font-family: garamond-premier-pro-display, serif;
  font-weight: 300;
  letter-spacing: 0.7px;
  margin-top: 53px;
  white-space: nowrap;
}

.philoCont .nextCont .nextDesc {
    font-size: 1.45rem;
    letter-spacing: 0.08em;
    color: #7a7a7a;
    margin-top: 3px;
    margin-left: 2px;
}
.philoCont .nextCont .nextCat span + span:before {
  content:",";
  margin-right: 5px;
}

.philoCont .nextCont .nextBtn {
  display: inline-block;
  font-family: "��������", "Yu Mincho", YuMincho, "�q���M�m���� Pro", "Hiragino Mincho Pro", "MS P����", "MS PMincho", serif;
  font-size: 2.4rem;
  color: #b28850;
  height: 77px;
  width: 77px;
  border-radius: 100%;
  border: 1px solid #e5e5e5;
  text-align: center;
  line-height: 79px;
  margin-top: 44px;
  margin-left: -4px;
  transition: all ease .25s;
}
.philoCont .nextCont.active .nextBtn {
  margin-left: 5px;
}


/*
CloseMessage
*/

.closeMessage {
    padding-top: 54px;
    padding-bottom: 47px;
    text-align: center;
    transition: all ease .5s;
    border-top: 1px solid #f2f2f2;
}
.closeMessBtn {
  display: inline-block;
  color:#5d5d5d;
  position: relative;
  font-size: 1.65rem;
  font-family: garamond-premier-pro-display, serif;
  font-weight: 500;
  font-variant: small-caps;
  text-transform: uppercase;
  letter-spacing: 1.9px;
  margin-left: 44px;
}
.closeMessBtn:before {
  position: absolute;
  content: "";
  top: 3px;
  left: -25px;
  width: 6px;
  height: 6px;
  border-top: 1px solid #cdb99c;
  border-right: 1px solid #cdb99c;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  z-index: 0;
}
.closeMessage:hover {
   background-color: #f9f9f9;
   transition:all ease .5s;
}


/*
Guideline
*/

.ourValue .about .left > .inner {
    margin-bottom: 110px;
}
.ourValue .about {
    margin-bottom: 85px;
}
.philoCont .about + .about {
    margin-top: 0px;
    border-top: 1px solid #f5f5f5;
    margin-bottom: 115px;
    padding-top: 115px;
}
.philoCont .about .left .guideCopy span.num {
    font-size: 3.1rem;
    font-family: adobe-garamond-pro, serif;
    margin-right: 15px;
}

.philoCont .about .left .guideCopy {
  font-size: 2.9rem;
  margin-bottom: -10px;
}




/*
---------------------------------------------------
  9. Company
---------------------------------------------------
*/





/*
---------------------------------------------------
  10. Contact
---------------------------------------------------
*/


/*
Commmon
*/

.contactMain {
  width: calc(100% - 14.3%);
  margin-left: auto;
  margin-right: auto;
  margin-top: 95px;
  opacity: 0;
}
.contactMain.animation {
  margin-top: 71px;
  opacity: 1;
  transition:all ease .5s;
}
.contactMain >  .inner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.contactMain .left {
  width: 16.3%;
  display: none;
}
.contactMain .left .contactNav {
  position: sticky;
  position: -webkit-sticky;
  top:155px;
}
.contactMain .middle {
  width: 35.5%;
  padding-right: 16.5%;
}
.contactMain .middle .inner {
  position: sticky;
  position: -webkit-sticky;
  top:147px;
}
.contactMain .right {
  width: 48%;
}


/*
Left
*/

.contactNav {
  font-size: 1.5rem;
}
.contactNav span {
  font-size: 1.5rem;
  font-family: 'Helvetica Neue LT W01_41488878';
  margin-right: 11px;
}
.contactNav ul li + li {
  margin-top: 14px;
}
.contactNav ul li {
  color:#999;
  transition: all ease .25s;
}
.contactNav ul li.current {
  color:#000;
  transition: all ease .25s;
}


/*
Middle
*/

.contactMain .middle {

}
.contactMain .middle .contactDesc {
  font-size: 1.3rem;
  line-height: 2.4;
  letter-spacing: 0.0em;
  margin-top: -8px;
}
.contactMain .middle .email {
  font-size: 1.4rem;
  font-family:'Helvetica Neue LT W01_41488878';
  margin-top: 28px;
}
.contactMain .middle .email span {
  font-size: 1.3rem;
}
.contactMain .middle .email span:after {
  content:":";
  margin-left: 4px;
  margin-right: 4px;
}
.contactMain .middle .email a {
  letter-spacing: 0.3px;
  position: relative;
}
.contactMain .middle .email a::after {
  position: absolute;
  bottom: -6px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #cdb99c;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
  transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
}
.contactMain .middle .email a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}


/*
Right
*/

.contactMain .right .formCont + .formCont {
  margin-top: 34px;
}
.contactMain .right .required {
  font-size: 1.6rem;
  color:#b23636;
}
.contactMain .right .formCont input[type=date],
.contactMain .right .formCont input[type=number],
.contactMain .right .formCont input[type=text],
.contactMain .right .formCont input[type=tel],
.contactMain .right .formCont input[type=email]
 {
  font-size: 1.3rem;
  letter-spacing: 0.4px;
  width: calc(100% - 15px);
  line-height: 67px;
  padding-left: 15px;
  border:1px solid #dcdcdc;
  background-color: #fdfdfd;
  outline: none;
  transition: all ease .35s;
  border-radius: 0;
  -webkit-appearance:none;
}
.contactMain .right .formCont input.wpcf7c-conf {
  background-color: #f4f4f4 !important;
}
:-webkit-autofill {
  box-shadow: 0 0 0 1000px #f4f4f4 inset;
}
.contactMain .right .formCont input:focus {
  border:1px solid #999;
  transition: all ease .35s;
}

.contactMain .right .formCont textarea {
  font-size: 1.3rem;
  letter-spacing: 0.4px;
  width: calc(100% - 15px);
  height: calc(100% - 15px);
  padding-left: 15px;
  padding-top: 15px;
  padding-bottom: 15px;
  border:1px solid #dcdcdc;
  background-color: #fdfdfd;
  outline: none;
  transition: all ease .35s;
  border-radius: 0;
  -webkit-appearance:none;
}
.contactMain .right .formCont textarea.wpcf7c-conf {
  background-color: #f4f4f4 !important;
}
.contactMain .right .formCont textarea:focus {
  border:1px solid #999;
  transition: all ease .35s;
}

.contactMain .right .formTitle {
  font-size: 1.35rem;
  letter-spacing: 0.2px;
  margin-bottom: 15px;
  margin-left: 2px;
}

.contactMain .right .accept {
  font-size: 1.35rem;
  margin-top: 18px;
  position: relative;
}
input[type="checkbox"] {
  display: none;
}
span.wpcf7-list-item-label {
  display: block;
  height: 15px;
  width: 15px;
  border: 1px solid #add8e6;
  position: relative;
  cursor: pointer;
}
span.wpcf7-list-item-label::before {
    content: " ";
    position: absolute;
    width: 55%;
    height: 59%;
    border-radius: 1px;
    background: #add8e6;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    opacity: 0;
}

input[type="checkbox"]:checked + span.wpcf7-list-item-label::before,
input[type="checkbox"]:checked + span.wpcf7-list-item-label::after {
    opacity: 1;
}
input.wpcf7c-conf-hidden + span.wpcf7-list-item-label::before,
input.wpcf7c-conf-hidden + span.wpcf7-list-item-label::after {
    opacity: 1;
}

.contactMain .right .accept span.wpcf7-not-valid-tip {
  position: absolute;
  width: 100%;
  top: 18px;
}
.contactMain .right .accept span.checkbox-661 {
  margin-right: 8px;
  position: relative;
  width: 21px;
}
span.wpcf7-form-control.wpcf7-checkbox.wpcf7-validates-as-required {
  position: absolute;
  top: -12px;
}

span.wpcf7-list-item {
  margin:auto
}
.contactMain .right .accept a {
  position: relative;
}
.contactMain .right .accept .mark {
  font-size: 1.6rem;
  color:#b23636;
}
.contactMain .right .accept a:before {
  content:"";
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: #add8e6;
  bottom:-4px;
}



.contactMain .right .accept .wpcf7-form-control-wrap {
  position: static;
  display: inline-block;
}
div.wpcf7-validation-errors, div.wpcf7-acceptance-missing {
  border:none;
  margin:auto;
  padding:initial;
  margin-top: 26px;
}
div.wpcf7 .ajax-loader {
  display: none;
}
div.wpcf7-validation-errors:before,
div.wpcf7-acceptance-missing:before {
  content:"��";
  color: #f00;
  margin-right: 4px;
}

.contactMain .right .btnList {
  margin-top: 37px;
}
.contactMain .right .btnList input {
  font-size: 1.4rem;
  font-weight: 600;
  letter-spacing: 0px;
  color:#fff;
  width: 102%;
  margin-left: -1%;
  line-height: 67px;
  border:none;
  background-color: #add8e6;
  outline: none;
  border-radius: 0;
  border-radius: 40px;
}
.contactMain .right .btnList input.wpcf7c-btn-back {
  background-color: #787878;
}
.contactMain .right .btnList input.wpcf7c-btn-back + input {
  margin-top: 5px;
}


.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
  padding: 2.3em;
  margin: 0;
  margin-top: 34px;
  border: 2px solid #e9e9e9;
}

div.wpcf7-mail-sent-ok,
.wpcf7 form.sent .wpcf7-response-output {
  line-height: 26px;
  letter-spacing: -0.1px;
  border:2px solid #ccc !important;
  margin:auto;
  padding: 27px 29px  ;
  margin-top: 29px;
}


/*
Not
*/

.contactMain .right .formCont input.wpcf7-not-valid {
  border: 1px solid #ff6666;
}
.wpcf7-not-valid span.wpcf7-list-item-label {
  border: 1px solid #ff6666;
}
span.wpcf7-not-valid-tip {
  font-size: 1.25rem;
  margin-top: 9px;
  padding-bottom: 10px;
  display: none;
}


/*
Thanks
*/


.wpcf7 form.sent .wpcf7-response-output {
    border-color: #46b450;
}



/*
---------------------------------------------------
  11. Privacy Policy
---------------------------------------------------
*/

.policyMain {
  width: calc(100% - 12.7%);
  margin-left: auto;
  margin-right: auto;
  margin-top: 145px;
  opacity: 0;
}
.policyMain.animation {
  margin-top: 125px;
  opacity: 1;
  transition:all ease .5s;
}

.policyMain .cont {
  margin-left: initial;
}
.policyMain .cont dl {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.policyMain .cont dl +  dl {
  margin-top: 75px;
  padding-top: 75px;
  border-top: 1px solid #b0e0e6;
}
.policyMain .cont dl dt {
    font-size: 1.9rem;
    letter-spacing: 0.05em;
    width: 46%;
}
.policyMain .cont dl dt span {
    font-size: 2.3rem;
    font-family: garamond-premier-pro-display, serif;
    margin-right: 6px;
}
.policyMain .cont dl dd {
    width: 49%;
    font-size: 1.45rem;
    line-height: 2.65;
    letter-spacing: 0.02em;
    margin-top: -6px;
}
.policyMain .cont dl dd ul {
    margin-top: 27px;
}
.policyMain .cont dl dd span {
    margin-right: 7px;
}

.afterlink{

	font-weight: bold !important;
	text-decoration: underline;
}

.weddingdressimg {
    background-image: url(/img/pickupimg/weddingdressimg_img.jpg);
}

.colordressimg {
    background-image: url(/img/pickupimg/colordressimg_img.jpg);
}

.bouquetimg {
    background-image: url(/img/pickupimg/bouquetimg_img.jpg);
}

.flowercoordinateimg {
    background-image: url(/img/pickupimg/flowercoordinateimg_img.jpg);
}


.snapimg {
    background-image: url(/img/pickupimg/snapimg_img.jpg);
}

.memoryimg {
    background-image: url(/img/pickupimg/memoryimg_img.jpg);
}

.boatparkimg {
    background-image: url(/img/place/boatparkimg.jpg);
}

.trbuildingimg {
    background-image: url(/img/place/trbuildingimg.jpg);
}



.infolink::after{
	content: "";
position: absolute;
bottom: -8px;
left: -3%;
left: 0;
width: 104%;
height: 1px;
background-color: #fff !important;
transform: scale(0, 1);
transform-origin: right top;
transition: -webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
transition: transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1),-webkit-transform 0.4s cubic-bezier(0.08, 0.92, 0.35, 1);
    transition-delay: 0s, 0s;
transition-delay: 0.3s;
}


.infolink{
    font-size: 1.25rem;
    margin-top: 42px;
}

.infolink{
	    font-size: 1.1rem;
    font-family: 'Helvetica Neue LT W01_41488878';
    font-weight: 400;
    color: #fff;
    letter-spacing: 0.1em;
    margin-top: 30px;
    margin-left: 1px;
    transition: all ease .25s;
    position: relative;
    display: inline-block;
}

#map {
	position:  relative;
	top: 40px;
	left: 0;
  right: 0;
  margin: auto;
   width: 90%;
   height: 400px;
 }

section.sectAccess .title {
  font-size: 7.3rem;
  letter-spacing: 0.08em;
  margin-left: 0px;
  white-space: nowrap;
}

/*
Cont
*/

section.sectAccess .sectCont {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  width: 84.4%;
  position: relative;
  align-items: center
}

section.sectAccess .sectCont .left {
  width: 48%;
}
section.sectAccess .sectCont .left .image {
  overflow: hidden;
  transition:all ease .5s;
}
section.sectAccess .sectCont .left .image.active {
  transform: scale(.95);
}

section.sectAccess .sectCont .left .image figure {
  height: 45vw;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  background-position: center center;
  background-image: url(/img/place/party01.jpg);
  transition:all ease .5s;
}


section.sectAccess .sectCont .left .image.active figure {
  transform: scale(1.2);
}


section.sectAccess .sectCont .right {
  width: 52%;
}
section.sectAccess .sectCont .right .cont {
  width: 45%;
  margin:0 auto;
}

section.sectAccess .sectCont .right .title {
  font-size: 3.9rem;
  font-weight: 300;
  line-height: 1.8;
  letter-spacing: 0.07em;
  white-space: nowrap;
}
section.sectAccess .sectCont .right .title span {
  display: block;
  font-size: 1.75rem;
  font-family: garamond-premier-pro-display, serif;
  letter-spacing: 0.06em;
  margin-top: 18px;
  margin-leGft: 2px;
  color: #b0e0e6;
}
section.sectAccess .sectCont .right .desc {
  font-size: 1.4rem;
  line-height: 3.2;
  letter-spacing: 0.08em;
  margin-top: 34px;
}
section.sectAccess .sectCont .right .readMore {
  font-size: 1.2rem;
   margin-top: 42px;
}




.header-contact-btn {
	box-sizing: border-box;
	display: block;
	right: 0;
	width: 45px;
	padding: 18px 8px 18px;
	background-color: #b0e0e6;
	text-decoration: none;
	color: #444;
	font-size: 1.4rem;
	letter-spacing: 2px;
	z-index: 99999;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	transition: all .3s;
	cursor: pointer;
}
.header-contact-btn {
	position: fixed;
	top: 250px;
	right: 0;
}
.header-contact-btn:hover {
	color: #fff;
}
.header-contact-btn span {
	-webkit-writing-mode: vertical-lr;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-lr;
	vertical-align: top;
}

.scroll-area {
    height: 160px;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 10px;
    border: 1px solid #00a0b8;
    font-size: 12px;
    overflow-x: hidden;
    overflow: scroll;
    border: 1px solid #CCC;
    -webkit-overflow-scrolling: touch;
}


.loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #FFF;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  opacity: 1;
  visibility: visible;
}

.loading.is-active {
  opacity: 0;
  visibility: hidden;
}

.loading-animation {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #ffffff;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
}

.loading-animation svg{
	width: 250px;
}
.loading-animation.is-active {
  opacity: 1;
  visibility: visible;
}

/* svgアニメーション */
@keyframes path0{
  0%{
    fill: transparent;
    stroke-dashoffset: 1000;
  }
  75%{
    fill: transparent;
    stroke-width: 1;
  }
  85%{
    fill: #4285F4;
    stroke-width: 0;
    stroke-dashoffset:0;
  }
  100%{
    fill: #4285F4;
    stroke-width: 0;
    stroke-dashoffset:0;
  }
}
@keyframes path1{
  0%{
    fill: transparent;
    stroke-dashoffset: 1000;
  }
  75%{
    fill: transparent;
    stroke-width: 1;
  }
  85%{
    fill:#4c4b4b;
    stroke-width: 0;
    stroke-dashoffset:0;
  }
  100%{
    fill:#4c4b4b;
    stroke-width: 0;
    stroke-dashoffset:0;
  }
}
@keyframes path2{
  0%{
    fill: transparent;
    stroke-dashoffset: 1000;
  }
  75%{
    fill: transparent;
    stroke-width: 1;
  }
  85%{
    fill:#4c4b4b;
    stroke-width: 0;
    stroke-dashoffset:0;
  }
  100%{
    fill:#4c4b4b;
    stroke-width: 0;
    stroke-dashoffset:0;
  }
}
@keyframes path3{
  0%{
    fill: transparent;
    stroke-dashoffset: 1000;
  }
  75%{
    fill: transparent;
    stroke-width: 1;
  }
  85%{
    fill:#4c4b4b;
    stroke-width: 0;
    stroke-dashoffset:0;
  }
  100%{
    fill:#4c4b4b;
    stroke-width: 0;
    stroke-dashoffset:0;
  }
}

  .loading .cls-1
  {
    fill: transparent;
    stroke: #daf7fb;
    stroke-width: 1;
    stroke-dasharray: 1000;
    stroke-dashoffset:0;
    animation:path1 5s ease-in infinite forwards;
    transform: translate3d(0,0,0);
  }
  .loading .cls-2
  {
    fill: transparent;
    stroke: #daf7fb;
    stroke-width: 1;
    stroke-dasharray: 1000;
    stroke-dashoffset:0;
    animation:path2 5s ease-in infinite forwards;
    transform: translate3d(0,0,0);
  }

.lock{
	overflow: hidden;
}

.style_PC #side_menu, .style_TAB #side_menu {
    clear: both;
    overflow: hidden;
    position: fixed;
    right: 0;
    top: 93px;
    z-index: 1200;
}

#side_menu,.style_TAB #side_menu{
	clear:both
	;overflow:hidden;
	position:fixed;
	right:0;
	top: 50%;
	z-index:1200;
	font-family: Brandon_med_it;
	 }

#side_menu .con_bt,.style_TAB #side_menu .con_bt{
	width:95px;
	height:90px;
	z-index:10;
	float:right;
	position:relative;
	top:0;
	left:0;
	}

#side_menu .con_bt a,
.style_TAB #side_menu .con_bt a{
display:block;

width:100px;
height:58px;
text-align:center;
cursor:pointer;
padding-top:32px;
}

#side_menu .con_bt a .icon,.style_TAB #side_menu .con_bt a .icon{width:36px;height:17px;margin:0 auto;}

#side_menu .con_bt a .menu,.style_TAB #side_menu .con_bt a .menu{font-size:12px;margin-top:2px;}

#side_menu .con_menu,
.style_TAB #side_menu .con_menu{
clear:both;
overflow:hidden;
background-color:#FFF;
padding-top:20px;
z-index:0;
text-align:right;
padding-right:28px;
padding-bottom:2em;
display:none;
position:relative;
top:-120px;
left:0;
padding-top:130px;
}

#side_menu .con_menu .st,
.style_TAB #side_menu .con_menu .st{clear:both;overflow:hidden;}

#side_menu .con_menu .st .font_en,
.style_TAB #side_menu .con_menu .st .font_en{font-size:18px;color:#2c2c2c;}

#side_menu .con_menu .st .jp,
.style_TAB #side_menu .con_menu .st .jp{
font-size:10px;
border-bottom:1px solid #2c2c2c;
float:right;
padding-left:2em;
padding-bottom:2em;
color:#2c2c2c;
}

#side_menu .con_menu .box_list,
.style_TAB #side_menu .con_menu .box_list{clear:both;overflow:hidden;padding-left:2em;margin-top:1em;}

#side_menu .con_menu .box_list ul,
.style_TAB #side_menu .con_menu .box_list ul{}#side_menu .con_menu .box_list ul li,
.style_TAB #side_menu .con_menu .box_list ul li{}#side_menu .con_menu .box_list ul li a,
.style_TAB #side_menu .con_menu .box_list ul li a{font-size:10px;line-height:16px;}

.menu_shop {
	display:none;
}
@media screen and (max-width :428px) {
#side_menu,
.style_TAB #side_menu{display:none;}
.menu_shop{
	display:block;
	white-space:nowrap;
}
}
@media screen and (max-width :10000px) {

.r_menu1{
	padding:30px 0;
	margin:3px 0;
	width:90px;
	background:#fff;
	opacity:0.8;
	text-align:center;
	float:right;
	}
.bill_title{
	 font-style:italic;
	 font-size: 16px;
	 font-family: 'Helvetica Neue LT W01_41488878';
	}
}

.border_b{
	border-bottom: 1px solid;
	border-top: 1px solid #ffffff;
}

.menu_shop{
	font-size:11px;
	padding: 10px 5px;
	text-align:center;
	font-weight:700;
	display: inline-block;
    width: 49%;
}

.menu_shop a{
	color: #ffffff;
}

.menu_shop + .menu_shop{
	border-left: 1px solid #ffffff;
}

@media screen and (max-width :767px) {
	.sp_none{
		display: none;
	}
	.carousel .item img{
		object-fit: cover;
    	height: 250px!important;
    	width: auto;
	}
}

.caption{
	background: #00a0b8;
    color: #fff;
    font-weight: bold;
    padding: 10px;
    text-align: center;
}

ul.attention{
	list-style-type: square;
	line-height: 3rem;
}

.modal{
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
}
.modal__bg{
    background: rgba(0,0,0,0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
}
.modal__content{
    background: #fff;
    left: 50%;
    padding: 2rem;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 80%;
}

.flowbox {
    border: 1px solid;
    position: relative;
    margin-bottom: 6rem;
    padding: 1.5rem;
}

.flowbox::after {
    position: absolute;
    left: 50%;
    bottom: -45px;
    transform: translateX(-50%);
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 25px 0 25px;
    border-color: #06B4C6 transparent transparent transparent;
}

.flowbox:last-child::after{
	display: none;
}


.submenusp{
	display: none;
}

.red{
	color: #cc0000;
}

.contactMain .right .formCont select {
  height: auto;
  font-size: 1.3rem;
  letter-spacing: 0.4px;
  width: calc(100% - 15px);
  line-height: 67px;
  padding-left: 15px;
  border:1px solid #dcdcdc;
  background-color: #fdfdfd;
  outline: none;
  transition: all ease .35s;
  border-radius: 0;
  -webkit-appearance:none;
}

.form-time select {
  width: auto !important;
  padding: 0 40px !important;
}