/*Dark Style*/
.dark{
  background:#272727;
  color: #fff;
}
.dark .reverse_column{
  display: flex;
  flex-direction: column-reverse;
}
.dark .highlight{
  position: absolute;
  width: 86%;
  height: auto;
  background: #1A1A1A;
}

.dark .v1-breadcrumbLayout{
  background: #fff;
}

.dark .leadingVisual{
  font-family: 'Bodoni MT', 'Bodoni Moda', serif;
}

.dark .main_visual{
  position: relative;
  height: 750px;
  background: url("/japan-travel-planner/kobe_beef/images/main_visual.png");
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}

.dark .breadcrumb{
  margin-left: 5vw;
}

.dark .main_visual .leadingVisual{
  padding-top: 70px;
  font-size: 2em;
  margin-bottom: 50px;
}

.dark .main_visual h1{
  font-size: 4em;
}

.dark .main_visual .mainVisual_text{
  position: relative;
  padding-top: 20px;
  line-height: 1.2;
}

.dark .main_visual .mainVisual_text{
  text-shadow: 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000, 0 0 20px #000;
}

.dark .main_visual .mainVisual_text::before{
  content: "";
  position: absolute;
  top: -3px;
  display: block;
  width: 30px;
  height: 23px;
  background: url("/japan-travel-planner/kobe_beef/images/icon_quote.png");
  background-size: 30px 23px;
  background-repeat: no-repeat;
  z-index: 100;
}

.dark .main_visual .mainVisual_text svg{
  position: absolute;
  top: 35%;
}

.dark .section2 .beginning3 h3,
.fr .dark .section2 .what1 h3{
  padding-bottom: 3px;
}

.dark .main_visual #menu{
  position: absolute;
  top: 50px;
  right: 25px;
}

.dark #kobeNav{
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  padding: 50px 10vw 0;
  background: #000;
}

.dark #kobeNav li a{
  color: #fff;
}

.closebtn {
  position: absolute;
  top: 0;
  right: 60px;
  font-size: 2.25em;
  margin-left: 25px;
  margin-top: 25px;
  color: #fff;
}

.menu-content {
  display: none;
  min-width: 160px;
  overflow: auto;
  right: 0;
  z-index: 1;
}

.dark .section2{
  margin-top: 100px;
}
.dark .section2 .orangeLine {
  top: calc(-100% - 0vw);
  left: 49.94%;
}
.dark .section2 h2{
  font-size: 2.75em;
}

.dark .section2 .pride{
  padding-top: 25px;
  padding-bottom: 25px;
  z-index: 10;
}

.dark .section2 .what1 .left-flex{
  flex: 50%;
  position: relative;
  z-index: 5;
}

.dark .section2 .what1 .right-flex{
  position: relative;
  top: -5vw;
  flex: 48%;
  margin-left: 55px;
}

.dark .section2 h3{
  font-size: 2em;
  margin-bottom: 33px;
  overflow: hidden;
}

.dark .section2 .colStyle1 p{
  width: 70%;
  color: #c2c2c2;
  font-size: 1em;
  line-height: 1.5;
}

.dark .section2 .beginning3 .colStyle1 p{
  width: 90%;
}

.dark .section2 .subTitle{
  margin-top: 35px;
  font-size: 1.75em;
  line-height: 1.5;
}

.dark .section2 .ushi{
  text-align: right;
  top: -60px;
  right: 0;
}
.dark .section2 .ushi img{
  width: 70%;
}

.dark .section2 .what1{
   margin-top: 200px;
 }

.dark .section2 .where2 .left-flex{
  flex: 50%;
  padding-left: 10%;
}

.dark .section2 .where2 .right-flex{
  flex: 43%;
}

.dark .section2 .where2 .hyogo{
  top: 12vw;
  left: 5vw;
  font-size: 2em;
}

.dark .section2 .where2 .kobe{
  top: 13vw;
  left: 10vw;
  font-size: 2.875em;
  color: #E89673;
}

.dark .section2 .where2 .kyoto{
  top: 10vw;
  left: 19vw;
  font-size: 1.25em;
}

.dark .section2 .where2 .osaka{
  top: 20vw;
  left: 16vw;
  font-size: 1.25em;
}

.dark .section2 .where2 .nara{
  bottom: 22vw;
  right: 20vw;
  font-size: 1.25em;
}

.dark .section2 .where2 .osaka2{
  bottom: 9vw;
  left: 17vw;
  font-size: 1.25em;
}

.dark .section2 .where2 .tokyo{
  bottom: 11vw;
  right: 12vw;
  font-size: 1.25em;
}
.dark .section2 .beginning3{
  margin-top: 95px;
}

.beefRating .posStyle{
  height: 110%;
  top: -5%;
}

.dark .section2 .beginning3 img{
  top: 0;
}

/* .de .dark .section2 .beginning3 img,
.fr .dark .section2 .beginning3 img{
  top: -100%;
} */

.dark .section2 .beginning3 .flex-left{
  flex: 50%;
}

.dark .section2 .beginning3 .flex-right{
  flex: 43%;
}

.dark .section3{
  margin-top: 130px;
}

.dark .reason3 .left-flex{
  flex: 20%;
  text-align: center;
}

.dark .reason3 .left-flex img{
  max-width: 480px;
}

.dark .reason3 .right-flex{
  flex: 21%;
  padding-top: 3vw;
  padding-bottom: 3vw;
  padding-left: 3vw;
  z-index: 10;
}

.dark .reason3 .right-flex .heading-size3{
  line-height: 1.25;
  z-index: 10;
}

.dark .section3 .wagyuBeef{
  top: -8vw;
  right: 0;
}

.dark .section3 .subTitle,
.dark .section5 .subTitle{
  font-size: 1.3em;
  text-align: center;
  line-height: 1.5;
}

.dark .section5 h2{
  padding-top: 6vw;
  font-size: 2.75em;
  text-align: center;
}

.dark .section5 .subTitle{
  margin-top: 36px;
  line-height: 1.25;
}

.dark .beefRating > svg{
  padding: 0 30px;
}
.dark .beefRating > svg.onlySP{
  width: 100%;
}

.dark .section6 p,
.dark .section7 p{
  margin-top: 50px;
  padding: 0 10vw;
}

.dark .section6 .sliderStore li{
  position: relative;
}

.dark .section6 .sliderStore,
.dark .section7 .sliderRestaurant{
  margin-top: 65px;
}

.dark .section6 h2{
  margin-top: -80px;
}

.dark .section6 .highlight{
  top: -125px;
  height: 120%;
  width: 87%;
}

.dark .section7 .highlight{
  right: 0;
  height: 87%;
  width: 87%;
}

.dark .section7 .container{
  padding-top: 134px;
}

.sliderStore img, 
.sliderRestaurant img{
 padding: 0 5px;
}

.dark .section5 {
  margin-top: 160px;
  padding-bottom: 341px;
  background: url('/japan-travel-planner/kobe_beef/images/bg_howto.png');  
}

.dark .section5 .howto{
  width: 45vw;
  padding-top: 56px;
  margin-top: 108px;
}

.dark .section5 .howto h4{
  color: #313131;
  text-align: center;
}

.dark .section5 .howto p{
  width: 64%;
  margin-top: 55px;
  padding: 0 3vw;
  color: #606060;
  line-height: 1.5;
}

.dark .section5 .howto img.posAbsolute{
  top: 30%;
  right: 10%;
  width: 263px;
}



.en .dark .section5 .howto img.posAbsolute{
  top: 27%;
}

.dark .sectionStyle1 h3{
  font-size: 3em;
  text-align: center;
}

.marbling, 
.lean, 
.umami {
  padding: 0 15vw;
}

.section3 .whatSet{
  margin-top: 16vw;
}

.section3 .whatSet .container{
  z-index: 5;
}

.section3 .whatSet h2{
  line-height: 1.25;
}

.section3 .whatSet .flex-left{
  flex: 40%;
}
.section3 .whatSet .flex-right{
  flex: 15%;
}
.flavor .descList{
  margin-top: 100px; 
}

.flavor .orangeLine{
  top: calc(0% - 6vw);
  height: 8vw;
}

.flavor .highlight{
  height: 130%;
  top: -2vw;
  right: 0;
}

.flavor .subTitle{
  margin-top: 29px;
}

.flavor .left-flex{
  flex: 0%;
}

.flavor .onlyPC .right-flex{
  flex: 73%;
  padding-left: 65px;
}

.flavor .descTitle{
  font-family: 'Bodoni MT', 'Bodoni Moda', serif;
  font-size: 1.5em;
}

.flavor .desc{
  padding-top: 20px;
  font-size: 1em;
  color: #c2c2c2;
  line-height: 1.5;
}

.kobeMap svg{
  width: 80%;
  height: 600px;
  font-family: 'Bodoni MT', 'Bodoni Moda', serif;
}

.kobeMap svg text,
.kobeMap svg text tspan{
  font-family: 'Bodoni MT', 'Bodoni Moda', serif;
}


.lineage{
  margin-top: 167px;
}

.lineage .highlight{
  height: 110%;
}

.lineage .orangeLine,
.strict .orangeLine{
  top: -32px;
}

.strict{
  margin-top: 215px;
}

.strict .highlight{
  height: 105%;
  right: 0;  
}

.dark .section6 .buttonStyle1,
.dark .section7 .buttonStyle1{
  margin-top: 122px;
}

.dark .section7{
  margin-top: 10vw;
  padding-bottom: 13vw;
}

.dark .lineage .subTitle,
.dark .strict .subTitle,
.dark .strict ol{
  line-height: 1.5;
}

.dark .sliderCow{
  display: flex;
  max-width: 75vw;
  flex-direction: row-reverse;
  margin-top: 67px; 
}

.dark .sliderCow .onlySP p.orange-font svg{
  position: relative;
  top: -5px;
}

.dark .sliderCow .onlySP p.lightGray-font{
  line-height: 1.5;
}

.dark .section2 .where2{
  margin-top: 90px;
}

.dark .sliderCow span{
  width: 42%;
  height: 100%;
  top: 0;
  right: 0;
  padding: 35px;
  background-color: rgba(39, 39, 39, .57);
  font-size: 1em;
  line-height: 2.75;
  overflow-y: scroll;
}

.dark .sliderCow .slick-prev{
  right: 74%;
  left: auto !important;
  transform: translateY(-50%) rotate(180deg);
}

.sliderCow .slick-dots li {
  position: relative;
  width: auto;
  height: auto;
  display: block;
  padding: 0 5px;
  cursor: pointer;
  font-size: 1.3em;
}
@keyframes animateCow {
  0% {
      width: 0;
  }
  100% {
      width: 38px;
  }
}
.sliderCow .slick-dots li a:hover::before{
  content: '';
  position: absolute;
  top: 50%;
  left: -50px;
  width: 0;
  height: 2px;
  background: #D54100;
  animation: animateCow 0.15s linear;
  animation-fill-mode: forwards;
}

#kobeNav li{
  list-style: none;
  padding-left: 50px;
  margin: 80px 0;
}
#kobeNav li:first-child:hover{
  list-style: none;
}

.sliderCow .slick-dots li.slick-active a::before{
  content: '';
  position: absolute;
  top: 50%;
  left: -50px;
  width: 38px;
  height: 2px;
  background: #D54100;
  animation: animateCow 0.15s linear;
  animation-fill-mode: forwards;
  cursor: pointer;
}

.sliderCow .slick-list{
  max-width: 925px;
  margin-right: 7%;
}

.sliderCow .slick-dots{
  flex: 23%;
  margin: auto;
}

.sliderCow .slick-dots li{
  padding-bottom: 75px;
}

.sliderCow .slick-dots li:last-child{
  padding-bottom: 0;
}

.sliderCow .slick-dots a{
  position: relative;
  top: 7px;
  color: #fff;
}

.sectionStyle1 h3{
  padding-top: 5vw;
}

.sectionStyle1 p{
  margin-top: 40px;
  padding: 0 2vw;
}

.dark .colStyle1{
  display: flex;
  flex-direction: row;
  vertical-align: middle;
  align-items: center;
}

.dark .colStyle2{
  display: flex;
  flex-direction: column;
  align-items: center;
  vertical-align: middle;
}

.dark .colStyle3{
  display: flex;
  flex-direction: row;
}

.dark .orangeGradient1{
  position: absolute;
  display: block;
  top: 0px;
  left: 0px;
  width: 43%;
  height: 100%;
  background-color: #D54100; /* For browsers that do not support gradients */
  background-image: linear-gradient(to left, #d54100, #d54200, #d44200, #d44300, #d44300, #d24a00, #d05000, #ce5500, #c96000, #c46a00, #be7400, #b97c00);
}

.dark .orangeGradient2{
  position: absolute;
  display: block;
  top: 0;
  right: 0;
  width: 80%;
  height: 100%;
  background-color: #D54100; /* For browsers that do not support gradients */
  background-image: linear-gradient(to right, #d54100, #d54200, #d44200, #d44300, #d44300, #d24a00, #d05000, #ce5500, #c96000, #c46a00, #be7400, #b97c00);
}

.heading-size1{
  font-size: 2em;
}

.heading-size2{
  font-size: 2.75em;
}

.heading-size3{
  font-size: 2.75em;
}

.heading-size4{
  font-size: 1.75em;
}

.font-size1{
  font-size: 1.3em;
  line-height: 1.5;
}

.font-size2{
  font-size: 1em;
}

.bgWhite{
  padding-bottom: 70px;
  background:#fff;
}

.en .dark .bgWhite{
  padding-bottom: 100px;
}


.orangeLine{
  left: 50%;
  z-index: 5;
}

.posRelative{  position: relative; }
.posAbsolute{ position: absolute; }

.center-flex{
  align-items: center;
  vertical-align: middle;
}

.listStyleDec{
  list-style: decimal;
  font-size: 1.1em;
}

.orange-font{
  color: #EF4100;
}
.text-center{
  text-align: center;
}
.buttonStyle1{
  display: block;
  width: 44.375vw;
  padding: 28px;
  margin: 0 auto;
  border-style: none;
  border-radius: 49px;
  font-size: 1.5em;
  color: #fff;
  background: #D54100;
  text-align: center;
  transition-timing-function: ease;
  transition-duration: .3s;
}
.dark .buttonStyle1 svg.js-external-link{
  vertical-align: middle;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 5px;
  fill: #fff;
}
/* .sliderStore .slick-slide:not(.slick-current)::before{
  content: '';
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.3);
  z-index: 1;
 } */
 .sliderRestaurant .slick-slide{
   position: relative;
 }
 /* .sliderRestaurant .slick-slide:not(.slick-current)::before{
  content: '';
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.3);
  z-index: 1;
 } */

.show {display: block;}
.onlySP{
  display: none;
}
.lightGray-font{
  color: #c2c2c2;
}

.strict .subTitle{
  width: 70%;
}

.strict .listStyleDec{
  width: 60%;
  margin-top: 31px;
}

.dark .beefRating{
  width: 100%;
}

.dark .beefRating svg.onlyPC{
  width: 45%;
  margin-top: 20px;
}

.stickyMenu{
  position: fixed;
  top: 10vw;
}

.dark .orangeLine.onlySP{
  display: none;
  visibility: hidden;
}

.dark .section3 .wagyuBeef img {
    width: 80%;
}
.dark .section3 .wagyuBeef {
    text-align: right;
}
@keyframes animate {
  0% {
      width: 0;
  }
  100% {
      width: 30px;
  }
}
.orangeHorizon:hover::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 0;
  height: 1px;
  background: #D54100;
  animation: animate 0.15s linear;
  animation-fill-mode: forwards;
}
.orangeHorizon:active::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 30px;
  height: 1px;
  background: #D54100;
  animation: animate 0.15s linear;
  animation-fill-mode: forwards;
}

.de .where2 h3{
  padding-bottom: 3px;
}

#Kyoto, #Osaka-2, #Nara, #Osaka, #Tokyo{
  font-size: 2em;
}

#Hyogo{
  font-size: 3em;
}

#Kobe{
  font-size: 4.5em;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /* IE10+ CSS styles go here */
  .kobeMap svg{
    width: initial;
  }
  .dark .beefRating svg.onlyPC{
    width: 700px;
    height: 670px;
  }
  .dark .where2 h3{
    overflow: hidden;
  }
  .kobeMap svg{
    min-height: 600px;
  }
}

@media only screen and (max-width: 1850px)  {
  .dark .section2 .orangeLine{
    top: calc(-100% - 0vw);
  }
}

@media only screen and (max-width: 1500px)  {

  .sliderCow .slick-list{
    max-width: 55vw;
  }
  .sectionStyle1 p{
    padding: 0;
  }
  .listStyleDec{
    padding: 0 12vw;
  }

  .dark .section3 .subTitle{
    width: 70%;
    margin-left: auto;
    margin-right: auto;
  }

  .dark .lineage h3{
    margin-right: 6vw;
  }
  .section3 .whatSet .flex-left{
    width: 100%;
  }

  .dark .section5 .howto img.posAbsolute{
    max-width: 200px;
    bottom: auto;
    top: 27%;
  }
  .dark .section2 .where2 .left-flex{
    margin-top: 0;
  }
  .dark .section2 .ushi{
    width: 40%;
  }
  /* .dark .section2 .beginning3 img {
    top: -100%;
  }

  .de .dark .section2 .beginning3 img,
  .fr .dark .section2 .beginning3 img {
    top: -10vw;
  } */

  .heading-size1 {
    width: 59%;
  }
  .kobeMap svg {
    width: 100%;
    height: auto;
  }
  .dark .section6 .buttonStyle1, .dark .section7 .buttonStyle1 {
    margin-top: 100px;
  }
  .buttonStyle1{
    font-size: 1.5em;
  }
  
  .strict .listStyleDec {
    width: 90%;
  }
  .dark .section2 .orangeLine {
    top: calc(-100% - 0vw);
  }
  .dark .sliderCow span{
    line-height: 1.8;
  }
 }

 @media only screen and (max-width: 1370px)  {
   .dark .section3 .wagyuBeef {
    top: 0;
   }
  .dark .section3 .wagyuBeef img {
    width: 60%;
  }
  .dark .sliderCow span{
    line-height: 1.5;
  }
   .dark .sliderCow .slick-prev {
    right: 80%;
    }
   .dark .section5 .howto {
    width: 80vw;
   }
}
 
 @media only screen and (max-width: 1280px)  {
  .dark .section2 .ushi{
    width: 40%;
  }

  .bgWhite{
    padding-left: 2vw;
    padding-right: 2vw;
  }
  .dark .section2 .where2 .left-flex{
    margin-top: 0;
  }
  .dark .sliderCow span{
    width: 50%;
    padding: 15px;
    font-size: 0.85em;
    overflow: scroll;
  }
  
  /* .dark .section2 .beginning3 img {
    top: -55%;
  } */
  
  .flavor .highlight {
    height: 120%;
  }
   .sliderCow .slick-list {
    max-width: 45vw;
   }
   .sliderCow .slick-dots li {
    padding-bottom: 50px;
    font-size: 1em;
   }
   .dark .sliderCow .slick-prev {
    right: 68%;
   }
 }
 @media only screen and (max-width: 1024px)  {
   .sliderCow .slick-list {
    max-width: 56vw;
   }
   .dark .highlight {
     width: 95%;
   }
   .sliderCow .slick-list {
    margin-right: 5%;
  }
   .slick-next {
    right: 10px;
   }
   .dark .sliderCow .slick-prev {
    right: 77%;
   }
   .dark .section7 .highlight {
    height: 95%;
  }
}
 @media only screen and (max-width: 950px)  {
  .dark .main_visual .mvDe {
    font-size: 3.4em;
  }
  .dark p{
    font-size: 1em;
  }

  .dark .main_visual h1{
    font-size: 1.5em;
  }
  .dark .main_visual .leadingVisual{
    padding-top: 50px;
    font-size: 1.75em;
    line-height: 1.3;
  }

  .dark .section5 .howto{
    width: auto;
    margin: 20vw 30px 0;
  }

  .dark .main_visual .mainVisual_text svg{
    top: 5%;
  }

  .dark .main_visual #menu{
    width: 70px;
    top: 16px;
    right: 16px;
  }

  .dark .main_visual .mainVisual_text{
    font-size: 1.5em;
    margin-top: 3vw;
  }

  .dark .section2 .where2 .left-flex{
    margin-left: 0;
  }
  .dark .section2 .beginning3{
    margin-top: 10%;
  }
  .dark .beginning3 .flex-right{
    margin-top: 20px;
  }
  .dark .section2 .beginning3 img{
    position: initial;
    margin: 0 auto;
  }
  .dark .main_visual .mainVisual_text{
    font-size: 4em;
  }
  .dark .colStyle1{
    flex-direction: column;
  }
  .map.kobeMap{
    margin-top: 0;
  }
  .dark .section2 .what1 .right-flex{
    margin-left: 0;
    margin-top: 2em;
  }
  .dark .section2 .colStyle1 p{
    width: 100%;
  }
  .dark .section2 .where2{
    flex-direction: column-reverse;
  }
  .dark .colStyle1.reason3{
    flex-direction: column-reverse;
  }
  .dark .section2 .ushi{
    top: 0;
  }
  .flavor .highlight,
  .lineage .highlight,
  .strict .highlight,
  .dark .section6 .highlight,
  .dark .section7 .highlight
  {
    width: 100%;
  }
  .section3 .whatSet{
    display: flex;
    flex-direction: column-reverse;
    vertical-align: middle;
    align-items: center;
  }
  .dark .section3 .wagyuBeef{
    position: initial;
  }
  .dark .beefRating{
    width: 80%;
    margin-top: 10%;
  }

  .dark .section7 .highlight{
    display: none;
  }
  .dark .section6 .buttonStyle1, 
  .dark .section7 .buttonStyle1{
    width: 80%;
    font-size: 1.25em;
  }

  .dark .flavor .onlySP .colStyle1{
    flex-direction: row;
  } 

  .dark .lean{
    align-items: baseline;
  }
  .dark .reason3 .left-flex{
    left: 0;
  }
  .sliderCow .slick-list{
    max-width: inherit;
    margin-right: 0;
  }
  .dark .sliderCow .slick-prev{
    left: 7px !important;
  }
  .slick-dots{
    display: none;
  }
  .dark .section3 .container.sliderCow{
    padding: 0 30px;
  }
  .dark .section3 .container.sliderCow span{
    display: none;
  }
  .dark .section7{
    margin-top: 5vw;
  }
  .dark .section6 .buttonStyle1, .dark .section7 .buttonStyle1{
    margin-top: 10vw;
  }
  .posRelative.bgWhite.howto .onlySP{
    text-align: center;
  }
  .posRelative.bgWhite.howto .onlySP img{
    width: 75%;
  }
  .posRelative.bgWhite.howto .onlySP h4{
    margin-top: 40px;
    padding: 0 30px;
  }
  .posRelative.bgWhite.howto .onlySP p{
    width: auto;
    padding: 0 30px;
  }

  .dark .section6 .sliderStore{
    height: auto !important;
  }
  .strict{
    margin-top: 105px;
  }

  .heading-size4{
    font-size: 1.25em;
    line-height: 1.5;
  }
  .lineage{
    margin-top: 12vw;
  }
  .strict .highlight{
    display: none;
  }
  .lineage .highlight{
    position: 100%;
  }
  .bgWhite.howto .onlySP{
    top: -6em;
  }

  .dark .section6 .highlight{
    top: -10%;
  }
  .dark .sliderCow .slick-prev,
  .dark .sliderCow .slick-next{
    top: 35%;
  }
  .dark .sliderCow img{
    width: 90%;
    margin: 0 auto;
  }
  .dark .section2 .what1 .right-flex{
    top: 0;
  }
  .onlySP{
    display: block !important;
  }
  .onlyPC{
    display: none !important;
  }
  .sp-p30{
    padding: 0 30px !important;
  }
  .flavor .onlySP .left-flex{
    text-align: center;
  }
  .flavor .onlySP .left-flex img{
    max-width: 75%;
  }
  .flavor .onlySP .right-flex{
    flex: 60%;
    padding-left: 30px;
  }
}
 
 @media only screen and (max-width: 768px)  {
  .dark .main_visual .mainVisual_text{
    padding-top: 35px;
  }
  .dark .orangeLine.onlySP{
    visibility: hidden;
  }
  .dark p{
    font-size: 1em;
    line-height: 1.5;
  }
  .dark h2{
    font-size: 2em !important;
    line-height: 1.2;
  }
  .dark h2.heading-size1{
    font-size: 1.4em !important;
  }

  .dark h3{
    font-size: 1.5em !important;
  }

  .dark .subTitle{
    font-size: 1.2em !important;
    line-height: 1.4 !important;
  }

  .listStyleDec{
    font-size: 1em !important;
  }
  p.font-size1 {
    font-size: 1.2em;
    line-height: 1.4;
  }
  .dark .section3 .subTitle{
    width: auto;
    margin-left: 0;
    margin-right: 0;
  }

  .dark .section3 .container{
    padding: 30px 0 0;
  }

  .dark .section3 .container h2{
    padding: 0 20px;
  }

  .dark .section3 .container .flavor{
    padding: 0 20px;
  }

  .dark .orangeGradient1{
    width: 80%;
  }
  .dark .container{
    max-width: inherit;
  }
  .dark .section2 .ushi{
    top: 100%;
  }
  .flavor .right-flex{
    padding-right: 0;
  }
  .dark .section6 .highlight{
    height: 125%;
  }
  .lineage .orangeLine,
  .strict .orangeLine{
    height: 6vw;
  }
  .lineage .container h3{
    padding: 0 20px;
    line-height: 1.5;
  }
  .dark .marbling.container,
  .dark .lean.container,
  .dark .umami.container{
    padding: 0 30px;
  }
  .lineage {
    margin-top: 5vw;
  }

  .dark .section2 .where2 .left-flex{
    margin-top: 20px;
  }
  .kobeMap svg{
    height: 387px;
  }
  .lineage{
    margin-top: 15vw;
  }
  .dark .sliderCow .slick-prev,
  .dark .sliderCow .slick-next{
    top: 23vw;
  }
   .dark .section5 {
    margin-top: 90px;
    padding-bottom: 220px;
   }
  .dark .section5 .howto p{
    font-size: 1em;
    line-height: 1.2;
  }
   .dark .section6 p, .dark .section7 p {
    margin-top: 35px;
    padding: 0 5vw;
   }
   .flavor .descList{
     margin-top: 50px; 
   }
   .dark .section2 .colStyle1 p{
    font-size: 1em;
    line-height: 1.4;
  }
   .heading-size1 {
    width: 100%;
  }
  .strict .listStyleDec {
    width: 100%;
  }
  .dark .buttonStyle1 svg.js-external-link {
    vertical-align: middle;
    width: 1.2rem;
    height: 1.2rem;
    margin-left: 5px;
    fill: #fff;
   }
   .dark .section2 .ushi img {
    width: 100%;
  }
  .dark .section5 .howto{
    max-height: 950px;
  }
  .dark .section2 .orangeLine{
    top: calc(-100% - 8vw);
  }
  .dark .section6 .buttonStyle1, .dark .section7 .buttonStyle1{
    width: 100%;
  }

}
 
 @media only screen and (max-width: 500px)  {
  .fr .dark .section2 .what1 h3{
    line-height: 1.25;
  }

  .dark .main_visual{
    height: 40em;
    margin-bottom: 50px;
    background: url("/japan-travel-planner/kobe_beef/images/mainVisual_sp.png") no-repeat center;
    background-size: cover;
  }
  .dark .section2 .orangeLine {
    display: none;
  }
  .dark .main_visual svg.orangeLine{
    position: absolute;
    bottom: calc(0% - 6vw);
    left: 50%;
  }
  .dark .orangeLine.onlySP{
    display: block;
  }
  .dark .section2 .what1{
    margin-top: 20vw;
  }
  .dark .section2{
    margin-top: 0;
  }
  .dark .section6 .buttonStyle1, .dark .section7 .buttonStyle1{
    width: 90%;
    padding: 12px 0;
    font-size: 0.9em;
  }
  .fr .dark .section6 .buttonStyle1, .dark .section7 .buttonStyle1,
  .de .dark .section6 .buttonStyle1, .dark .section7 .buttonStyle1{
    width: 95%;
    font-size: 0.8em;
  }
  .lineage .orangeLine,
  .strict .orangeLine{
    height: 13vw;
  }
  .dark .main_visual .mainVisual_text {
    font-size: 2.5em;
   }
   .dark .main_visual .leadingVisual {
    margin-bottom: 35px;
}
  .dark .quote{
    width: 30px;
  }
  .strict .listStyleDec {
    width: 100%;
  }
  .dark .section5 .howto{
    max-height: 850px;
  }
  .flavor dd{
    line-height: 1.4;
  }

  #Kyoto, #Osaka-2, #Nara, #Osaka, #Tokyo{
    font-size: 2.5em;
  }
  
  #Hyogo{
    font-size: 3em;
  }
  
  #Kobe{
    font-size: 4em;
  }

 }
/*Dark Style*/


/* Support Dark */

.dark .main_visual #menu{
  position: fixed;
  top: 280px;
  z-index: 998;
  transition: top .3s;
}
.dark .main_visual #menu:hover{
  opacity: .6;
}

.dark .main_visual #menu.on{
  top: 85px;
}

.dark #kobeNav {
  position: fixed;
  top: 235px;
  z-index: 999;
  transition: top .3s;
}
.dark #kobeNav.on {
  top: 70px;
}

@media only screen and (min-width: 768px)  {
  .dark .main_visual .leadingVisual {
    line-height: 1.5;
  }
}
@media only screen and (max-width: 1700px)  {
  .dark .section2 .beginning3 img {
    width: 50%;
}
    .dark img.meat {
    width: 90%;
  }
}
@media only screen and (max-width: 1023px)  {
  .dark .main_visual #menu.on{
    top: 80px;
  }
  .dark #kobeNav.on {
    top: 46px;
  }
}

@media only screen and (max-width: 950px)  {
  .dark .main_visual #menu.on{
    top: 65px;
  }
  .dark .section2 .beginning3 img {
    width: 100%;
}
  .dark img.meat {
    width: 100%;
    max-width: inherit !important;
  }
}
/* END Support Dark */
@media only screen and (max-width: 500px)  {

  .fr .dark .main_visual .mainVisual_text{
    font-size: 2.25em;
  }

  .fr .dark .main_visual .leadingVisual{
    font-size: 1.5em;
  }

  .fr .dark .main_visual .leadingVisual{
    padding-top: 20px;
  }

  .dark .orangeLine.onlySP{
    visibility: visible;
  }
  .dark .lineage h3{
    margin-top: 6vw;
    margin-right: 0;
  }
  .dark .main_visual #menu {
    top: 220px;
  }
    .dark .section3 .wagyuBeef img {
    width: 80%;
  }
  .dark .section3 .wagyuBeef {
    text-align: right;
  }
  .bgWhite {
    padding-bottom: 0;
  }
  .section3 .whatSet{
    margin-top: 15vw;
  }  
  .dark .subTitle{
    font-size: 1em !important;
  }
  .posRelative.bgWhite.howto .onlySP p{
    font-size: 1em !important;
  }
  .dark .font-size1{
    font-size: 1em !important;
  }
  .flavor .desc{
    font-size: 1em !important;
  }
  .listStyleDec li{
    font-size: 1em;
  }
  .kobeMap svg text{
    font-size: 2.2em;
  }
  .flavor .descTitle{
    font-size: 1.3em;
  }
  .flavor .onlySP .left-flex img{
    max-width: 100%;
  }
  .flavor .onlySP .right-flex{
    flex: 50%;
    padding-left: 40px;
  }
}
.pt-0{
  padding-top: 0!important;
}
a.buttonStyle1:hover{
  background-color: #c33c00 !important;
}