@charset "utf-8";
/* CSS Document */

  .b-bg {
    background: white;
    color: #535353;
}

.sec-lead .e-shoulder{
  letter-spacing: .05em;
  line-height: 1.5;
  font-size: 14px;
}
.sec-lead .e-shoulder span{
  font-size: 20px;
}
.sec-list .e-shoulder{
  font-size: 20px;
  letter-spacing: .048em
}
.sec-lead .b-txt > p{
  font-size: 16px;
  letter-spacing: .08em;
}
.sec-list .b-txt dd{
  font-size: 16px;
}

.b-pageTop3 {
  display: none;
}


@media screen and (max-width: 767px){
  .sec-lead .b-shoulder{
    margin-left: -.3em;
    margin-bottom: 50px;
}
  .sec-list .b-txt dd{
    font-size: 14px;
  }
  
}
@media screen and (min-width: 768px){
}

/*---------------------------------

 b-fv

---------------------------------*/
.b-fv{
  position: relative;
  overflow: hidden;
}
.b-fv .b-scroll{
  position: absolute;
  display: flex;
  align-items: center;
  bottom: 20px;
  left: 50%;
  z-index: 1;
  line-height: 1;
  transform: translateX(-50%);
}
.b-fv .b-scroll .mark{
  animation: move-y 0.6s infinite alternate ease-in-out;
}
@keyframes move-y {
  from {
    transform: translateY(-5px);
  }
  to {
    transform: translateY(5px);
  }
}
.b-fv .b-scroll .mark img{
  width: auto;
}
.b-fv .move{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 767px){
  .b-fv{
    margin-top: -100px !important;
  }
  .b-fv.container,
  .sec-lead.container{
    margin: 0;
  }
  .b-fv .b-scroll{
    width: 100px;
  }
  .b-fv .b-scroll,
  .b-fv .b-scroll img{
    height: 48px;
  }
  .m-natural .b-fv .move{ background: url(img/natural-main-sp.jpg) center center / cover; top: 33px;}
  .m-italian .b-fv .move{ background: url(img/italian-main-sp.jpg) center center / cover; top: 33px}
  .m-modern .b-fv .move{ background: url(img/modern-main-sp.jpg) center center / cover; top: 33px}
  .m-brooklyn .b-fv .move{ background: url(img/brooklyn-main-sp.jpg) center center / cover; top: 33px}
}
@media screen and (min-width: 768px){
  .b-fv{
    height: 530px;
  }
  .b-fv .b-scroll{
    width: 100px;
  }
  .b-fv .b-scroll,
  .b-fv .b-scroll img{
    height: 48px;
  }
  .b-fv .move{
    width: calc( 100% - 40px);
    left: 20px;

  }
  .m-natural .b-fv .move{ background: url(img/natural-main-pc.jpg) center center / cover; }
  .m-italian .b-fv .move{ background: url(img/italian-main-pc.jpg) center center / cover; }
  .m-modern .b-fv .move{ background: url(img/modern-main-pc.jpg) center center / cover; }
  .m-brooklyn .b-fv .move{ background: url(img/brooklyn-main-pc.jpg) center center / cover; }
}

/*---------------------------------

 sec-lead

---------------------------------*/
.sec-lead .b-txt{
  text-align: left;
  background: #707070;
}
.sec-lead .b-txt h1,
.sec-lead .b-txt p{
  margin-left: 0;
}
.sec-lead .b-txt h1{
  margin-bottom: .8em;
  font-weight: 400;
  letter-spacing: .08em;
}
.sec-lead .b-txt p{
  font-weight: 400;
}
.sec-lead .b-txt p span{
  display: inline-block;
  white-space: nowrap;
}
.sec-lead + .b-btn a,
.sec-lead + .b-btn .js-alert{
  margin: auto;
  border: 0;
}
@media screen and (max-width: 767px){
  .sec-lead .b-txt{
    padding: 40px 45px;
  }
  .sec-lead .b-txt h1{
    font-size: 25px;
    white-space: nowrap;
  }
  .sec-lead .b-img{
    width: 100%;
    height: 290px;
  }
  .m-natural .sec-lead .b-img{ background: url(img/natural-lead-sp.jpg) center center / cover; }
  .m-italian .sec-lead .b-img{ background: url(img/italian-lead-sp.jpg) center center / cover; }
  .m-modern .sec-lead .b-img{ background: url(img/modern-lead-sp.jpg) center center / cover; }
  .m-brooklyn .sec-lead .b-img{ background: url(img/brooklyn-lead-sp.jpg) center center / cover; }
  .sec-lead + .b-btn a,
  .sec-lead + .b-btn .js-alert{
    width: 280px;
    font-size: 18px;
    margin-top: 45px;
  }
  .sec-lead + .b-btn .js-alert span{
    font-size: 18px;
  }
}
@media screen and (min-width: 768px){
  .sec-lead {
    display: flex;
    flex-direction: row-reverse;
    height: 0px;
  }
  .sec-lead .b-txt{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 44%;
  }
  .sec-lead .b-shoulder{
    margin-bottom: 40px;
  }
  .sec-lead .b-img{
    width: 56%;
    height: 100%;
  }
  .m-natural .sec-lead .b-img{ background: url(img/natural-lead-pc.jpg) center center / cover; }
  .m-italian .sec-lead .b-img{ background: url(img/italian-lead-pc.jpg) center center / cover; }
  .m-modern .sec-lead .b-img{ background: url(img/modern-lead-pc.jpg) center center / cover; }
  .m-brooklyn .sec-lead .b-img{ background: url(img/brooklyn-lead-pc.jpg) center center / cover; }
  .sec-lead .b-txt{
    padding: 10px 4.5%;
  }
  .sec-lead .b-txt h1{
    font-size: 30px;
    margin-bottom: .5em;
  }
  .sec-lead + .b-btn a,
  .sec-lead + .b-btn .js-alert{
    width: 385px;
    font-size: 20px;
    margin-top: 50px;
  }
  .sec-lead + .b-btn .js-alert span{
    font-size: 20px;
  }
}

/*---------------------------------

 sec-list

---------------------------------*/
.sec-list.container{
  max-width: 1030px;
}
.sec-list h2 {
  font-weight: 400;
  line-height: 1;
  color: #780E0E;
  border: 1px solid #780E0E;
  text-align: center;
  padding: 0.3em 0.2em 0.5em;
}
.sec-list .b-btn a{
  margin: auto;
}
@media screen and (max-width: 767px){
  .sec-list{
    margin-top: 50px;
  }
  .sec-list h2{
    font-size: 14px;
    margin-bottom: 40px;
  }
}
@media screen and (min-width: 768px){
  .sec-list{
    margin-top: 100px;
  }
  .sec-list h2{
    font-size: 20px;
    margin-bottom: 60px;
  }
}

.sec-list .e-shoulder{
  border-bottom: 1px solid #999;
  padding-bottom: .2em;
  margin-bottom: 20px;
}
.sec-list .e-name{
  margin-bottom: 10px;
}
@media screen and (max-width: 767px){
  .sec-list article+article{
    margin-top: 50px;
  }
  .sec-list .b-txt{
    margin-bottom: 25px;
  }
  .sec-list .e-name{
    font-size: 20px;
  }
  .sec-list .b-option{
    margin-top: 60px;
  }
  .sec-list .b-option .e-shoulder{
    margin-bottom: 30px;
  }
  .sec-list .b-option article{
    display: flex;
    justify-content: space-between;
  }
  .sec-list .b-option article dl{
    display: flex;
    width: 48%;
    flex-direction: column-reverse;
  }
  .sec-list .b-option .e-name{
    font-size: 14px;
    margin-top: .5em;
  }
  .sec-list .b-btn{
    margin-top: 50px;
  }
  .sec-list .b-btn a{
    width: 95%;
    height: 38px;
    font-size: 18px;
  }
}
@media screen and (min-width: 768px){
  .sec-list article+article{
    margin-top: 40px;
  }
  .sec-list article{
    display: flex;
  }
  .sec-list .b-txt dd{
    padding-right: 6%;
  }
  .sec-list .e-name{
    font-size: 27px;
  }
  .sec-list .b-img{
    width: 45.5%;
    min-width: 45.5%;
    margin-left: 20px;
  }
  .sec-list .b-option{
    margin-top: 70px;
  }
  .sec-list .b-option article{
    width: 290px;
  }
  .sec-list .b-option .e-name{
    font-size: 20px;
  }
  .sec-list .b-btn{
    margin-top: 55px;
  }
}

/*---------------------------------

 b-coaution

---------------------------------*/
.b-caution .container{
  max-width: 1030px;
}
.b-caution .inner{
  color: #535353;
}

.b-scroll {
  color: white;
}

.b-caution .b-btn a{
  border: 0;
}
@media screen and (max-width: 767px){
  .b-caution{
    margin-top: 35px;
    padding-bottom: 1px;
  }
}
@media screen and (min-width: 768px){
  .b-caution{
    margin-top: 35px;
    padding-bottom: 1px;
  }
  .b-caution .inner{
    margin-bottom: 45px;
  }
  /* .b-caution .e-lead::before{
    background: url(../assets/img/ic-check-wh.png) center center / contain no-repeat;
  } */
  .b-caution .b-btn a{
    width: 380px;
  }
}


/*---------------------------------

 sec-setLnks

---------------------------------*/
.container.sec-setLnks{
  max-width: 1140px;
  border-bottom: 1px solid #ccc;
}
@media screen and (min-width: 768px){
  .sec-setLnks{
    padding-bottom: 80px;
  }
  .sec-setLnks h2{
    font-size: 25px;
  }
  .sec-setLnks .b-img a{
    width: 31.6%;
  }
}
/*---------------------------------

 sec-recmmend

---------------------------------*/
.sec-recommend{
  color:#535353;
}
.sec-recommend .b-ttls{
  text-align: center;
}
.sec-recommend .b-ttl{
  letter-spacing: .01em;
}
.sec-recommend .e-lead{
  letter-spacing: .06em;
}
.sec-recommend a{
  font-size: 14px;
  text-decoration: underline;
}
.sec-recommend img{
  border: 1px solid #C6C6C6;
}
.sec-recommend a:hover{
  text-decoration: none;
}
.sec-recommend a:hover img{
  border-color: #780E0E;
}
.sec-recommend .b-lst{
  display: flex;
  flex-wrap: wrap;
}
.sec-recommend .b-lst figcaption{
  margin-top: .4em;
  line-height: 1.5;
}
@media screen and (max-width: 767px){
  .container.sec-recommend{
    max-width: 1040px;
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .sec-recommend .b-ttl{
    font-size: 16px;
    margin-bottom: 25px;
  }
  .sec-recommend .e-lead{
    display: none;
  }
  .sec-recommend a{
    font-size: 12px;
  }
  .sec-recommend .b-lst{
    width: 93%;
    margin: auto;
  }
  .sec-recommend .b-lst li{
    width: 47.5%;
    margin-right: calc( 100% - 47.5% * 2);
    margin-bottom: 17px;
  }
  .sec-recommend .b-lst li:nth-child(2n){
    margin-right: 0;
  }
}
@media screen and (min-width: 768px){
  .container.sec-recommend{
    max-width: 1040px;
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .sec-recommend .b-ttls{
    margin-bottom: 40px;
  }
  .sec-recommend .b-ttl{
    font-size: 25px;
    margin-bottom: 3px;
  }
  .sec-recommend .e-lead{
    font-size: 16px;
  }
  .sec-recommend .b-lst li{
    width: 23%;
    margin-right: calc( (100% - 23% * 4) / 3);
    margin-bottom: 15px;
  }
  .sec-recommend .b-lst li:nth-child(4){
    margin-right: 0;
  }
  .sec-recommend a{
    display: block;
    font-size: 14px;
    overflow: hidden;
  }
  .sec-recommend a:hover img{
    transform-origin: center center;
  }
}

