@charset "UTF-8";
/*
 * data:2019-07-01 renewal
 * kurakihoikuen.css
/*
/**----- contents -------#
* 1: html & body & other
* 2: main
* 3: kuraki_01
* 4: kuraki_02
* 5: kuraki_03
* 6: banner_area
----------------------*/
/* ==========================================================
* 1: html & body & other
============================================================*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500;700;900&display=swap');

.l-main body, .l-main div, .l-main dl, .l-main dt, .l-main dd, .l-main ul, .l-main ol, .l-main li, .l-main h1, .l-main h2, .l-main h3, .l-main h4, .l-main h5, .l-main h6, .l-main p, .l-main form, .l-main fieldset, .l-main label, .l-main th, .l-main td, .l-main img, .l-main figure, .l-main figcaption {
	margin: 0;
	padding: 0;
	border: 0;
}

#kurakihoikuen #wrapper * {
 box-sizing: border-box;
 list-style-type: none;
}
#kurakihoikuen #wrapper  {
 margin: 0;
 color: #1A1311;
 background: #fff;
}
#kurakihoikuen .kurakihoikuen_cont p{ 
 font-family: "ヒラギノ角ゴ ProN","HiraKakuPro","ヒラギノ角ゴ Pro","HiraKakuPro",YuGothic,"Yu Gothic","メイリオ", Meiryo,"MS ゴシック","MS Gothic",sans-serif;
 font-size: 16px;
 font-weight: 500;
}
#kurakihoikuen a, #kurakihoikuen a img{
 text-decoration: none;
 transition: all 1s;
}
#kurakihoikuen a:hover,#kurakihoikuen a:hover img{
 opacity: 0.7;
}
#kurakihoikuen .kurakihoikuen_cont div:after, #kurakihoikuen .kurakihoikuen_cont dl:after, #kurakihoikuen .kurakihoikuen_cont ul:after {
 content: none;
 visibility: visible;
} 
#kurakihoikuen .inner_cont{
 width: 1000px;
 padding: 60px 0;
 margin: 0 auto;
}
#kurakihoikuen .fl{
 display: flex;
 justify-content: space-between;
 align-items: center;
}
#kurakihoikuen .fade_off {
 opacity: 0;
 transition: all 1s;
}
#kurakihoikuen .fade_on {
 opacity: 1;
}
#kurakihoikuen .touch{
 pointer-events: none;
 user-select:none;
 touch-callout:none;
}
@media screen and (max-width: 767px){
 #kurakihoikuen .inner_cont{
  width: 94.667vw;
  padding: 8vw 0;
  margin: 0 auto;
 } 
}
/* pagetop_fixed */
 #kurakihoikuen .pagetop_fixed {
  position: fixed;
  display: none;
  right: 3%;
  bottom: 6vw;
  z-index: 20;
  width: 50px;
  cursor: pointer;
}
 #kurakihoikuen .pagetop_fixed img{
  width: 100%;
}
@media screen and (min-width:641px) {
 body {
  min-width: 1024px;
 }
 .isSP {
  display: none!important;
 }
}
@media screen and (max-width:640px) {
 img{
  max-width: 100%;
 }
 .isPC {
  display: none!important;
 }
 #kurakihoikuen .kurakihoikuen_cont p{ 
  font-size: 14px;
 }
  #kurakihoikuen .pagetop_fixed {
  bottom: 5vw;
 }
}
/* ==========================================================
* 2: main
============================================================*/
#kurakihoikuen .main {
 background: url("../images/main_bg.svg") bottom center no-repeat;
 background-size: cover;
}
#kurakihoikuen .main_cont {
 display: flex;
 justify-content: space-between;
 width: 1000px;
 min-height: 564px;
 padding: 100px 0;
 margin: 0 auto 0;
}
#kurakihoikuen .main_txt{
 width: 700px;
}
#kurakihoikuen .main_txt h1{
 width: 700px;
 margin-bottom: 68px;
 animation: fadein  ease-out 3s forwards 0s;
 opacity:0;
}
#kurakihoikuen .main_txt p{
 font-size: 18px;
 line-height: 1.8;
 animation: fadein  ease-out 3s forwards 0s;
 opacity:0;
}
#kurakihoikuen .tsutsumi_t{
 width: 260px; 
 margin-top: -20px;
}
#kurakihoikuen .tsutsumi_t .photo{
 position: relative;
 width: 180px;
 margin:0 auto;
 z-index: 1;
 animation: fadein  ease-out 3s forwards 0.1s;
 opacity:0
}
#kurakihoikuen .tsutsumi_t .career{
 padding: 20px 10px 13px;
 margin-top: -20px;
 background: #8CC4E7;
 border-radius: 9px;
 animation: fadein  ease-out 3s forwards 0.1s;
 opacity:0
}
#kurakihoikuen .tsutsumi_t .career .name{
 width: 120px;
 margin: 0 auto 15px;
}
#kurakihoikuen .tsutsumi_t .career p{
 font-size: 14px;
}
@keyframes fadein {
  0% {
     opacity: 0;
  }
  100% {
     opacity: 1;
  }
}
@media screen and (max-width: 767px){
#kurakihoikuen .main {
 margin-bottom: 2vw;
  background: url("../images/main_bg_sp.svg") no-repeat center bottom 24vw;
  background-size: cover;
}
 #kurakihoikuen .main_cont {
  position: relative;
  display: block;
  width: 92vw;
  min-height: inherit;  
  padding: 8vw 0 0;
 }
 #kurakihoikuen .main_txt{
  width: 100%;
 }
 #kurakihoikuen .main_txt h1{
  width: 92vw;
  margin:0 auto 8vw;
 }
 #kurakihoikuen .main_txt p{
  font-size: 14px;
  line-height: 1.8;
  margin: 0;
 }
 #kurakihoikuen .tsutsumi_t{
  display: flex;
  width: 100%; 
  margin-top: 4vw;
 }
 #kurakihoikuen .tsutsumi_t .photo{
  position: relative;
  width: 35.7vw;
  margin:0 -3vw 0 0;
 }
 #kurakihoikuen .tsutsumi_t .career{
  width: 61.3vw;
  padding: 2.5vw 4vw 1.8vw 5.5vw;
  margin-top: 0;
 }
 #kurakihoikuen .tsutsumi_t .career .name{
  width: 30.6vw;
  margin: 0 auto 2.3vw;
 }
 #kurakihoikuen .tsutsumi_t .career p{
  font-size: 10px;
 }
}
/* ==========================================================
* 3: kuraki_01
========================================================== */
#kurakihoikuen #kuraki_01 .teacher{
 width: 180px; 
}
#kurakihoikuen #kuraki_01 .teacher.t02{
 margin-right: 20px;
}
#kurakihoikuen #kuraki_01 .kuraki01_cont_01 h2{
 margin-bottom: 30px;
}
#kurakihoikuen #kuraki_01 .kuraki01_cont_02 h2{
 margin: 75px 0 20px;
}
#kurakihoikuen #kuraki_01 .voice{
 width: 740px;
}
#kurakihoikuen #kuraki_01 .recipe{
 margin: 25px 0 0;
}
#kurakihoikuen #kuraki_01 .hukidashi{
 width: 240px;
 margin-right: -20px;
}
#kurakihoikuen #kuraki_01 .point_01{
 margin: 35px auto;
}
@media screen and (max-width: 767px){
 #kurakihoikuen #kuraki_01 .kuraki01_cont_01{
  flex-wrap: wrap;
  flex-direction: column;
 }
 #kurakihoikuen #kuraki_01 .kuraki01_cont_01 h2{
  width: 92.6vw;
  margin: 0 auto 8vw;
  order: 1;
 }
 #kurakihoikuen #kuraki_01 .kuraki01_cont_01 .teacher{
  width: 35.7vw;
  margin: 0 auto;
  order: 3;
 }
 #kurakihoikuen #kuraki_01 .kuraki01_cont_01 .voice{
  display: flex;
  width: 100%;
  margin-bottom: 2vw;
  order: 2;
 }
 #kurakihoikuen #kuraki_01 .kuraki01_cont_02 h2{
  width: 92.6vw;
  margin: 9.8vw auto 5.8vw;
 }
 #kurakihoikuen #kuraki_01 .kuraki01_cont_02 .fl{
  flex-wrap: wrap;
  align-items:flex-start;
 }
 #kurakihoikuen #kuraki_01 .recipe{
  margin: 0 auto 5.3vw;
 }
 #kurakihoikuen #kuraki_01 .hukidashi{
  width: 50.2vw;
  margin-left: 3vw;
 }
 #kurakihoikuen #kuraki_01 .kuraki01_cont_02 .teacher.t02{
  width: 35.7vw;
  text-align: center;
  margin: 0 auto;
 }
 #kurakihoikuen #kuraki_01 .kuraki01_cont_02 .point_01{
  text-align: center;
  margin: 8.5vw auto 5.3vw;
 }
 #kurakihoikuen #kuraki_01 .kuraki01_cont_02 .point_02{
  text-align: center;
  margin: 0 auto;
 }
}
/* ==========================================================
* 4: kuraki_02
========================================================== */
#kurakihoikuen #kuraki_02 {
 background: #F8F0B3;
}
#kurakihoikuen #kuraki_02 .inner_cont > h2{
 width: 844px;
 margin: 0 auto 60px;
}
@media screen and (max-width: 767px){
 #kurakihoikuen #kuraki_02 .inner_cont{
  width: 92vw;
  margin: 0 auto;
 }
 #kurakihoikuen #kuraki_02 .inner_cont > h2{
  width: 87.8vw;
  margin: 0 auto 6.4vw 0;
 }
 #kurakihoikuen #kuraki_02 .fl{
  flex-wrap: wrap;
  flex-direction: column;  
 }
 #kurakihoikuen #kuraki_02 ul li:nth-child(2){
  margin: 5.3vw 0;
 }
}

/* ==========================================================
* 5: kuraki_03
========================================================== */
#kurakihoikuen #kuraki_03 ul{
 margin: 30px 0;
}
@media screen and (max-width: 767px){
 #kurakihoikuen #kuraki_03 div.fl{
  flex-wrap: wrap;
  flex-direction: column;
 }
 #kurakihoikuen #kuraki_03 .ttl_01{
  width:100%;
  margin: 0 auto 5vw 0;
 }
 #kurakihoikuen #kuraki_03 .ttl_02{
  width:100%;
  margin: 9.8vw auto 5vw 0;
 }
  #kurakihoikuen #kuraki_03 .sp_posi{
  position: relative;
 }
 #kurakihoikuen #kuraki_03 .cooperation{
  width: 74.6vw;
  margin: 0 auto;
 }
 #kurakihoikuen #kuraki_03 .package{
  position: absolute;
  right: 0;
  bottom: 9vw;
  width:27.2vw;
  margin: 0 0 0 auto;
 }
 #kurakihoikuen #kuraki_03 ul{
  width:85.3vw;
  margin: 2.6vw auto;
 }
 #kurakihoikuen #kuraki_03 ul li.fade_off{
  opacity: 1;
 }
 #kurakihoikuen #kuraki_03 ul li.fade_off img{
  display: block;
  width:100% !important;
  min-width: 85.3vw;
  margin: 0 auto;
 }
 /*--slider--*/
 #kurakihoikuen #kuraki_03 .slick-prev {
  left: -25px;
  width:30px;
  height:40px;
  background: url("../images/kuraki_03_prev.png") center center no-repeat;
  z-index: 1;
 }
 #kurakihoikuen #kuraki_03 .slick-prev:before {
  content: '';
 }
 #kurakihoikuen #kuraki_03 .slick-next {
  right: -25px;
  width:30px;
  height:40px;
  background: url("../images/kuraki_03_next.png") center center no-repeat;
  z-index: 1;
 }
 #kurakihoikuen #kuraki_03 .slick-next:before {
  content: '';
 } 
}

/* ==========================================================
* 6: banner_area
========================================================== */
#kurakihoikuen #banner_area .inner_cont{
 padding: 0;
}
#kurakihoikuen #banner_area .inner_cont a{
 display: block;
 width: 590px;
 margin: 0 auto;
}
@media screen and (max-width: 767px){
 #kurakihoikuen #banner_area .inner_cont a{
  width: 76.923vw;
 }
}
