/* common.css */

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

  0. Common
  1. Header
  2. Footer
  3. Main
  4. Index

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

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

/* inview */

.inview {
  padding-top: 55px;
  opacity: 0;
}
.inview.fadeInUp {
  padding-top: 0px;
  opacity: 1;
  transition:all ease 0.7s;
  transition-delay: .25s;
}

.inview2 {
  margin-top: 55px;
  opacity: 0;
}
.inview2.fadeInUp2 {
  margin-top: 0px;
  opacity: 1;
  transition:all ease 0.7s;
  transition-delay: .25s;
}

/* body */

body {
  overflow-x: hidden;
}
.wrapper {
  
}

/* humbBtn */

.humbBtn {
  height: 100px;
  width: 100px;
  position: fixed;
  background-color: #91b7cb;
  right: 25px;
  top: 25px;
  z-index: 8;
  box-shadow: 0px 0px 12px -7px rgba(0,0,0,0.4);
  cursor: pointer;
  opacity: 0;
  transition: all 1.1s cubic-bezier(.86,0,.07,1);
  transition-delay: 1s;
}
.pace-done .humbBtn {
  opacity: 1;
}

.humbBtn:hover {
  box-shadow: 0px 0px 12px -7px rgba(0,0,0,0.8);
}
.humbBtn .inner {
  position: absolute;
  width: 36%;
  height: 23%;
  top: 50%;
  left: 49%;
  transform: translate(-50%,-50%);
}
.humbBtn span {
  display: inline-block;
  position: absolute;
  height: 3px;
  width: 100%;
  background-color: #fff;
  transition:all ease .35s;
}
.humbBtn span:hover {
  transition:all ease .35s;
}

.humbBtn span:nth-child(1) {
  top: 0;
  right: 0px;
}
.humbBtn:hover span:nth-child(1) {
  right: 1px;
}

.humbBtn span:nth-child(2) {
  top: 44%;
  left: 2px;
}
.humbBtn:hover span:nth-child(2) {
  left: 5px;
}

.humbBtn span:nth-child(3) {
  bottom:0;
  right: 0px;
}
.humbBtn:hover span:nth-child(3) {
  right: 1px;
}


/* humbCont */

.humbCont {
  position: fixed;
  right: -490px;
  width: 480px;
  height: 100%;
  background-color: #abcfe4;
  z-index: 99;
  box-shadow:-3px 0px 11px -1px rgba(0,0,0,0.3);
  transition: 0.7s cubic-bezier(.6,0,.25,1);
  transition-delay: 0.5s;
}
.humbCont.active {
  right: 0;
  transition: 0.7s cubic-bezier(.6,0,.25,1);
}
.humbCont > .inner {
  width: 63%;
  margin:139px auto;
  opacity: 0;
  transition: 0.7s cubic-bezier(.6,0,.25,1);
}
.humbCont.active > .inner  {
  opacity: 1;
  margin:128px auto;
  transition: 0.7s cubic-bezier(.6,0,.25,1);
  transition-delay: 0.5s;
}


.humbClose {
  height: 37px;
  width: 37px;
  position: absolute;
  top: 36px;
  right: 36px;
  cursor: pointer;
  opacity: 0;
  transition: 0.8s cubic-bezier(.6,0,.25,1);
}
.humbCont.active .humbClose {
  opacity: 1;
  transition: 0.7s cubic-bezier(.6,0,.25,1);
  transition-delay: 0.5s;
}

.humbClose span {
  position: absolute;
  height: 3px;
  width: 100%;
  background-color: #fff;
  top: 50%;
}
.humbClose span:nth-child(1) {
  transform: translateY(-50%) rotate(45deg);
}
.humbClose span:nth-child(2) {
  transform: translateY(-50%) rotate(-45deg);
}

.humbNav ul li {
  font-size: 2.2rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: 600;
}
.humbNav ul li + li {
  margin-top: 27px;
}
.humbNav ul li a {
  color:#fff;
  transition:all ease .35s;
  display: inline-block;
}
.humbNav ul li a:hover {
  color:#55697A;
  transition:all ease .35s;
}

.humbNav ul li span {
  font-size: 1.9rem;
  font-family: futura-pt, sans-serif;
  font-weight: 400;
  letter-spacing: 0.03em;
  color:#ca9c48;
  display: block;
  margin-top: 3px;
}

.humbSns {
  position: absolute;
  bottom:16px;
  opacity: 0;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  transition: 0.7s cubic-bezier(.6,0,.25,1);
}
.humbCont.active .humbSns {
  bottom:38px;
  opacity: 1;
  transition: 0.7s cubic-bezier(.6,0,.25,1);
  transition-delay: 0.5s;
}
.humbSns li {
  height: 57px;
  width: 57px;
  background-color: #fff;
  border-radius: 100%;
  text-align: center;
  box-shadow: 0px 0px 12px -7px rgba(0,0,0,0.6);
  cursor: pointer;
  transition:all ease .25s;
}
.humbSns li a {
  display: inline-block;
  width: 100%;
  height: 100%;
}
.humbSns li:hover {
  box-shadow: 0px 0px 14px -7px rgba(0,0,0,1);
  transition:all ease .25s;
}
.humbSns li + li {
  margin-left: 9px;
}
.humbSns li i {
  font-size: 2.4rem;
  color:#91b7cb;
 line-height: 57px;
}



/* contactBtn */

.contactBtn {
  position: fixed;
  height: 136px;
  width: 136px;
  background-color: #96bcd0;
  border-radius: 100%;
  bottom:0px;
  right: 30px;
  z-index: 5;
  box-shadow: 0px 0px 12px -7px rgba(0,0,0,0.9);
  transition:all ease .35s;
  opacity: 0;
  visibility: visible;
  transition: all 1.3s cubic-bezier(.86,0,.07,1);
  transition-delay: 3.85s;
}
.pace-done .contactBtn {
  opacity: 1;
  bottom:30px;
}
.contactBtn.delay {
  opacity: 1;
  transition:all ease .35s;
  transition-delay: 0s;
}
.pace-done .contactBtn.delay {
  transition:all ease .35s;
  transition-delay: 0s;
}

.contactBtn.fadeOut {
  opacity: 0;
  bottom:20px;
  visibility: hidden;
  transition:all ease .35s;
}
.contactBtn:hover {
  background-color: #a3c4d6;
  transition:all ease .35s;
}
.contactBtn a {
  display: inline-block;
  width: 100%;
  height: 100%;
}
.contactBtn .inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  white-space: nowrap;
  text-align: center;
}
.contactBtn .jpn {
  font-size: 1.5rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: 600;
  color:#fff;
}
.contactBtn .eng {
  font-size: 1.6rem;
  font-family: futura-pt, sans-serif;
  font-weight: 500;
  letter-spacing: 0.02em;
  color:#fff;
  margin-top: -3px;
}



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

/* common */

header {
  top: 50px;
  position: absolute;
  width: 100%;
  z-index: 6;
  opacity: 0;
  transition: all 1.1s cubic-bezier(.86,0,.07,1);
  transition-delay: 1s;
}
header > .inner {
  width: 90%;
  margin:0 auto;
  position: relative;
}

.pace-done header {
  opacity: 1;
}

/* title */



/* mainNav */

.mainNav {
  position: absolute;
  top: 5px;
  right: 130px;
}
.mainNav ul {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.mainNav ul li {
  font-size: 1.55rem;
  text-align: center;
}
.mainNav ul li a {
  display: inline-block;
  transition:all ease .35s;
}
.mainNav ul li a:hover {
  opacity: 0.5;
  transition:all ease .35s;
}
.mainNav ul li + li {
  margin-left: 63px;
}
.mainNav ul li span {
  font-size: 1.5rem;
  color:#a5a5a5;
  font-family: futura-pt, sans-serif;
  letter-spacing: 0.04em;
  display: block;
  margin-top: 1px;
}



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

/* common */

footer {
  background-color: #adcfe2;
  margin-top: 160px;
}
footer > .inner {
  width: 89%;
  margin:0 auto;
  padding-top: 85px;
}

/* one */

footer .one {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}

.footNav {
  margin-left:auto;
}
.footNav ul {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.footNav ul li {
  font-size: 1.55rem;
  font-weight: 600;
  text-align: center;
  padding:0  41px;
  position: relative;
}
.footNav ul li a {
  display: inline-block;
  transition:all ease .35s;
}
.footNav ul li a:hover {
  opacity: 0.7;
  transition:all ease .35s;
}
.footNav ul li:before {
  content:"";
  position: absolute;
  left: 0;
  height: 83%;
  top: 50%;
  transform: translateY(-50%);
  width:1px;
  border-left: 1px dotted #fff;
}
.footNav ul li:last-child:after {
  content:"";
  position: absolute;
  right: 0;
  height: 83%;
  top: 50%;
  transform: translateY(-50%);
  width:1px;
  border-left: 1px dotted #fff;
}

.footNav ul li a {
  color:#fff;
}
.footNav ul li span {
  font-family: futura-pt, sans-serif;
  font-weight: 500;
  display: block;
  margin-top: 3px;
  letter-spacing: 0.02em;
}


/* two */

footer .two {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
footer .info {
  width: 710px;
  background-color: #f2f7fa;
  margin-left: auto;
  border-radius: 15px;
   box-shadow: 0px 0px 10px -7px rgba(0,0,0,0.5);
}
footer .info > .inner {
  margin:48px 62px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}

footer .info address {
  font-size: 1.7rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: 600;
  line-height: 1.8;
  width: 45%;
  padding-right: 5%;
  color: #a3a3a3;
}

footer .info .contactList {
  width: 40%;
  padding-left: 10%;
  font-size: 2rem;
  line-height: 1.5;
  font-family: futura-pt, sans-serif;
  font-weight: 500; /* Book */
  border-left: 1px dotted #000;
}
footer .info .contactList a {
  color: #a3a3a3;
}

.contactList a {
  position: relative;
  padding-left: 30px;
}
.contactList a:before {
  content:"";
  position: absolute;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  top: 50%;
  transform:translateY(-50%);
  left: 0;
}
.contactList .tel a:before {
  height: 18px;
  width: 15px;
  background-image: url(http://livefoods.studio-has.work/academy/wp-content/themes/livefoods_academy_20200510/assets/img/common/tel.svg);
}
.contactList .mail a:before {
  height: 15px;
  width: 20px;
  left: -2px;
  top: 57%;
  background-image: url(http://livefoods.studio-has.work/academy/wp-content/themes/livefoods_academy_20200510/assets/img/common/mailB.svg);
}


/* three */

footer .three {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  margin-top: 58px;
  margin-bottom: 32px;
}

footer .sns {

}
footer .sns ul {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
footer .sns ul li {
  height: 57px;
  width: 57px;
  background-color: #fff;
  border-radius: 100%;
  text-align: center;
  box-shadow: 0px 0px 10px -7px rgba(0,0,0,0.5);
  cursor: pointer;
  transition:all ease .25s;
}
footer .sns ul li:hover {
  box-shadow: 0px 0px 12px -7px rgba(0,0,0,1);
  transition:all ease .25s;
}
footer .sns ul li + li {
  margin-left: 9px;
}
footer .sns ul li i {
  font-size: 2.4rem;
  color:#91b7cb;
 line-height: 57px;
}
footer .sns ul li a {
  display: inline-block;
  width: 100%;
  height: 100%;
}


footer .produced {
 margin-left: auto;
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 align-items: baseline;
 margin-right: 43px;
 padding-top: 24px;
}
footer .produced div:nth-child(1) {
  font-size: 1.5rem;
  font-family: futura-pt, sans-serif;
  font-weight: 400; /* Book */
  color:#fff;
  margin-right: 17px;
}

footer .toTop {
  width: 75px;
  height: 75px;
  background-color: #fff;
  border-radius: 100%;
  box-shadow: 0px 0px 10px -7px rgba(0,0,0,0.5);
  position: relative;
  cursor: pointer;
  transition:all ease .25s;
}
footer .toTop:hover {
  box-shadow: 0px 0px 12px -7px rgba(0,0,0,1);
  transition:all ease .25s;
}
footer .toTop img {
  position: absolute;
  top: 48%;
  left: 50%;
  transform: translate(-50%,-50%);
}


/* copyright */

.copyright {
  font-size: 1.6rem;
  font-family: futura-pt, sans-serif;
  font-weight: 500;
  color: #a3a3a3;
  background-color: #dde5ea;
  padding:36px 0;
  text-align: center;
}


/* 
---------------------------------------------------
  3. Main
---------------------------------------------------
*/

/* common */

section .heading {
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: 600;
  font-size: 3.25rem;
  line-height: 1.85;
  letter-spacing: 0.02em;
}
section .txt {
  font-size: 1.55rem;
  line-height: 2.9;
  letter-spacing: 0.06em;
}
section .heading + .txt {
  margin-top: 36px;
}

.sectTitle {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
}
.sectTitle .main {
  font-family: serif;
  text-transform: uppercase;
  font-size: 6.2rem;
  letter-spacing: 0.05em;
}
.sectTitle .sub {
  font-size: 1em;
  font-family: fot-tsukubrdgothic-std, sans-serif;
  font-weight: 400; /* Regular */
  letter-spacing: 0;
  margin-left: 54px;
}


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


/* 01 Mv - section */

/*
Common
*/

section.mv {
  max-height: 61vw;
  position: relative;
}

/*
tagline
*/

.tagline {
  font-size: 6.4rem;
  font-family: serif;
  font-weight: 600;
  letter-spacing: 0.03em;
  line-height: 1.4;
  position: absolute;
  top: 61%;
  opacity: 0;
  transform: translateY(-50%);
  left: 8%;  
  z-index: 1;
  transition: all 1.1s cubic-bezier(.86,0,.07,1);
  transition-delay: 1.75s;
}
.pace-done .tagline {
  opacity: 1;
  top: 57%;
}

/*
mainImg
*/

.mainImg {
  position: absolute;
  right: 20px;
  height: calc(100% - 200px);
  top: 180px;
  background-color: #ccc;
  width: 74vw;
}
.mainImg:before {
  content:"";
  position: absolute;
  background-color: #fff;
  width: 100%;
  height: 100%;
  z-index: 1;
  right: 0;
  transition: all 1.1s cubic-bezier(.86,0,.07,1);
  transition-delay: 1.25s;
}
.pace-done .mainImg:before {
  width: 0;
}



/*
copy
*/

.copy {
  font-size: 2.5rem;
  writing-mode: vertical-rl;
  font-family: fot-tsukubrdgothic-std, sans-serif;
  font-weight: 800;
  position: absolute;
  right: 52px;
  top: 52px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap:wrap;
  flex-direction: column;
  align-items: start;
  z-index: 3
}
.copy .line {
  width: 56px;
  position: relative;
}
.copy .line + .line {
  margin-right: 18px;
}
.copy .line > .inner {
  padding:15px 3px;
  opacity: 0;
  transition: all ease 1.5s;
}

.copy .line:nth-of-type(1) > .inner {
  transition-delay: 3.15s;
}
.copy .line:nth-of-type(2) > .inner {
  transition-delay: 3.4s;
}
.copy .line:nth-of-type(3) > .inner {
  transition-delay: 3.65s;
}

.pace-done .copy .line > .inner {
  opacity: 1;
}


.copy .line:before {
  content:"";
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 0%;
  background-color: #fff;
  box-shadow: 0px 0px 14px -7px rgba(0,0,0,0.4);
  transition: all 1.8s cubic-bezier(.86,0,.07,1);
  z-index: -1;
}
.copy .line:nth-of-type(1):before {
  transition-delay: 1.85s;
}
.copy .line:nth-of-type(2):before {
  transition-delay: 2.35s;
}
.copy .line:nth-of-type(3):before {
  transition-delay: 2.85s;
}
.pace-done .copy .line:before {
  height: 100%;
}



/*
slider
*/

.slider ,.slick-list,.slick-track,.slick-slide div {
  height: 100%;
}
.slick-slide div {
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
}

.slick-dots {
  position: absolute;
  bottom:0;
  -webkit-left: 26vw;
  -moz-left: 26vw;
  -ms-left: 26vw;
  -o-left: 26vw;
  left: -20.8vw;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  opacity: 0;
  transition:all 1.1s cubic-bezier(.86,0,.07,1);
  transition-delay: 3.55s;
}
.pace-done .slick-dots {
  opacity: 1;
}

.slick-dots li + li {
  margin-left: 3px;
}
.slick-dots li.slick-active button {
  background-color: #000;
}
.slick-dots button {
  border:none;
  font-size: 0;
  height: 3px;
  width: 68px;
  background-color: #e2e2e2;
  outline: none;
}


/* 02 About us - section */

/*
Common
*/

section.aboutus {
  margin-top: 70px;
  padding-top: 70px;
}
section.aboutus .sectTitle {
  display: none;
}
section.aboutus > .inner {
  width: 80%;
  margin:0 auto;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center
}


/*
Image
*/

section.aboutus .image {
  width: 46%;
  height: 35vw;
  background-color: #ccc;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
}



/*
Contents
*/

section.aboutus .contents {
  width: 54%;
  position: relative;
}

section.aboutus .cont {
  width: 68%;
  margin:-16px auto 0;
  padding-left: 9%;
}



/* 03 Feature - section */

/*
Common
*/

section.feature {
  margin-top: 90px;
  padding-top: 70px;
}
section.feature > .inner {
  width: 82%;
  margin:0 auto;
}



/*
feaList
*/

.feaList {
  position: relative;
  z-index: 2;
  margin-top: 72px;
}
.feaList:before {
  content:"";
  position: absolute;
  background-color: #deecf4;
  height: 100%;
  width: 124%;
  top: 80px;
  right: -18% ;
  z-index: -1;

}
.feaList ul {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  width: 100%;
  margin:0 auto;
}
.feaList li {
  width: 92%;
  background-color: #fff;
  border-radius: 35px;
  border:1px solid #e8e8e8;
  text-align: center;
  box-shadow: 0px 0px 14px -7px rgba(0,0,0,0.4);
}
.feaList li + li {
  margin-left: 3.8%;
}
.feaList li > .inner {
  width: 69%;
  margin: 52px auto 54px;
}
.feaList li .num {
  font-size: 5.8rem;
  letter-spacing: 0.03em;
  color: #d0b279;
  font-family:'Americana W01 Extra Bold';
}
.feaList li .mess {
    font-size: 2.55rem;
    letter-spacing: 0.03em;
    font-family: dnp-shuei-mgothic-std, sans-serif;
    font-weight: 600;
    margin-top: 11px;
    line-height: 1.55;
}
.feaList li .eng {
    font-size: 1.9rem;
    font-family: futura-pt, sans-serif;
    font-weight: 500;
    color: #d0b279;
    margin-top: 8px;
    letter-spacing: 0.03em;
    text-transform: capitalize;
}
.feaList li .desc {
  font-size: 1.5rem;
  letter-spacing: 0.02em;
  line-height: 2.4;
  margin-top: 28px;
  text-align: justify;
}



/* 04 Lesson - section */

/*
Common
*/

section.lesson {
  margin-top: 140px;
  padding-top: 70px;
}
section.lesson > .inner {
  width: 82%;
  margin: 0 auto;
}

/*
Lesson List
*/

.lessonList {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-evenly;
  margin-top: 70px;
  width: 106%;
  margin-left: -3%;
}

.lessonList .slick-list {
  overflow:initial;
}
.lessonList .slick-slide {
  margin-left: 25px;
  margin-right: 25px;
  box-shadow: 0px 0px 14px -7px rgba(0,0,0,0.4);
  border-radius: 35px;
}
.lessonList .slick-arrow {
  height: 93px;
  width: 93px;
  background-color: #fff;
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  border:none;
  border-radius: 10px;
  outline: none;
  box-shadow:0px 0px 14px -7px rgba(0,0,0,0.6);
  font-size: 0;
}
.lessonList .slick-prev {
  left: -3vw;
}
.lessonList .slick-next {
  right: -3vw;
}

.lessonList .slick-arrow:before {
  content:"";
  position: absolute;
  width: 25px;
  height: 15px;
  -webkit-background-size: cover;
  background-size: cover;
  top: 53%;
  left: 50%;
  transform:translate(-50%,-50%);
}
.lessonList .slick-prev:before {
  background-image: url(http://livefoods.studio-has.work/academy/wp-content/themes/livefoods_academy_20200510/assets/img/common/arrowL.svg);
}
.lessonList .slick-next:before {
  background-image: url(http://livefoods.studio-has.work/academy/wp-content/themes/livefoods_academy_20200510/assets/img/common/arrowR.svg);
}


.lessonList li {
  background-color: #fff;
  transition:all ease .35s;
  border-radius: 35px;
  border:1px solid #e8e8e8;
  width: 33%;
}
.lessonList li:hover {
  transition:all ease .35s;
  background-color: #f9f9f9;
}

.lessonList li .image {
  background-color: #ccc;
  border-radius: 35px 35px 0 0;
  text-align: center;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  position: relative;
  height: 240px;
}

.lessonList li .cont {

}
.lessonList li .cont > .inner {
  width: 69%;
  margin:41px auto 44px;
}
.lessonList li .cont .num {
  font-size: 2.4rem;
  font-family: 'Americana W01 Extra Bold';
  letter-spacing: 0.08em;
  text-align: center;
}
.lessonList li .cont .title {
  font-size: 3.3rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  letter-spacing: 0.03em;
  font-weight: 600;
  text-align: center;
  margin-top: -5px;
}
.lessonList li .cont .eng {
    font-size: 1.7rem;
    font-family: futura-pt, sans-serif;
    letter-spacing: 0.04em;
    font-weight: 500;
    color: #d0b279;
    text-align: center;
    margin-top: 0px;
    text-transform: capitalize;
}
.lessonList li .cont p.desc {
    font-size: 1.45rem;
    line-height: 2.2;
    letter-spacing: 0.05em;
    margin-top: 36px;
}

.lessonList li .scroll {
  border-top: 1px solid #e8e8e8;
  text-align: center;
}
.lessonList li .scroll span {
  padding-top: 22px;
  display: inline-block;
  padding-bottom: 18px;
}


/* 05 Select - section */

/*
Common
*/

section.select {
  margin-top: 155px;
}
.selectList {
  background-color: #e9f1f5;
  transition: all ease .5s;
}
.selectList.active {
  background-color: #dcecf4;
  transition: all ease .5s;
}
.selectList .selectBtn {
  transition: all ease .5s;
}
.selectList .selectBtn:hover {
  background-color: #dcecf4;
  transition: all ease .5s;
}
.selectList + .selectList {
  border-top: 1px solid #fff;
}

.selectList dd {
  display: none;
}
.selectList.active dd {
  display: block;
}

/*
selectList
*/

.selectBtn {
  cursor: pointer;
}
.selectBtn > .inner {
  width: 83%;
  margin:0 auto;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  padding: 55px 0 59px;
  align-items: center
}
.selectBtn .num {
  font-size: 6.1rem;
  font-family:'Americana W01 Extra Bold';
  letter-spacing: 0.04em;
  color:#000000;
}
.selectBtn .title {
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: 700;
  font-size: 3.7rem;
  margin-left: 49px;
}
.selectBtn .title span {
  font-size: 1.9rem;
  font-family: futura-pt, sans-serif;
  letter-spacing: 0.05em;
  font-weight: 500;
  display: block;
  margin-top: -7px;
  color:#d0b279;
  margin-left: 4px;
}
.selectBtn .btn {
  height: 76px;
  width: 76px;
  border-radius: 100%;
  background-color: #fff;
  margin-left: auto;
  position: relative;
  box-shadow: 0px 0px 14px -7px rgba(0,0,0,0.4);
}
.selectBtn .btn span {
  display: inline-block;
  position: absolute;
  width: 25px;
  height: 3px;
  background-color: #d0b279;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
}
.selectBtn .btn span:nth-child(2) {
  transform:translate(-50%,-50%) rotate(-90deg);
  transition:all ease .35s;
}
.selectList.active .selectBtn .btn span:nth-child(2) {
  transform:translate(-50%,-50%) rotate(0deg);
  transition:all ease .35s;
}


.selectCont {
  border-top: 1px solid #fff;
}
.couseList {
  width: 79%;
  margin:0 auto;
  padding:100px 0 130px;
}
.couseList li {
  background-color: #fff;
  border-radius: 35px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  box-shadow: 0px 0px 14px -7px rgba(0,0,0,0.4);
  min-height: 21vw;
}
.couseList li + li {
  margin-top: 90px;
}
.couseList li + li.inview2.fadeInUp2 {
  margin-top: 67px;
}
.couseList li .image {
  width: 36%;
  background-color: #ccc;
  border-radius: 35px 0 0 35px;
  align-items: center;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
}

.couseList li .cont {
  width: 64%;
  align-items: center;
}
.couseList li .cont .inner {
  width: 76%;
  margin:0 auto;
  padding:60px 0 55px;
}
.couseList li .cont .title .sub {
  font-size: 1.6rem;
  letter-spacing: 0.06em;
  margin-bottom: 5px;
}
.couseList li .cont .title {
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-size: 2.8rem;
  line-height: 1.65;
  letter-spacing: 0.045em;
}
.couseList li .cont .title span {
  font-size: 1.9rem;
  letter-spacing: 0.04em;
  margin-top: 4px;
  font-family: futura-pt, sans-serif;
  font-weight: 500; /* Medium */
  color:#d0b279;
  display: block;
  text-transform: capitalize;
}
.couseList li .cont .desc {
  font-size: 1.45rem;
  letter-spacing: 0.07em;
  line-height: 2.4;
  margin-top: 22px;
}
.couseList li .cont .url {
  font-size: 1.3rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  letter-spacing: -0.03em;
  font-weight: 600;
  display: inline-block;
  margin-top: 20px;
  position: relative;
  padding-right: 19px;
  margin-bottom: 15px;
}
.couseList li .cont .url:after {
  content:"";
  position: absolute;
  right: 0px;
  height: 13px;
  width: 13px;
  top: 22%;
  background-image: url(http://livefoods.studio-has.work/academy/wp-content/themes/livefoods_academy_20200510/assets/img/common/window.svg);
}


.couseList li .cont .url a {
  position: relative;
  display: inline-block;
  width: 100%;
  padding-right: 19px;
  padding-left: 2px;
  margin-right: -20px;
}
.couseList li .cont .url a:before {
  content:"";
  position: absolute;
  bottom:-5px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #ddcdb7;
  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);
}
.couseList li .cont .url a:hover::before {
  transform-origin: right top;
  transform: scale(0, 1);
}
.couseList li .cont .url a:after {
  content:"";
  position: absolute;
  bottom:-5px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #ddcdb7;
  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;
}
.couseList li .cont .url a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}

/* 06 Select - Contact */

/*
Common
*/

section.contact {
  margin-top: 70px;
  padding-top: 70px;
}
section.contact > .inner {
  width: 82%;
  margin:0 auto;
}

.contactCont {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  margin-top: 55px;
}

/*
Left
*/

.contactCont .left {
  width: 45%;
}
.contactCont .left > .inner {
  position: -webkit-sticky;
  position:sticky;
  top:50px;
}

.contactCont .left .info {
  background-color: #f4f4f4;
  border-radius: 15px;
  margin-top: 50px;
  box-shadow: 0px 0px 8px -7px rgba(0,0,0,0.4);
}
.contactCont .left .info > .inner {
  width: 78%;
  margin:0 auto;
  padding:50px 0;
}

.contactCont address {
    font-size: 1.85rem;
    font-family: dnp-shuei-mgothic-std, sans-serif;
    font-weight: 400;
    line-height: 1.8;
    padding-right: 5%;
}
.contactCont .infoList {
  margin-top: 22px;
  font-size: 2rem;
  line-height: 1.5;
  font-family: futura-pt, sans-serif;
  font-weight: 400;
}
.contactCont .infoList li + li {
  margin-top: 6px;
}

.contactCont .infoList a {
  position: relative;
  padding-left: 33px;
}
.contactCont .infoList a:before {
  content:"";
  position: absolute;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  top: 50%;
  transform:translateY(-50%);
  left: 0;
}
.contactCont .infoList .tel a:before {
  height: 19px;
  width: 16px;
  background-image: url(http://livefoods.studio-has.work/academy/wp-content/themes/livefoods_academy_20200510/assets/img/common/tel.svg);
}
.contactCont .infoList .mail a:before {
  height: 16px;
  width: 22px;
  left: -4px;
  top: 57%;
  background-image: url(http://livefoods.studio-has.work/academy/wp-content/themes/livefoods_academy_20200510/assets/img/common/mailB.svg);
}



/*
Right
*/

.contactCont .right {
  width: 50%;
  margin-left: 5%;
}


.formList {

}
.formList + .formList {
  margin-top: 30px;
}
.formList + .formList.confirm {
  margin-top: 14px;
}
.formList .sub {
  font-size: 1.5rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  margin-bottom: 12px;
  position: relative;
  display: inline-block;
}
.formList .req:after {
  content:"必須";
  font-size: 1.2rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: 600;
  color:#fff;
  background-color: #d03939;
  padding:0 6px 0 5px;
  border-radius: 5px;
  height: 19px;
  line-height: 19px;
  display: inline-block;
  margin-left: 11px;
}

.contactCont p {
  width: 100%;
}
.formList input,.formList textarea {
  font-size: 1.4rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: 400;
  width: calc(100% - 23px);
  padding-left: 23px;
  border-radius: 5px;
  border:1px solid #cacaca;
  outline: none;
}
.formList input:focus {
  border:1px solid #000;
}
.formList input {
  line-height: 62px;
}
.formList textarea {
  padding-top: 25px;
  padding-bottom: 25px;
  resize: vertical;
}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #fff inset;    
}


/*
Privacy Policy
*/

.privacy {
    width: 100%;
    border-radius: 5px;
    border: 1px solid #cacaca;
    height: 300px;
}
.privacy .frame > .inner {
  width: 85%;
  margin:19px auto;
  font-size: 1.4rem;
  line-height: 2.4;
}

.privacy .frame {
  width: 96%;
  height: 272px;
  margin:14px auto;
  overflow: auto;
}

/*スクロールバーの横幅指定*/
.privacy .frame::-webkit-scrollbar {
    width: 7px;
}
/*スクロールバーの背景色・角丸指定*/
.privacy .frame::-webkit-scrollbar-track {
  border-radius: 10px;
  background: #fff;
}
/*スクロールバーの色・角丸指定*/
.privacy .frame::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background:#404040;
}

.privacy .lead {
  font-size: 1.45rem;
  margin-bottom: 6px;
  color:#606060;
}
.privacy .desc {
  font-size: 1.3rem;
  color:#606060;
  line-height: 2.2;
  letter-spacing: 0em;
}
.privacy .desc p {
  line-height: 2.4;
  margin-top: 14px;
}
.privacy .desc + .lead {
  margin-top: 28px;
}

.accept {
  margin-top: 30px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  position: relative;
}
.accept > p {
  display: none;
}
.acceptTxt {
  font-size: 1.5rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  line-height: 2.3;
  position: absolute;
  left: 39px;
}

span.wpcf7-list-item {
    display: inline-block;
    margin: 0;
}
input[type="checkbox"] {
    display: none;
}
span.wpcf7-list-item-label {
  display: block;
  height: 20px;
  width: 20px;
  border: 1px solid #ccc;
  border-radius: 3px;
  position: relative;
  cursor: pointer;
}
.wpcf7-not-valid span.wpcf7-list-item-label {
  border:2px solid #f00;
  box-sizing: border-box;
}
.wpcf7-form-control-wrap {
  height: 23px;
}
span.wpcf7-list-item-label::before {
    content: " ";
    position: absolute;
    width: 12px;
    height: 12px;
    background: rgba(205, 185, 156, 0.97);
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0;
    border-radius: 2px;
}


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


/*
BtnList
*/

.btnList {
  margin-top: 36px;
}
.btnList input {
  font-size: 1.7rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: 400;
  background-color: #f4f4f4;
  border:1px solid #ececec;
  border-radius: 43px;
  box-shadow: 0px 0px 11px -7px rgba(0,0,0,0.3);
  line-height: 4.4;
  outline: none;
  transition:all ease .35s;
  width: 100%;
}
.btnList input:hover {
  box-shadow: 0px 0px 11px -7px rgba(0,0,0,0.6);
  background-color: #efefef;
  transition:all ease .35s;
}
.btnList input:focus {
  border:none;
}

.btnList input + input {
  margin-top: 10px;
}

.btnList input.send {
  background-color: rgba(205, 185, 156, 0.67);
}


/*
Error
*/

.ajax-loader {
  display: none !important;
}
span.wpcf7-not-valid-tip {
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: 400;
  margin-top: 11px;
  letter-spacing: 0;
}
.accept span.wpcf7-not-valid-tip {
  display: none;
}

div.wpcf7-validation-errors, div.wpcf7-acceptance-missing {
  border:none;
  font-size: 1.4rem;
  font-family: dnp-shuei-mgothic-std, sans-serif;
  color: #f00;
  font-weight: 400;
  margin:0;
  padding:0;
  margin-top: 23px;
}


/*
Confirm
*/

.wpcf7c-conf {
  background-color: #f6f6f6 !important;
}
.wpcf7c-conf:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #f6f6f6 inset;    
}


/*
Send
*/

div.wpcf7-mail-sent-ok {
    font-size: 1.45rem;
    letter-spacing: 0.0em;
    margin: 38px 0 0;
    line-height: 2.4;
    padding: 34px 42px;
    border-radius: 5px;
    background: #f4f4f4;
    border: 1px solid #ececec;
    box-shadow: 0px 0px 11px -7px rgba(0,0,0,0.3);
}