@charset "utf-8";
.main-animation__area {
  opacity: 0;
}

.animation-area {
  font-family: "A+EqpB-A+EqpB-游ゴシック体 Pr6N B Pr6N B";
  position: relative;
  background: #f8f8f8;
  padding: 96px 16px 60px;
  letter-spacing: 0.06em;
  /*
  	a
  	{
  		outline:0;
  	}
  */
}
.animation-area #modal-open:hover {
  -webkit-backface-visibility: hidden;
  /* 追加 */
  backface-visibility: hidden;
  /* 追加 */
  opacity: .7;
}
@media (max-width: 960px) {
  .animation-area {
    padding: 10vw 16px 60px;
  }
}
@media (max-width: 640px) {
  .animation-area {
    padding: 50px 0 0;
  }
}
.animation-area .animation-area__inner {
  max-width: 1056px;
  margin: auto;
  position: relative;
}
.animation-area .animation-block {
  background: url(../images/train/animation-bg.png) no-repeat;
  width: 100%;
  padding-top: 51.89394%;
  background-size: 100% 100%;
}
@media (max-width: 640px) {
  .animation-area .animation-block {
    background: url(../images/train/animation-bg@sp.png) no-repeat;
    background-size: 100% 100%;
    padding-top: 100%;
  }
}
.animation-area .animation__ttl {
  position: absolute;
  width: 83.71212%;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  transform: translateY(-34.16667%);
}
@media (max-width: 768px) {
  .animation-area .animation__ttl {
    width: 88.8%;
  }
}
.animation-area .animation-main {
  position: absolute;
  width: 35.51136%;
  top: 20.25547%;
  left: 23.29545%;
}
@media (max-width: 640px) {
  .animation-area .animation-main {
    width: 64.26667%;
    left: 0;
    right: 0;
    margin: auto;
    top: 14.19355%;
  }
}
.animation-area .animation-menu {
  background: white;
  margin-top: 8px;
  border-top: solid 1px black;
  border-bottom: solid 1px black;
  padding: 10px 0;
}
.animation-area .animation-menu .slick-area {
  width: 92%;
  padding-left: 35px;
  padding-right: 35px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: auto;
}
.animation-area .animation-menu .slick-area li {
  height: 80px;
  font-size: 12px;
  position: relative;
}
.animation-area .animation-menu .slick-area li a {
  color: black;
}
.animation-area .animation-menu .slick-area li img {
  margin: auto;
  transform: translateY(25%);
}
.animation-area .animation-menu .slick-area li .menu__txt {
  display: block;
  position: absolute;
  bottom: 0;
  text-align: center;
  width: 100%;
  line-height: 1.27273;
}
.animation-area .animation-menu .slick-area li .transrateY50 {
  transform: translateY(0%);
}
.animation-area .animation-menu .slick-area li .transrateY50 {
  transform: translateY(50%);
}
.animation-area .animation-menu .slick-area li .transrateY25 {
  transform: translateY(25%);
}
.animation-area .animation-menu .slick-area li .text--line1 {
  transform: translateY(-50%);
}
.animation-area .animation-menu .slick-arrow {
  display: inline-block;
  width: 38px;
  height: 38px;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
.animation-area .animation-menu .slick-prev {
  background: url(../images/train/arrow_left.png) no-repeat;
  background-size: 100%;
  left: 0;
}
.animation-area .animation-menu .slick-next {
  background: url(../images/train/arrow_right.png) no-repeat;
  background-size: 100%;
  right: 0;
}
.animation-area .animation-txt {
  position: absolute;
  width: 20.73864%;
  top: 42.70073%;
  left: 57.00758%;
}
@media (min-width: 641px) {
  .animation-area .animation-txt #animation-txt3,
  .animation-area .animation-txt #animation-txt8 {
    transform: translateY(33%);
  }
}
@media (min-width: 641px) {
  .animation-area .animation-txt #animation-txt8 {
    transform: translateX(25px);
  }
}
@media (min-width: 641px) {
  .animation-area .animation-txt #animation-txt2,
  .animation-area .animation-txt #animation-txt6 {
    transform: translateY(200%);
  }
}
.animation-area .animation-txt img:nth-child(n+2) {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
@media (min-width: 641px) {
  .animation-area .animation-txt img:nth-child(n+2) {
    transform: translateY(0);
  }
}
.animation-area .animation-txt .hide {
  visibility: hidden;
}
@media (max-width: 640px) {
  .animation-area .animation-txt {
    width: 44.4%;
    left: 0;
    right: 0;
    margin: auto;
    top: 75%;
  }
  .animation-area .animation-txt img {
    margin: auto;
  }
  .animation-area .animation-txt #animation-txt2 {
    width: 53.15315%;
    left: 0;
    right: 0;
    top: 0;
    /*
    	position: absolute;
    	top: 0;
    	right: 0;
    	left: 0;
    	transform: translateY(0);
    */
  }
  .animation-area .animation-txt #animation-txt3 {
    width: 88.88889%;
    left: 0;
    right: 0;
    top: 0;
    /*
    	position: absolute;
    	top: 0;
    	right: 0;
    	left: 0;
    	transform: translateY(0);
    */
  }
  .animation-area .animation-txt #animation-txt4 {
    width: 104.2042%;
    left: 0;
    right: 0;
    top: 0;
    /*
    	position: absolute;
    	top: 0;
    	right: 0;
    	left: 0;
    	transform: translateY(0);
    */
  }
  .animation-area .animation-txt #animation-txt5 {
    width: 100.9009%;
    left: 0;
    right: 0;
    top: 0;
    /*
    	position: absolute;
    	top: 0;
    	right: 0;
    	left: 0;
    	transform: translateY(0);
    */
  }
  .animation-area .animation-txt #animation-txt6 {
    width: 54.65465%;
    left: 0;
    right: 0;
    top: 0;
    /*
    	position: absolute;
    	top: 0;
    	right: 0;
    	left: 0;
    	transform: translateY(0);
    */
  }
  .animation-area .animation-txt #animation-txt7 {
    width: 116.51652%;
    left: 0;
    right: 0;
    top: 0;
    /*
    	position: absolute;
    	top: 0;
    	right: 0;
    	left: 0;
    	transform: translateY(0);
    */
  }
  .animation-area .animation-txt #animation-txt8 {
    width: 86.78679%;
    left: 0;
    right: 0;
    top: 0;
    /*
    	position: absolute;
    	top: 0;
    	right: 0;
    	left: 0;
    	transform: translateY(0);
    */
  }
  .animation-area .animation-txt #animation-txt9 {
    width: 73.87387%;
    left: 0;
    right: 0;
    top: 0;
    /*
    	position: absolute;
    	top: 0;
    	right: 0;
    	left: 0;
    	transform: translateY(0);
    */
  }
  .animation-area .animation-txt #animation-txt10 {
    width: 97.5976%;
    left: 0;
    right: 0;
    top: 0;
    /*
    	position: absolute;
    	top: 0;
    	right: 0;
    	left: 0;
    	transform: translateY(0);
    */
  }
}
@media (min-width: 641px) {
  .animation-area .animation-block .animation-txt .position2 {
    left: -13.82979%;
  }
}
.animation-area .animation-arrows li {
  width: 2.27273%;
  position: relative;
}
.animation-area .animation-arrows li img {
  height: auto;
}
.animation-area .animation-arrows li .gif {
  position: absolute;
  left: 0;
  top: 0;
}
.animation-area .animation-arrows li .bg-arrow {
  opacity: .5;
}
@media (min-width: 641px) {
  .animation-area .animation-arrows #arrow1 {
    position: absolute;
    left: 57.95455%;
    top: 10.0365%;
    transform: rotate(10deg);
  }
}
@media (max-width: 640px) {
  .animation-area .animation-arrows #arrow1 {
    position: absolute;
    width: 4.46061%;
    top: 14.53333%;
    left: 74.4%;
  }
}
@media (min-width: 641px) {
  .animation-area .animation-arrows #arrow2 {
    position: absolute;
    top: 22%;
    left: 78%;
    transform: rotate(17deg);
  }
}
@media (max-width: 640px) {
  .animation-area .animation-arrows #arrow2 {
    position: absolute;
    width: 3.78182%;
    top: 35.06667%;
    left: 88.66667%;
  }
}
@media (min-width: 641px) {
  .animation-area .animation-arrows #arrow3 {
    position: absolute;
    top: 49%;
    left: 88%;
    transform: rotate(95deg);
  }
}
@media (max-width: 640px) {
  .animation-area .animation-arrows #arrow3 {
    position: absolute;
    width: 3.29697%;
    top: 60.93333%;
    left: 88.93333%;
  }
}
@media (min-width: 641px) {
  .animation-area .animation-arrows #arrow4 {
    position: absolute;
    top: 75%;
    left: 78%;
    transform: rotate(160deg);
  }
}
@media (max-width: 640px) {
  .animation-area .animation-arrows #arrow4 {
    position: absolute;
    width: 4.36364%;
    top: 82.4%;
    left: 73.73333%;
  }
}
@media (min-width: 641px) {
  .animation-area .animation-arrows #arrow5 {
    position: absolute;
    top: 85%;
    left: 59%;
    transform: rotate(173deg);
  }
}
@media (max-width: 640px) {
  .animation-area .animation-arrows #arrow5 {
    position: absolute;
    width: 5.33333%;
    top: 92.8%;
    left: 46.8%;
  }
}
@media (min-width: 641px) {
  .animation-area .animation-arrows #arrow6 {
    position: absolute;
    top: 85%;
    left: 39.5%;
    transform: rotate(-175deg);
  }
}
@media (max-width: 640px) {
  .animation-area .animation-arrows #arrow6 {
    position: absolute;
    width: 4.26667%;
    top: 81.6%;
    left: 20%;
  }
}
@media (min-width: 641px) {
  .animation-area .animation-arrows #arrow7 {
    position: absolute;
    top: 75%;
    left: 19%;
    transform: rotate(-160deg);
  }
}
@media (max-width: 640px) {
  .animation-area .animation-arrows #arrow7 {
    position: absolute;
    width: 3.49091%;
    top: 60.8%;
    left: 5.86667%;
  }
}
@media (min-width: 641px) {
  .animation-area .animation-arrows #arrow8 {
    position: absolute;
    top: 47%;
    left: 10%;
    transform: rotate(-92deg);
  }
}
@media (max-width: 640px) {
  .animation-area .animation-arrows #arrow8 {
    position: absolute;
    width: 3.39394%;
    top: 36%;
    left: 6%;
  }
}
@media (min-width: 641px) {
  .animation-area .animation-arrows #arrow9 {
    position: absolute;
    top: 18%;
    left: 20%;
    transform: rotate(-26deg);
  }
}
@media (max-width: 640px) {
  .animation-area .animation-arrows #arrow9 {
    position: absolute;
    width: 4.46061%;
    top: 16%;
    left: 20.13333%;
  }
}
@media (min-width: 641px) {
  .animation-area .animation-arrows #arrow10 {
    position: absolute;
    top: 10%;
    left: 39.5%;
    transform: rotate(-5deg);
  }
}
@media (max-width: 640px) {
  .animation-area .animation-arrows #arrow10 {
    position: absolute;
    width: 5.33333%;
    top: 6.26667%;
    left: 47.6%;
  }
}
.animation-area .animation-icons .icon-area {
  -webkit-tap-highlight-color: transparent;
  /*
  			.start
  			{
  				transition-delay:0s;
  				transition-delay:0.7s;
  				transition: 0.3s ease-out;
  			}
  */
}
.animation-area .animation-icons .icon-area .icon {
  filter: alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
  transform: scale(0.7);
  transition: 0.3s ease-out;
  transition-delay: 1s;
  transform-origin: center;
}
.animation-area .animation-icons .icon-area .icon-txt {
  filter: alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
  transition: 0.3s ease-out;
  transition-delay: 1s;
}
@media (max-width: 640px) {
  .animation-area .animation-icons .icon-area .icon-txt {
    display: none;
  }
}
.animation-area .animation-icons .icon-area #icon6 {
  transform-origin: center bottom;
}
.animation-area .animation-icons .active .icon {
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  opacity: 1;
  transform: scale(1);
}
.animation-area .animation-icons .active .icon-txt {
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  opacity: 1;
}
.animation-area .animation-icons .not-delay .icon, .animation-area .animation-icons .not-delay .icon-txt {
  transition-delay: 0s;
}
@media (min-width: 641px) {
  .animation-area .animation-icons #icon1 {
    position: absolute;
    width: 6.06061%;
    top: 1.64234%;
    left: 46.9697%;
    left: 0;
    right: 0;
    margin: auto;
  }
}
@media (max-width: 640px) {
  .animation-area .animation-icons #icon1 {
    position: absolute;
    width: 3.2%;
    top: 5.6%;
    left: 63.33333%;
  }
}
.animation-area .animation-icons #icon1-txt {
  position: absolute;
  width: 6.43939%;
  top: 14.23358%;
  left: 46.875%;
}
.animation-area .animation-icons #icon2 {
  position: absolute;
  width: 8.14394%;
  top: 7.11679%;
  left: 65.90909%;
}
@media (max-width: 640px) {
  .animation-area .animation-icons #icon2 {
    position: absolute;
    width: 11.86667%;
    top: 23.6%;
    left: 79.73333%;
  }
}
.animation-area .animation-icons #icon2-txt {
  position: absolute;
  width: 4.16667%;
  top: 17.70073%;
  left: 67.99242%;
}
.animation-area .animation-icons #icon3 {
  position: absolute;
  width: 9.09091%;
  top: 25.54745%;
  left: 83.80682%;
}
@media (max-width: 640px) {
  .animation-area .animation-icons #icon3 {
    position: absolute;
    width: 8.66667%;
    top: 46.26667%;
    left: 88.8%;
  }
}
.animation-area .animation-icons #icon3-txt {
  position: absolute;
  width: 8.42803%;
  top: 35.76642%;
  left: 84.09091%;
}
.animation-area .animation-icons #icon4 {
  position: absolute;
  width: 8.33333%;
  top: 56.0219%;
  left: 83.80682%;
}
@media (max-width: 640px) {
  .animation-area .animation-icons #icon4 {
    position: absolute;
    width: 11.86667%;
    top: 71.46667%;
    left: 80%;
  }
}
.animation-area .animation-icons #icon4-txt {
  position: absolute;
  width: 7.00758%;
  top: 63.86861%;
  left: 84.94318%;
}
.animation-area .animation-icons #icon5 {
  position: absolute;
  width: 6.25%;
  top: 75.54745%;
  left: 66.85606%;
}
@media (max-width: 640px) {
  .animation-area .animation-icons #icon5 {
    position: absolute;
    width: 8.8%;
    top: 87.46667%;
    left: 60%;
  }
}
.animation-area .animation-icons #icon5-txt {
  position: absolute;
  width: 2.74621%;
  top: 85.76642%;
  left: 68.75%;
}
.animation-area .animation-icons #icon6 {
  position: absolute;
  width: 7.57576%;
  top: 79.92701%;
  left: 46.21212%;
}
@media (min-width: 641px) {
  .animation-area .animation-icons #icon6 {
    left: 0;
    right: 0;
    margin: auto;
  }
}
@media (max-width: 640px) {
  .animation-area .animation-icons #icon6 {
    position: absolute;
    width: 6.4%;
    top: 87.6%;
    left: 31.73333%;
  }
}
.animation-area .animation-icons #icon6-txt {
  position: absolute;
  width: 6.81818%;
  top: 93.24818%;
  left: 46.59091%;
}
.animation-area .animation-icons #icon7 {
  position: absolute;
  width: 7.67045%;
  top: 77.91971%;
  left: 26.32576%;
}
@media (max-width: 640px) {
  .animation-area .animation-icons #icon7 {
    position: absolute;
    width: 10.8%;
    top: 72%;
    left: 8.4%;
  }
}
.animation-area .animation-icons #icon7-txt {
  position: absolute;
  width: 4.16667%;
  top: 85.94891%;
  left: 28.2197%;
}
.animation-area .animation-icons #icon8 {
  position: absolute;
  width: 8.23864%;
  top: 56.38686%;
  left: 7.10227%;
}
@media (max-width: 640px) {
  .animation-area .animation-icons #icon8 {
    position: absolute;
    width: 11.2%;
    top: 47.6%;
    left: 0.93333%;
  }
}
.animation-area .animation-icons #icon8-txt {
  position: absolute;
  width: 7.00758%;
  top: 63.86861%;
  left: 8.23864%;
}
.animation-area .animation-icons #icon9 {
  position: absolute;
  width: 7.67045%;
  top: 22.81022%;
  left: 8.99621%;
}
@media (max-width: 640px) {
  .animation-area .animation-icons #icon9 {
    position: absolute;
    width: 11.2%;
    top: 22.26667%;
    left: 8.4%;
  }
}
.animation-area .animation-icons #icon9-txt {
  position: absolute;
  width: 5.58712%;
  top: 34.12409%;
  left: 8.99621%;
}
.animation-area .animation-icons #icon10 {
  position: absolute;
  width: 7.76515%;
  top: 5.47445%;
  left: 26.70455%;
}
@media (max-width: 640px) {
  .animation-area .animation-icons #icon10 {
    position: absolute;
    width: 11.73333%;
    top: 6.26667%;
    left: 29.6%;
  }
}
.animation-area .animation-icons #icon10-txt {
  position: absolute;
  width: 7.00758%;
  top: 16.24088%;
  left: 26.98864%;
}
.animation-area .more-link a {
  margin-left: auto;
  color: #221815;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
  transition: 0.3s ease-out;
}
@media (max-width: 640px) {
  .animation-area .more-link {
    background: white;
  }
  .animation-area .more-link a {
    font-size: 12px;
  }
}
@media (min-width: 641px) {
  .animation-area .more-link {
    position: absolute;
    width: calc(100% - 16px);
    max-width: 980px;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 50px;
    text-align: right;
  }
}
@media (min-width: 641px) and (max-width: 960px) {
  .animation-area .more-link {
    bottom: 10%;
  }
}
@media (min-width: 641px) {
  .animation-area .more-link a {
    border: solid 1px #434343;
    margin-left: auto;
    display: inline-block;
    width: 16.32653%;
    max-width: 160px;
    color: #221815;
    font-size: 14px;
    border: solid 2px #434343;
    line-height: 46px;
    height: 49px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 1.53061%;
    background: url(../images/train/arrow-black@pc.png) no-repeat right 10% center;
    background-size: 4.375%;
    text-align: left;
    letter-spacing: 0.06em;
  }
}
@media (max-width: 640px) {
  .animation-area .more-link {
    border-bottom: 1px solid black;
  }
  .animation-area .more-link a {
    line-height: 50px;
    display: block;
    background: url(../images/train/arrow-black.png) no-repeat right 27px center;
    background-size: 5px;
  }
  .animation-area .more-link a img {
    width: 81px;
    margin: auto;
  }
}

.train-section {
  max-width: 1040px;
  margin: auto;
}

#Cont2 {
  letter-spacing: 0.06em;
}
#Cont2 .w1060 {
  width: 100%;
  max-width: 1060px;
  margin: auto;
}
#Cont2 .w1040 {
  width: 100%;
  max-width: 1040px;
  margin: auto;
}
#Cont2 .w--full {
  width: 100%;
}
#Cont2 .wrapper {
  padding-top: 50px;
  overflow: hidden;
}
#Cont2 .shadow-box {
  box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.09);
}
@media (max-width: 640px) {
  #Cont2 .sp-shadow {
    box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.09);
  }
}
#Cont2 a {
  transition: 0.3s ease-out;
  display: inline-block;
  -webkit-backface-visibility: hidden;
  /* 追加 */
  backface-visibility: hidden;
  /* 追加 */
}
#Cont2 a:hover {
  opacity: .8;
  -webkit-backface-visibility: hidden;
  /* 追加 */
  backface-visibility: hidden;
  /* 追加 */
}
#Cont2 .insta-photos a:hover {
  opacity: .7;
  -webkit-backface-visibility: hidden;
  /* 追加 */
  backface-visibility: hidden;
  /* 追加 */
}
#Cont2 .insta-photos a:hover img {
  opacity: 1 !important;
}

#Cont2 .train-section {
  position: relative;
}
#Cont2 .train-section .train-section__ttl {
  width: 52.89855%;
  margin: 19px auto;
}
@media (min-width: 641px) {
  #Cont2 .train-section .train-section__ttl {
    position: absolute;
    top: 4.91803%;
    left: 0;
    right: 0;
    margin: auto;
    width: 26.15385%;
  }
}
#Cont2 .train-section #train-other {
  position: absolute;
  width: 26.63462%;
  left: 38.55769%;
  top: 51.14754%;
  margin: auto;
}
@media (max-width: 640px) {
  #Cont2 .train-section .train-area {
    padding: 0 15px;
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
  }
  #Cont2 .train-section .train-area li {
    width: 46.95652%;
  }
  #Cont2 .train-section .train-area li .train-pic__area {
    position: relative;
  }
  #Cont2 .train-section .train-area li a {
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  #Cont2 .train-section .train-area li .sp-reverse .train-txt__area {
    order: 1;
  }
  #Cont2 .train-section .train-area li .sp-reverse .train-pic__area {
    order: 2;
  }
}
@media (min-width: 641px) {
  #Cont2 .train-section li {
    width: 31.15385%;
    position: absolute;
    z-index: 1;
  }
  #Cont2 .train-section li .train-txt__area img {
    position: absolute;
  }
}
#Cont2 .train-section li .train-pic__area img:nth-child(n+2) {
  position: absolute;
}
#Cont2 .train-section li .train-pic {
  left: 0;
  top: 0;
  visibility: hidden;
}
#Cont2 .train-section li .active {
  animation-name: fadeAnimation;
  animation-duration: 2.4s;
  animation-timing-function: ease;
  visibility: visible;
}
#Cont2 .train-section li img.train1-txt {
  bottom: -28px;
  left: 30px;
}
#Cont2 .train-section li img.train2-txt {
  bottom: -46px;
  right: 5px;
}
#Cont2 .train-section li img.train3-txt {
  bottom: -36px;
  left: 68.3871%;
}
#Cont2 .train-section li img.train4-txt {
  bottom: -6px;
  right: 16%;
}
@media (max-width: 640px) {
  #Cont2 .train-section #train1 .train-txt__area {
    width: 79.62963%;
    transform: translateY(3px);
  }
  #Cont2 .train-section #train2 .train-txt__area, #Cont2 .train-section #train3 .train-txt__area {
    padding-left: 4.01235%;
    transform: translateY(-1px);
  }
  #Cont2 .train-section #train3 {
    width: 44.49275%;
  }
  #Cont2 .train-section #train3 .train-txt__area {
    width: 84.03909%;
    transform: translateY(-3px);
  }
  #Cont2 .train-section #train4 {
    width: 41.44928%;
  }
  #Cont2 .train-section #train4 .train-txt__area {
    transform: translate(-28.57143%, -52.42718%);
  }
  #Cont2 .train-section #train4 .train4-txt {
    max-width: 122.37762%;
  }
}
@media (min-width: 641px) {
  #Cont2 .train-section #train1 {
    left: 0;
    top: 0;
  }
  #Cont2 .train-section #train2 {
    right: 0;
    top: 0;
    width: 29.80769%;
    /*
    		.active
    		{
    			animation-delay: 2.4s * 1;
    		}
    */
  }
  #Cont2 .train-section #train3 {
    left: 0;
    bottom: 27px;
    width: 28.84615%;
    /*
    		.active
    		{
    			animation-delay: 2.4s * 2;
    		}
    */
  }
  #Cont2 .train-section #train4 {
    right: 0;
    bottom: 0;
    width: 26.44231%;
    padding-bottom: 2.88462%;
    /*
    		.active
    		{
    			animation-delay: 2.4s * 3;
    		}
    */
  }
  #Cont2 .train-section #train4 .train4-txt {
    max-width: 111.67883%;
  }
}

#Cont2 .recipe-section {
  padding-bottom: 80px;
}
@media (max-width: 640px) {
  #Cont2 .recipe-section {
    padding-bottom: 50px;
  }
}
#Cont2 .recipe-section .section3-banner {
  margin-bottom: 63px;
}
@media (max-width: 640px) {
  #Cont2 .recipe-section .section3-banner {
    margin-bottom: 30px;
  }
}
#Cont2 .recipe-section .section3-banner a:hover {
  opacity: 0.7;
  -webkit-backface-visibility: hidden;
  /* 追加 */
  backface-visibility: hidden;
  /* 追加 */
}
#Cont2 .recipe-section .recipe__title {
  font-size: 26px;
  text-align: center;
  letter-spacing: 0.1em;
  color: #00429a;
  background: url(../images/train/recipe-ttl__bg.png?ver=2) no-repeat center center;
  margin-bottom: 45px;
}
@media (max-width: 640px) {
  #Cont2 .recipe-section .recipe__title {
    font-size: 4.53333vw;
    line-height: 129.41176%;
    background: url(../images/train/recipe-ttl__bg_side.png) no-repeat left center, url(../images/train/recipe-ttl__bg_side.png) no-repeat right center;
    background-size: 24.78261%, 24.78261%;
    width: calc(100% - 30px);
    margin: 0 auto 30px;
  }
}
#Cont2 .recipe-section .recipe__title_ver2 {
  font-size: 26px;
  text-align: center;
  letter-spacing: 0.1em;
  color: #00429a;
  background: url(../images/train/recipe-ttl__bg_side@pc.png) no-repeat left 3.64583% center, url(../images/train/recipe-ttl__bg_side@pc.png) no-repeat right 3.64583% center;
  background-size: 21.04167%, 21.04167%;
  margin-bottom: 45px;
}
@media (max-width: 960px) {
  #Cont2 .recipe-section .recipe__title_ver2 {
    font-size: 2.70833vw;
  }
}
@media (max-width: 640px) {
  #Cont2 .recipe-section .recipe__title_ver2 {
    font-size: 4.53333vw;
    line-height: 129.41176%;
    background: url(../images/train/recipe-ttl__bg_side.png) no-repeat left center, url(../images/train/recipe-ttl__bg_side.png) no-repeat right center;
    background-size: 24.78261%, 24.78261%;
    /*
    			background: url(../images/train/recipe-ttl__bg@sp.png) no-repeat center center;
    			background-size: 100%;
    */
    width: calc(100% - 30px);
    margin: 0 auto 30px;
  }
}
#Cont2 .recipe-section .recipe-list {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
}
#Cont2 .recipe-section .recipe-list a {
  text-decoration: none;
  color: black;
  border: solid 1px #eeeeee;
  outline: none;
  color: #4a4a4a;
  line-height: 1.25;
}
@media (max-width: 640px) {
  #Cont2 .recipe-section .recipe-list {
    padding: 0 15px;
    justify-content: space-between;
  }
  #Cont2 .recipe-section .recipe-list li {
    width: 47.53623%;
    margin-bottom: 14px;
  }
  #Cont2 .recipe-section .recipe-list li:last-child {
    margin: 0 auto;
  }
  #Cont2 .recipe-section .recipe-list .text_bloc {
    padding: 6px 8px;
    text-align: left;
    font-size: 12px;
  }
}
@media (min-width: 641px) {
  #Cont2 .recipe-section .recipe-list {
    max-width: 960px;
    margin: auto;
    padding: 0 18px;
    justify-content: center;
  }
  #Cont2 .recipe-section .recipe-list li {
    margin: 0 1.66667%;
    text-align: center;
    width: 27.70833%;
  }
  #Cont2 .recipe-section .recipe-list li img {
    width: 100%;
  }
  #Cont2 .recipe-section .recipe-list li .text_bloc {
    padding: 11px 8px;
    text-align: left;
    font-size: 14px;
  }
}
#Cont2 .recipe-section .more-area {
  margin-top: 34px;
  text-align: center;
  font-size: 16px;
  width: 290px;
  margin: 34px auto 0;
}
#Cont2 .recipe-section .more-area a {
  padding: 13px 0 12px;
  display: block;
  border: solid 2px #00429a;
  color: #00429a;
  background: url(../images/train/recipe-arrow@sp.png) no-repeat right 15px center;
  background-size: 24px;
  text-decoration: none;
}
@media (min-width: 641px) {
  #Cont2 .recipe-section .more-area a {
    text-indent: -8px;
  }
}
@media (max-width: 640px) {
  #Cont2 .recipe-section .more-area a {
    background: url(../images/train/recipe-arrow@sp.png) no-repeat right 15px center;
    background-size: 16px;
    font-size: 12px;
    width: 240px;
    margin: auto;
  }
}

.insta-section {
  background: #f7f7f7;
  /*
  	padding-top: 70px;
  	padding-bottom: 90px;
  */
  padding: 70px 16px 90px;
}
@media (max-width: 640px) {
  .insta-section {
    padding: 35px 15px 45px;
  }
}
.insta-section .insta-ttl {
  background: url(../images/train/insta-logo.png) no-repeat left center;
  margin-bottom: 40px;
  font-size: 18px;
  padding-left: 55px;
  line-height: 44px;
  background-size: auto 100%;
  margin-bottom: 40px;
  letter-spacing: 0.06em;
}
@media (max-width: 640px) {
  .insta-section .insta-ttl {
    background-size: 20px;
    padding-left: 27px;
    font-size: 14px;
    margin-bottom: 20px;
    line-height: 20px;
  }
}
.insta-section .inner-block {
  max-width: 960px;
  margin: auto;
}

@media (max-width: 768px) {
  .sns-area {
    padding: 42px 15px 22px;
  }

}
@media (min-width: 641px) {
  .sns-area {
    padding: 80px 0 0;
    width: calc(100% - 32px);
    max-width: 960px;
    margin: auto;
  }
}
@media (min-width: 641px) {
  .sns-area .sns-list {
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
  }
.sns-area .sns-list a {
  padding: 0;
}
}
.sns-area .sns-list a {
  display: block;
  color: #221815;
  text-decoration: none;
  padding: 4.34783%;
}

@media (min-width: 641px) {
  .sns-area .sns-list li {
   /* border: solid 2px black;*/ 
    width: 49%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  .sns-area .sns-list li a {
    width: 100%;
    box-sizing: border-box;
   /*padding: 32px 12.2449% 27px 9.18367%;*/ 
  }
}
.sns-area .sns-list .sns--fb {
  background: url(../images/train/fb-logo.jpg) no-repeat right top;
}
@media (max-width: 640px) {
  .sns-area .sns-list .sns--fb {
    background-size: 30px;
  }
.sns-area .sns-list .sns--insta {
  background: url(../images/train/insta-logo.jpg) no-repeat right top;
}
.sns-area .sns-list .sns--tw {
  background: url(../images/train/tw-logo.jpg) no-repeat right top;
}	
	
}

@media (max-width: 640px) {
  .sns-area .sns-list .sns--insta {
    background-size: 30px;
  }
.sns-area .sns-list li {
  background: white;
  border: solid 1px black;
}	
}

@media (max-width: 640px) {
  .sns-area .sns-list .sns--tw {
    background-size: 30px;
  }
}
.sns-area .sns-list .sns-block {
  line-height: 1.71429;
}
@media (max-width: 960px) {
  .sns-area .sns-list .sns-block {
    font-size: 1.45833vw;
    margin-bottom: 1em;
  }
}
@media (max-width: 640px) {
  .sns-area .sns-list .sns-block {
    font-size: 12px;
  }
}
.sns-area .sns-list .sns-block__ttl {
  font-size: 18px;
  margin-bottom: 18px;
}
@media (max-width: 960px) {
  .sns-area .sns-list .sns-block__ttl {
    font-size: 1.875vw;
    margin-bottom: 1em;
  }
}
@media (max-width: 640px) {
  .sns-area .sns-list .sns-block__ttl {
    font-size: 14px;
    margin-bottom: .5em;
  }
}

.overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  z-index: 10000;
}

@media (max-width: 640px) {
  .modal-area__wrap--sp {
    position: relative;
  }
}

.modal-area {
  display: none;
  background: white;
  z-index: 10001;
  max-width: 960px;
  box-sizing: border-box;
}
@media (max-width: 640px) {
  .modal-area {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
  }
  .modal-area .modal-area__inner {
    display: -webkit-flex;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
  }
  .modal-area .modal-txt {
    height: calc(100% - 100px);
  }
  .modal-area .modal-txt img {
    height: 100%;
    margin: auto;
  }
}
@media (min-width: 641px) {
  .modal-area {
    position: absolute;
    width: calc(100% - 40px);
    top: 118px;
    padding: 80px 0;
    left: 0;
    right: 0;
    margin: auto;
  }
  .modal-area .modal-txt img {
    margin: auto;
  }
}
.modal-area .modal-txt {
  width: 93.33333%;
  margin: auto;
}
.modal-area .modal-close {
  position: absolute;
  right: 0;
  top: -30px;
  display: block;
  width: 19px;
  height: 19px;
  background: url(../images/btn_close_pc.png) no-repeat;
  background-size: 100%;
}
@media (max-width: 640px) {
  .modal-area .modal-close {
    right: 30px;
    top: 30px;
    background: url(../images/train/modal-close@sp.png) no-repeat;
    background-size: 100%;
  }
}
.modal-area .modal-close:hover {
  opacity: .8;
  -webkit-backface-visibility: hidden;
  /* 追加 */
  backface-visibility: hidden;
  /* 追加 */
}

@keyframes fadeAnimation {
  0% {
    transform: scale(1.1);
    opacity: 0.1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
    visibility: visible;
  }
}
/*-----------------------------------------
Tabi CSS
-------------------------------------------*/
#Cont2 .tabi-page {
  width: calc(100% - 32px);
  max-width: 960px;
  padding-top: 114px;
  margin: auto;
}
#Cont2 .tabi-page .page-title {
  text-align: center;
  margin-bottom: 74px;
}
#Cont2 .tabi-page .page-title img {
  margin: auto;
}
@media (max-width: 640px) {
  #Cont2 .tabi-page {
    padding: 50px 15px 0;
  }
  #Cont2 .tabi-page .page-title {
    margin: auto;
    margin-bottom: 42px;
  }
  #Cont2 .tabi-page .tabi-box__pic {
    margin-bottom: 20px;
  }
  #Cont2 .tabi-page .tabi-box {
    margin-bottom: 40px;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page .flex {
    display: flex;
    display: -webkit-flex;
  }
  #Cont2 .tabi-page .tabi-box.flex {
    align-items: center;
  }
  #Cont2 .tabi-page .tabi-box.flex .tabi-box__pic {
    margin-right: 3.125%;
    width: 64.58333%;
  }
  #Cont2 .tabi-page .tabi-box.flex .tabi-box__txt {
    width: 32.29167%;
  }
  #Cont2 .tabi-page .tabi-box3 {
    margin: 120px 0;
  }
}
#Cont2 .tabi-page .tabi-box {
  margin-bottom: 40px;
  visibility: hidden;
}
#Cont2 .tabi-page .fade {
  visibility: hidden;
}
#Cont2 .tabi-page .fade.fadeIn {
  visibility: visible;
  animation-name: fadeIn;
  animation-duration: 1s;
}
@media (max-width: 640px) {
  #Cont2 .tabi-page .fade-sp {
    visibility: hidden;
    animation-fill-mode: forwards;
  }
  #Cont2 .tabi-page .fade-sp.fadeIn {
    visibility: visible;
    animation-name: fadeIn;
    animation-duration: 1s;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page .fade-pc,
  #Cont2 .tabi-page .fade3 {
    visibility: hidden;
    animation-fill-mode: forwards;
  }
  #Cont2 .tabi-page .fade1 {
    animation-delay: 0s;
  }
  #Cont2 .tabi-page .fade2 {
    opacity: 0;
    animation-delay: .5s;
  }
  #Cont2 .tabi-page .fade3 {
    opacity: 0;
    animation-delay: .3s;
  }
  #Cont2 .tabi-page .fade-pc.fadeIn,
  #Cont2 .tabi-page .fade3.fadeIn {
    visibility: visible;
    animation-name: fadeIn;
    animation-duration: 1s;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page .tabi-box--style2 {
    position: relative;
  }
  #Cont2 .tabi-page .tabi-box--style2 .tabi-box__pic {
    margin-left: auto;
    width: 64.58333%;
  }
  #Cont2 .tabi-page .tabi-box--style2 .tabi-box__txt {
    width: 41.35417%;
    position: absolute;
    bottom: 0;
    left: 0;
  }
  #Cont2 .tabi-page .tabi-box6 .tabi-box__txt {
    width: 41.35417%;
  }
}
#Cont2 .tabi-page .img-center img {
  margin: auto;
}
#Cont2 .tabi-page .tabi--last {
  margin: 60px 0;
}
#Cont2 .tabi-page .tabi--last img {
  width: 93.18841%;
}
@media (min-width: 641px) {
  #Cont2 .tabi-page .tabi--last {
    margin: 120px 0;
  }
  #Cont2 .tabi-page .tabi--last img {
    width: 63.54167%;
  }
}
#Cont2 .tabi-page .tabi-links {
  justify-content: space-between;
  max-width: 960px;
  margin: auto;
}
@media (max-width: 960px) {
  #Cont2 .tabi-page .tabi-links {
    letter-spacing: 0;
  }
}
@media (max-width: 640px) {
  #Cont2 .tabi-page .tabi-links li {
    margin-bottom: 20px;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page .tabi-links li {
    width: 22.5%;
  }
}
#Cont2 .tabi-page .tabi-links li a {
  display: block;
  border: solid 2px #434343;
  height: 54px;
  line-height: 53px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  font-size: 16px;
  letter-spacing: 0.08em;
  color: black;
  text-decoration: none;
  background: url("../images/ico_arrow01.png") no-repeat right 11% center;
  background-size: 8px;
}
@media (max-width: 960px) {
  #Cont2 .tabi-page .tabi-links li a {
    letter-spacing: 0;
    font-size: 1.66667vw;
    background-size: 3.7037%;
    line-height: 1.3;
    padding: 10% 0;
    line-height: 1;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
@media (max-width: 640px) {
  #Cont2 .tabi-page .tabi-links li a {
    font-size: 11px;
    background-size: 5px;
    background-position: right 13px center;
    height: 45px;
    line-height: 44px;
    padding: 0;
  }
}
#Cont2 .tabi-page .tabi-links li .letter-spane--0 {
  letter-spacing: 0;
}
#Cont2 .tabi-page .tabi-links li .btn--on {
  background: url(../images/train/tabi/on-ptn.png);
}
@media (max-width: 640px) {
  #Cont2 .tabi-page .tabi-links li .btn--on {
    background: url(../images/train/tabi/on-ptn@sp.png);
    background-size: 100% 100%;
  }
}

@media (min-width: 641px) {
  #Cont2 .tabi-page1.tabi-page .tabi-box4 {
    position: relative;
  }
  #Cont2 .tabi-page1.tabi-page .tabi-box4 .tabi-box__pic {
    margin-left: auto;
    width: 64.58333%;
  }
  #Cont2 .tabi-page1.tabi-page .tabi-box4 .tabi-box__txt {
    width: 41.35417%;
    position: absolute;
    bottom: 0;
    left: 0;
  }
}
@media (max-width: 640px) {
  #Cont2 .tabi-page1.tabi-page .page-title {
    width: 82.17391%;
  }
  #Cont2 .tabi-page1.tabi-page .tabi-box1 .tabi-box__txt {
    width: 82.89855%;
  }
  #Cont2 .tabi-page1.tabi-page .tabi-box2 .tabi-box__txt {
    width: 73.04348%;
  }
  #Cont2 .tabi-page1.tabi-page .tabi-box3 {
    margin: 80px 0;
    padding-left: 10.14493%;
    padding-right: 6.37681%;
  }
  #Cont2 .tabi-page1.tabi-page .tabi-box4 .tabi-box__txt {
    width: 81.01449%;
  }
  #Cont2 .tabi-page1.tabi-page .tabi-box5 .tabi-box__txt {
    width: 80.57971%;
  }
  #Cont2 .tabi-page1.tabi-page .tabi-box6 .tabi-box__txt {
    width: 83.76812%;
  }
}

#Cont2 .tabi-page.tabi-page3 .tabi-box3 {
  margin-bottom: 40px;
  margin-top: 0;
}
@media (max-width: 640px) {
  #Cont2 .tabi-page.tabi-page3 .page-title {
    width: 83.33333%;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box1 .tabi-box__txt {
    width: 73.91304%;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box2 .tabi-box__txt {
    width: 80.14493%;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box3 .tabi-box__txt {
    width: 69.13043%;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box4 .tabi-box__txt {
    width: 92.89855%;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box5 .tabi-box__txt {
    width: 60.72464%;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box6 .tabi-box__txt {
    width: 89.13043%;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page.tabi-page3 .flex--reverse {
    flex-direction: row-reverse;
  }
  #Cont2 .tabi-page.tabi-page3 .flex--reverse .tabi-box__pic {
    margin-right: 0;
    margin-left: 3.125%;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box--style3 {
    position: relative;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box--style3 .tabi-box__pic {
    width: 52.08333%;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box1 {
    margin-bottom: 0;
    z-index: 1;
    align-items: flex-start;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box1 .tabi-box__txt {
    padding-top: 40px;
    width: 40.41667%;
  }
}
@media (min-width: 641px) and (max-width: 960px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box1 .tabi-box__txt {
    padding-top: 4.16667vw;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box2 {
    align-items: flex-end;
    margin-top: -145px;
  }
}
@media (min-width: 641px) and (max-width: 960px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box2 {
    margin-top: -15.10417vw;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box2 .tabi-box__txt {
    width: 35.20833%;
    padding-bottom: 40px;
  }
}
@media (min-width: 641px) and (max-width: 960px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box2 .tabi-box__txt {
    padding-bottom: 4.16667vw;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box3 .tabi-box__txt {
    width: 30.41667%;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box4 {
    margin-bottom: 0;
    align-items: flex-start;
    z-index: 1;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi-box4 .tabi-box__txt {
    width: 27.29167%;
    padding-top: 40px;
  }
}
@media (min-width: 641px) and (max-width: 960px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box4 .tabi-box__txt {
    padding-top: 4.16667vw;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box5 {
    align-items: flex-end;
    margin-top: -127px;
  }
}
@media (min-width: 641px) and (max-width: 960px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box5 {
    margin-top: -13.22917vw;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box5 .tabi-box__txt {
    width: 26.77083%;
    padding-bottom: 72px;
  }
}
@media (min-width: 641px) and (max-width: 960px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box5 .tabi-box__txt {
    padding-bottom: 7.5vw;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page.tabi-page3 .tabi-box6 .tabi-box__txt {
    width: 42.08333%;
  }
  #Cont2 .tabi-page.tabi-page3 .tabi--last img {
    width: 52.8125%;
  }
}

#Cont2 .tabi-page4.tabi-page .tabi-box1 .tabi-box__txt {
  width: 78.55072%;
}
#Cont2 .tabi-page4.tabi-page .tabi-box2 {
  margin: 56px 0;
}
#Cont2 .tabi-page4.tabi-page .tabi-box3 .tabi-box__txt {
  width: 62.17391%;
}
#Cont2 .tabi-page4.tabi-page .tabi-box--end {
  margin-bottom: 60px;
}
#Cont2 .tabi-page4.tabi-page .tabi-box--end .tabi-box__txt {
  width: 90.14493%;
}
@media (min-width: 641px) {
  #Cont2 .tabi-page4.tabi-page .tabi-box1 .tabi-box__pic {
    width: 66.66667%;
  }
  #Cont2 .tabi-page4.tabi-page .tabi-box1 .tabi-box__txt {
    width: 29.79167%;
  }
  #Cont2 .tabi-page4.tabi-page .tabi-box2 {
    margin: 120px 0;
  }
  #Cont2 .tabi-page4.tabi-page .tabi-box2 img {
    width: 77.5%;
  }
  #Cont2 .tabi-page4.tabi-page .tabi-box3 .tabi-box__txt {
    width: 27.29167%;
  }
  #Cont2 .tabi-page4.tabi-page .tabi-box--end {
    margin-bottom: 90px;
    position: relative;
  }
  #Cont2 .tabi-page4.tabi-page .tabi-box--end .tabi-box__txt {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 41.66667%;
  }
  #Cont2 .tabi-page4.tabi-page .flex--reverse {
    flex-direction: row-reverse;
  }
  #Cont2 .tabi-page4.tabi-page .flex--reverse .tabi-box__pic {
    margin-right: 0;
    margin-left: 3.125%;
  }
}

#Cont2 .tabi-page2.tabi-page {
  max-width: 1080px;
  margin: auto;
}
@media (min-width: 641px) {
  #Cont2 .tabi-page2.tabi-page .page-title {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 4.16667%;
  }
}
#Cont2 .tabi-page2.tabi-page .page-title img {
  margin: 0;
}
#Cont2 .tabi-page2.tabi-page .tabi-box1 {
  position: relative;
  margin-bottom: 72px;
}
#Cont2 .tabi-page2.tabi-page .tabi-box1 .tabi-box__txt {
  width: 55.21739%;
  position: absolute;
  left: 0;
  bottom: 0;
}
#Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__block {
  margin-bottom: 35px;
}
#Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__txt {
  width: 74.34783%;
}
#Cont2 .tabi-page2.tabi-page .tabi-box2 .fade2 .tabi-box__txt {
  width: 57.82609%;
}
#Cont2 .tabi-page2.tabi-page .tabi-box2 .fade3 .tabi-box__txt {
  width: 85.36232%;
}
#Cont2 .tabi-page2.tabi-page .tabi-box3 {
  margin-bottom: 60px;
}
#Cont2 .tabi-page2.tabi-page .tabi-box3 .tabi-box__txt {
  width: 74.78261%;
}
#Cont2 .tabi-page2.tabi-page .tabi-box4 .tabi-box__txt {
  width: 82.17391%;
}
#Cont2 .tabi-page2.tabi-page .tabi-box5 .tabi-box__txt {
  width: 77.3913%;
}
@media (max-width: 640px) {
  #Cont2 .tabi-page2.tabi-page .tabi-box2 {
    margin-bottom: 72px;
  }
}
@media (min-width: 641px) {
  #Cont2 .tabi-page2.tabi-page .tabi-box {
    margin-bottom: 108px;
    position: relative;
  }
  #Cont2 .tabi-page2.tabi-page .w960 {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    width: 88.88889%;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box1 .tabi-box__txt {
    position: absolute;
    bottom: 0;
    width: 28.98148%;
    left: 37.03704%;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box2 {
    width: 93.05556%;
    margin-left: 5.55556%;
    display: -webkit-flex;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__group1 {
    width: 66.16915%;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__group1 .tabi-box__pic {
    margin-bottom: 25px;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__group1 .tabi-box__txt {
    margin-left: auto;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__group1 .tabi-box__txt img {
    margin-right: 10%;
    margin-left: auto;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__group2 {
    width: 29.85075%;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__group2 .tabi-box__pic {
    margin-bottom: 20px;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__group2 .tabi-box__block {
    margin-bottom: 27px;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__group2 .fade2 .tabi-box__txt {
    width: 80.66667%;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box2 .tabi-box__group2 .fade3 .tabi-box__txt {
    width: 60%;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box3 .tabi-box__pic {
    width: 82.08333%;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box3 .tabi-box__txt {
    width: 38.95833%;
    position: absolute;
    right: 0;
    bottom: 0;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box4 {
    position: relative;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box4 .tabi-box__pic {
    width: 82.5%;
    margin-left: auto;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box4 .tabi-box__txt {
    width: 20.52083%;
    position: absolute;
    left: 11.45833%;
    bottom: 20.86331%;
  }
  #Cont2 .tabi-page2.tabi-page .tabi-box5 .tabi-box__txt {
    width: 18.64583%;
  }
  #Cont2 .tabi-page2.tabi-page .tabi--last img {
    width: 50.10417%;
  }
}

#bottomWrapper.mg0 {
  margin-top: 0;
}

@media (max-width: 640px) {
  #Cont2 .solty-page {
    padding-top: 50px;
  }
  #Cont2 .solty-page .section .section__header {
    margin-bottom: 18px;
  }
  #Cont2 .solty-page .page-title {
    margin-bottom: 37px;
    margin-left: 15px;
    width: 74%;
  }
  #Cont2 .solty-page .section {
    width: calc(100% - 30px);
    margin: auto;
    margin-bottom: 55px;
  }
  #Cont2 .solty-page .section1 .section__txt {
    width: 51.5942%;
  }
  #Cont2 .solty-page .section1 .section__pic {
    width: 45.7971%;
    transform: translateY(-12px);
  }
  #Cont2 .solty-page .section2 {
    margin-bottom: 91px;
  }
  #Cont2 .solty-page .section2 .section__content {
    position: relative;
  }
  #Cont2 .solty-page .section2 .section__header {
    width: 84.2029%;
    margin-left: auto;
  }
  #Cont2 .solty-page .section2 .section__txt {
    width: 67.24638%;
    margin-left: auto;
    position: relative;
    z-index: 1;
  }
  #Cont2 .solty-page .section2 .section__pic {
    width: 40.14493%;
    position: absolute;
    top: -10px;
    left: 0;
  }
  #Cont2 .solty-page .section3 {
    padding: 0 15px;
    width: 100%;
    box-sizing: border-box;
    padding-bottom: 61.33333vw;
    background: url(../images/train/solty/img3@sp.jpg) no-repeat center bottom;
    background-size: 100%;
  }
  #Cont2 .solty-page .section3 .section__header {
    width: 80.43478%;
  }
  #Cont2 .solty-page .section4 {
    width: 100%;
    padding: 0 15px 24px;
    box-sizing: border-box;
    background: url(../images/train/solty/img4@sp.jpg) no-repeat left bottom;
    background-size: 49.06667%;
  }
  #Cont2 .solty-page .section4 .section__txt {
    width: 51.30435%;
    margin-left: auto;
  }
  #Cont2 .solty-page .section5 .section__header {
    width: 89.13043%;
  }
  #Cont2 .solty-page .section5 .section__txt {
    margin-bottom: 15px;
  }
  #Cont2 .solty-page .section5 .section__pic {
    margin-bottom: 16px;
  }
  #Cont2 .solty-page .section6 {
    margin-bottom: 0;
    background: url(../images/train/solty/img6@sp.jpg) no-repeat center bottom;
    background-size: 100% auto;
    padding-bottom: 73.86667vw;
  }
  #Cont2 .solty-page .section6 .section__txt {
    width: 85.36232%;
  }
}
#Cont2 .solty-page .flex {
  display: flex;
  display: -webkit-flex;
}
@media (max-width: 640px) {
  #Cont2 .solty-page .flex {
    justify-content: space-between;
  }
}
#Cont2 .solty-page .flex--reverse .section__pic {
  order: 1;
  margin-right: 4.58333%;
}
#Cont2 .solty-page .flex--reverse .section__txt {
  order: 2;
}
#Cont2 .solty-page .recipe-btn {
  text-align: center;
}
#Cont2 .solty-page .recipe-btn a {
  padding: 13px 0 12px;
  display: block;
  border: solid 2px #00429a;
  color: #00429a;
  background: url(../images/train/solty/arrow-blue.png) no-repeat right 15px center;
  text-decoration: none;
  width: 216px;
  margin: auto;
  font-size: 16px;
  letter-spacing: 0.08em;
}
@media (max-width: 640px) {
  #Cont2 .solty-page .recipe-btn a {
    width: 240px;
    font-size: 12px;
    background-size: 4px;
    line-height: 1;
    padding: 16px 0;
  }
}
#Cont2 .solty-page .section {
  visibility: hidden;
}
#Cont2 .solty-page .section.fadeIn {
  visibility: visible;
  animation-name: fadeIn;
  animation-duration: 1s;
}
@media (min-width: 641px) {
  #Cont2 .solty-page {
    padding-top: 100px;
    max-width: 800px;
    width: calc(100% - 32px);
    margin: auto;
  }
  #Cont2 .solty-page .flex-pc {
    display: -webkit-flex;
    display: flex;
  }
  #Cont2 .solty-page .page-title {
    margin-bottom: 80px;
  }
  #Cont2 .solty-page .section {
    margin-bottom: 85px;
  }
  #Cont2 .solty-page .section__header {
    margin-bottom: 40px;
  }
  #Cont2 .solty-page .section1 .section__txt, #Cont2 .solty-page .section3 .section__txt {
    margin-right: 4.58333%;
  }
  #Cont2 .solty-page .section2 .section__content {
    padding-left: 7.8125%;
  }
  #Cont2 .solty-page .section4 .section__content {
    padding-left: 5.20833%;
  }
  #Cont2 .solty-page .section5 p {
    margin-bottom: 40px;
  }
  #Cont2 .solty-page .section5 .section__pic {
    width: 70.625%;
    margin: auto;
    margin-bottom: 40px;
  }
  #Cont2 .solty-page .section:last-child {
    margin-bottom: 0;
  }
  #Cont2 .solty-page .section6 .section__txt {
    position: relative;
    z-index: 1;
  }
  #Cont2 .solty-page .section6 .section__pic {
    position: relative;
  }
  #Cont2 .solty-page .section6 .section__pic {
    transform: translateY(-40px);
  }
  #Cont2 .solty-page .page-title {
    width: 74.25%;
  }
  #Cont2 .solty-page .section1 .section__header {
    width: 86.5%;
  }
  #Cont2 .solty-page .section2 .section__header {
    width: 78.125%;
  }
  #Cont2 .solty-page .section3 .section__header {
    width: 81.375%;
  }
  #Cont2 .solty-page .section5 .section__header {
    width: 86.875%;
  }
  #Cont2 .solty-page .section6 .section__header {
    width: 96.25%;
  }
}

@media screen and (min-width: 961px) {
  #bottomWrapper {
    display: none;
  }

  #Cont2 {
    padding-bottom: 100px;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*
.fadeOut
{
	animation-name: fadeOut;
    animation-duration: 2s;
}



@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}


*/
/*-----------------------------------------
Movie CSS
-------------------------------------------*/
#cboxContent #cboxClose {
  background: url(../images/btn_close_pc.png) no-repeat;
  width: 19px !important;
  height: 19px !important;
  background-size: 19px !important;
  text-indent: -9999px;
}

@media (max-width: 640px) {
  #cboxContent #cboxClose {
    width: 25px !important;
    height: 25px !important;
    background: url(../images/btn_close.png) no-repeat;
    background-size: 25px !important;
    outline: none;
  }
}
/*
@media screen and (max-width: 640px)
{
  #cboxContent #cboxClose {
    right: 0;
    top: -24px !important;
  }
}
*/
.movie-area {
  background: #f3f3f3;
  margin-top: 40px;
  padding: 50px 0;
}
.movie-area a:focus {
  outline: none;
}
@media (min-width: 641px) {
  .movie-area {
    margin-top: 70px;
    padding: 90px 0;
  }
}
.movie-area .slick-arrow {
  display: inline-block;
  width: 38px;
  height: 38px;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media (max-width: 640px) {
  .movie-area .slick-arrow {
    width: 30px;
    width: 30px;
    transform: translateY(25%);
  }
}
.movie-area .slick-prev {
  background: url(../images/train/arrow_left.png) no-repeat;
  background-size: 100%;
  left: 0;
}
.movie-area .slick-next {
  background: url(../images/train/arrow_right.png) no-repeat;
  background-size: 100%;
  right: 0;
}
.movie-area .movie-list {
  width: calc(100% - 32px);
  max-width: 960px;
  margin: auto;
}
.movie-area .movie-ttl {
  text-align: center;
  font-size: 12px;
  margin-bottom: 15px;
  line-height: 1;
}
@media (min-width: 641px) {
  .movie-area .movie-ttl {
    font-size: 20px;
    margin-bottom: 30px;
  }
}
.movie-area .movie-slides {
  padding: 0 36px;
  /*
      a
      {
        width: 100%;
      }
  */
}
.movie-area .movie-slides .slick-slide a {
  width: 100%;
}
.movie-area .movie-slides img {
  width: 100%;
}
@media (min-width: 641px) {
  .movie-area .movie-slides {
    padding: 0 7.08333%;
  }
}