@charset "UTF-8";
/* 人材教育オーダーメイド動画制作 */
:root {
   --scale: calc(100vw / 1200);
    --swiper-theme-color: #007aff;
	--gray:#707070;
	--gray_02:#f2f2f2;
	--gray_03:#F5F5F5;
	--white:#ffffff;
	--color_01:#1590BC;
	--color_02:#EE7A00;
	--color_03:#595757;
	--color_04:linear-gradient(to right, #0090be, #3ebbd1, #f7b100, #ee7a00);
	--color_05:#F4F7FA;
	--color_06:linear-gradient(to bottom, #ffffff 50%,#f2f2f2 50%);
	--color_07:linear-gradient(to bottom, #ffffff 52%,#F4F7FA 52%);
	--color_08:linear-gradient(to bottom, #0090BE ,#0090BE 52%,#3EBBD1 );
	--color_09:linear-gradient(to bottom, #EE7A00 ,#F8C192 );
	--color_10:#1EB8D4;
	--color_11:#E6F0F7;
  --c_lp_01:#E6F0F7;
  --c_lp_02:#00114A;
  --c_lp_03:#1EB8D4;
  --c_lp_04:#D6141C;
  --c_lp_05:linear-gradient(to bottom, #708AE1 ,#00114A 70%);
  --c_lp_06:linear-gradient(to bottom, #E97D82 ,#BF0008 70%);
	
	
}

.page_lp01{min-width: 1200px;position: relative;z-index: 1;}
.page_lp01 .page-wrap{width: 100%;height: 100%;box-sizing: border-box;}
#page .container{width: 1200px;margin: 0 auto;padding: 0;box-sizing: border-box;position: relative;text-align: left;}
@media (max-width: 1200px) {
#page .container{min-width:auto ;max-width: 100%;padding: 0 20px;}

}
@media screen and (max-width : 767px) {
  .page_lp01{min-width: 100%;width: 100%;position: relative;z-index: 1;}
  #page .container{min-width:auto ;max-width: 100%;padding: 0 20px;}
}

.lp01_page-header{background: url(../img/lp01_main_bg_03_3.png)no-repeat center center/cover;padding: 50px 0;}
.lp01_page-header .container{position: relative;}
.lp01_logo{margin-bottom: 30px;}
.lp01_main_copy{margin-bottom: 30px;display: block;}
.lp01_main_01{margin-bottom: 30px;}

.lp01_header_btn{display: flex;gap: 20px 20px;}
.lp01_header_btn > li{width: 260px;position: relative;}
.lp01_header_btn > li > a{display: block;width: 100%;height: 70px;line-height: 70px;color: var(--white);text-align: center;box-shadow: 0 0 10px rgba(0,51,69,0.2);transition: all 0.3s ease;border-radius: 5px;border: 2px solid var(--white);font-size: 2.6rem;font-weight: bold;letter-spacing: 0.05em;}

  .lp01_badge{position: absolute;right: 0px;bottom: 0px;z-index: 1;}


.lp01_header_btn > li:nth-child(1) > a{background: var(--c_lp_05);}
.lp01_header_btn > li:nth-child(2) > a{background: var(--c_lp_06);}


.kirari {
    position:relative;
    overflow:hidden;
    display: inline-block;
}
.kirari::before {
    content:"";
    height:100%;
    width:30px;
    position:absolute;
    top:-180px;
    left:0;
    background: rgba(255,255,255,0.25);
    opacity:0;
    -webkit-transform: rotate(45deg);
    -webkit-animation: kirari 2s ease-in-out infinite;
}

@keyframes kirari {
    0% { -webkit-transform: scale(0) rotate(25deg); opacity: 0; }
    75% { -webkit-transform: scale(0) rotate(25deg); opacity: 0.5; }
    76% { -webkit-transform: scale(4) rotate(25deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(25deg); opacity: 0; }
}


@media screen and (max-width:767px) {
  .lp01_page-header{background: url(../img/lp01_main_bg_sp.png)no-repeat center top/cover; padding: 20px 0px 35px;}
  .lp01_logo{margin: 0 auto 15px;width: 200px;}
  .lp01_badge{position: absolute;right: 20px;top: 110px;bottom: auto;width: 25vw;}
  .lp01_main_copy{margin-bottom: 15px;padding-right: 20vw;}
  .lp01_main_01{margin-bottom: 0;}
  .lp01_sp_bg_02{}
  .lp01_header_btn{width: 100%;justify-content: space-between;gap: 0;}

}


/* text_loop */


.lp01_loop_outer {
  position: relative;
  overflow: hidden;
  width: 100%;height: 180px;
  margin-inline: auto;
}

.lp01_loop {
  animation: loop 160s linear infinite;
  width: 3840px;
  overflow: hidden;height: 180px;
    position: absolute;
  top: 0;
  left: 0;
}
.lp01_loop2 {
  position: absolute;
  top: 0;
  left: 0;
  animation: loop 160s -80s linear infinite;
}
@keyframes loop {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}

@media screen and (max-width:767px) {
  .lp01_loop_outer{height: 156px;}
  .lp01_loop{width: 828px;height: 156px;}
	.lp01_loop {animation: loop 80s linear infinite;}
	.lp01_loop2 {animation: loop 80s -40s linear infinite;}
}

.lp01_content_01 h2{height: 200px;text-align: center;background: var(--c_lp_02);padding:50px 0 0px;position: relative;}
.lp01_content_01 h2::after{content: "";
  border-top: 50px solid var(--c_lp_02);
  border-left: 80px solid transparent;
  border-right: 80px solid transparent;
  border-bottom: 0px solid transparent;
  position: absolute;bottom: -50px;margin-left: -80px;left: 50%;}

.lp01_onayami_bg {background:url(../img/lp01_en.png)no-repeat center bottom/auto 280px #F1F1F1;
  
  padding: 80px 0 50px;}

.lp01_onayami_list{display: flex;gap: 10px 20px;justify-content: space-between;flex-wrap: wrap;}
.lp01_onayami_list > li{width: 280px;height: 280px;border-radius: 50%;border: 2px solid var(--c_lp_02);background: var(--white);box-sizing: border-box;font-weight: bold;font-size: 2.0rem;line-height: 1.5; text-align: center;display: flex;justify-content: center;align-items: center;}

.lp01_onayami_list > li:nth-child(1),.lp01_onayami_list > li:nth-child(4){margin-top: 80px;}

.lp01_onayami_list > li .red{color: var(--c_lp_04);font-weight: bold;font-size: 2.8rem;}


.lp01_onayami_copy{margin-top: 150px;font-size: 5.0rem;font-weight: bold;color: var(--white);text-align: center;line-height: 1.4;}

.lp01_onayami_img_02{position: absolute;left: -30px;bottom: 0px;z-index: 1;}
.lp01_onayami_img_03{position: absolute;left: 50%;bottom: 150px;margin-left: -125px;z-index: 1;}
.lp01_onayami_img_04{position: absolute;right: 0px;bottom: 0;z-index: 1;}
@media screen and (max-width:1200px) {
.lp01_onayami_list{gap: 10px 0px;}
}
@media screen and (max-width:767px) {
.lp01_content_01 h2{height: 100px;padding: 20px;}
.lp01_content_01 h2::after{content: "";
  border-top: 25px solid var(--c_lp_02);
  border-left: 40px solid transparent;
  border-right: 40px solid transparent;
  border-bottom: 0px solid transparent;
  position: absolute;bottom: -25px;margin-left: -40px;left: 50%;}

.lp01_onayami_bg{background-size:auto 170px;padding: 40px 0 25px;}
.lp01_onayami_list{justify-content: flex-start;}
.lp01_onayami_list > li{width: 100%;font-size: 1.4rem;border-radius: 50px;border: 1px solid var(--c_lp_02);height: auto;padding: 15px 15px 15px 50px;display: block;line-height: 1.4;text-align: left;}
.lp01_onayami_list > li .red{font-size: 1.8rem;}

.lp01_onayami_list > li:nth-child(1){margin: 0 20% 0 0;}
.lp01_onayami_list > li:nth-child(2){margin: 0 0 0 20%;}
.lp01_onayami_list > li:nth-child(3){margin: 0px 20% 0 0;}
.lp01_onayami_list > li:nth-child(4){margin: 0 0 0 20%;}

    .lp01_header_btn > li{width: 48%;}
    .lp01_header_btn > li > a{font-size: 1.6rem;height: 60px;line-height: 60px;}
    .lp01_onayami_copy{font-size: 2.4rem;margin-top: 130px;}

.lp01_onayami_img_02{width: 100px;left: 0px;bottom: 100px;z-index: 1;}
.lp01_onayami_img_03{width: 100px;bottom: 120px;margin-left: -50px;z-index: 1;}
.lp01_onayami_img_04{width: 55px;right: 0px;bottom: 100px;z-index: 1;}

}


.lp_01_logo_box_outer{padding: 125px 0 0 0;}

.lp_01_samazama{color: var(--c_lp_02);text-align: center;font-size: 5rem;font-weight: bold;letter-spacing: 0.05em;}
.lp_01_samazama .mini{display: block;text-align: center;font-size: 2.8rem;}

@media screen and (max-width:767px) {
  .lp_01_logo_box_outer{padding: 60px 0 20px 0;}
  .lp_01_samazama{font-size: 3rem;}
  .lp_01_samazama .mini{font-size: 1.8rem;}
}


.lp01_bnr_01{margin: 100px 0;box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);}

@media screen and (max-width:767px) {
.lp01_bnr_01{margin: 60px 0;}
}

/* スライド */
.lp01_swiper{position: relative;}
.lp01_swiper .swiper{padding: 30px 0;}
.lp01_swiper .swiper-slide{box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);}
.lp01_swiper .swiper-wrapper{align-items: stretch;}

.lp_sld_box{position: relative;width: 100%;overflow: hidden;box-sizing: border-box;padding: 60px;display: flex;gap: 20px 50px;align-items: stretch;justify-content: space-between;background: var(--white);}
.lp_sld_box > .lp_sld_l{width: 400px;box-sizing: border-box;color: var(--c_lp_02);}
.lp_sld_box > .lp_sld_r{width: 630px;box-sizing: border-box;position: relative;overflow: hidden;}


/* スライド画像を100%表示 */
.lp01_swiper .swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
}

/* スライド要素に幅を持たせる */
.lp01_swiper .swiper-slide {
  width: auto;
  max-width: 1200px;
}

.lp01_swiper .swiper-button-next,
.lp01_swiper .swiper-button-prev {
  width: 60px;height: 60px;
}
.lp01_swiper .swiper-button-next:after,
.lp01_swiper .swiper-button-prev:after {content: "";
  text-rendering: initial;width: 60px;height: 60px;
}
.lp01_swiper .swiper-button-next:after{background:url("../img/wk_sw_b_r.png")no-repeat center center;}
.lp01_swiper .swiper-button-prev:after{background:url("../img/wk_sw_b_l.png")no-repeat center center;}


/* モバイルで全幅表示 */
@media screen and (max-width: 1199px) {
  .lp01_swiper .swiper-slide {
    max-width: 1000px;
  }
.lp_sld_box{flex-direction: column-reverse;}
}
@media screen and (max-width: 1024px) {
  .lp01_swiper .swiper-slide {
    max-width: 750px;
  }

}

@media screen and (max-width: 750px) {
  .lp01_swiper .swiper-slide {
    max-width: 300px;
  }

		.lp01_swiper .swiper-button-next,
.lp01_swiper .swiper-button-prev {
  width: 30px;height: 30px;
}
.lp01_swiper .swiper-button-next:after,
.lp01_swiper .swiper-button-prev:after {content: "";
  text-rendering: initial;width: 30px;height: 30px;
	background-size: 100% auto;
}
}

.lp01_swiper .swiper-pagination {
  position: absolute;
  bottom: -45px !important;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 10;
}

.lp01_swiper .swiper-pagination-bullet {
  background: var(--color_03);
  opacity: 0.6;
}

.lp01_swiper .swiper-pagination-bullet-active {
	background-color: var(--color_01);
  opacity: 1;
}


.lp01_swiper .ttl_02 span.wk_blue{color: var(--color_01);}
.lp01_swiper .ttl_02 span.wk_orange{color: var(--color_02);}
.wk_swiper_txt {width: 1200px;max-width: 100%;margin: 100px auto;}

.lp_sld_case > span{background: var(--color_10);color:var(--white);display: inline-block;padding: 10px;}

.lp_sld_mini{font-size: 2.0rem;font-weight: bold;margin: 25px 0;}
.lp_sld_big{font-size: 3.0rem;font-weight: bold;line-height: 1.4;}
.lp_sld_txt{font-size: 1.6rem;line-height: 1.8;margin-top: 30px;font-weight: 500;}


@media screen and (max-width: 1199px) {
  .lp_sld_box{flex-wrap: wrap;padding: 30px;gap: 20px 20px;}
  .lp_sld_box > .lp_sld_l{width: 100%;}
  .lp_sld_box > .lp_sld_r{width: 100%;}
  .lp_sld_r iframe{width: 100%;height: auto;min-height: 300px;}
}

@media screen and (max-width: 767px) {
.lp_sld_mini{font-size: 1.4rem;margin: 15px 0;}
.lp_sld_big{font-size: 2.0rem;}
.lp_sld_txt{font-size: 1.4rem;margin-top: 15px;}
.lp_sld_box{padding: 20px;gap: 15px 15px;}
.lp_sld_case > span{padding: 5px;font-size: 1.2rem;}
.lp_sld_r iframe{min-height: 200px;}
}


.lp01_content_02{background: var(--c_lp_01);padding: 80px 0;}
.lp01_content_02_inbox_01{display: flex;gap: 25px 25px;flex-wrap: wrap;justify-content: center;margin: 80px 0;}
.lp01_content_02_inbox_01 > dl{width: calc((100% - 50px)/3);box-sizing: border-box;background: var(--white);padding: 0px;box-shadow: 0 0 10px rgba(0,0,0,0.1);position: relative;color: var(--c_lp_02);}

.lp01_content_02_inbox_01 > dl dt{font-size: 2.4rem;font-weight: bold;padding: 25px;position: relative;text-align: center;line-height: 1.5;}

.lp01_content_02_inbox_01 > dl dt .num{display: block;color: var(--color_10);text-align: center;font-size: 3.0rem;margin-bottom: 10px;}
.lp01_content_02_inbox_01 > dl dd .txt{padding: 30px;font-weight:500;font-size:  1.6rem;text-align: left;}

.lp01_content_02_inbox_02{display: flex;gap: 20px 20px;flex-wrap: wrap;justify-content: center;}
.lp01_content_02_inbox_02 > dl{width: calc((100% - 20px)/2);box-sizing: border-box;background: var(--white);padding: 0px;border: 1px solid var(--c_lp_02) ;color: var(--c_lp_02);text-align: center;}

.lp01_content_02_inbox_02 > dl > dt{font-size: 3.0rem;font-weight: bold;padding: 10px;position: relative;border-bottom: 1px solid var(--c_lp_02);}


@media screen and (max-width: 767px) {
.lp01_content_02_inbox_01 > dl{width: 100%;}
.lp01_content_02_inbox_01 > dl dt{font-size: 1.6rem; padding: 15px;}
.lp01_content_02_inbox_01 > dl dd .txt{font-size: 1.4rem; padding: 15px 15px; text-align: left;}
.lp01_content_02_inbox_02 > dl{width: 100%;}
.lp01_content_02_inbox_02 > dl > dt{font-size: 2.0rem; padding: 10px 5px;}
}


.lp01_content_03{background: var(--white);padding: 120px 0 20px;}
.lp01_content_02_list{margin-bottom: 60px;}
.lp01_content_02_list > li{display: flex;flex-wrap:wrap;justify-content:  space-between;padding: 30px 0;border-bottom: 1px solid var(--c_lp_02);color: var(--c_lp_02);}
.lp01_content_02_list > li .lp01_02_list_left{width: 650px;}
.lp01_content_02_list > li .lp01_02_list_right{width: 500px;box-sizing: border-box;position: relative;}

.lp01_content_02_list > li .lp01_02_list_left .lp_sld_case span{line-height: 1.4;font-weight: bold;font-size: 1.8rem;width: 130px;text-align: center;}
.lp01_content_02_list > li .lp01_02_list_left .lp_sld_big{font-size: 3rem;font-weight: bold;line-height: 1.4;padding: 30px 0;}
.lp01_content_02_list > li .lp01_02_list_left .lp_sld_big .mini{font-size: 2rem;}
.lp01_content_02_list > li .lp01_02_list_left p.txt{font-size: 1.6rem;font-weight: 500;}



@media screen and (max-width: 767px) {
.lp01_content_03{padding: 60px 0 0;}
.lp01_content_02_list > li .lp01_02_list_left{width: 100%;}
.lp01_content_02_list > li .lp01_02_list_right{width: 100%;margin-top: 30px;}
.lp01_content_02_list > li .lp01_02_list_left .lp_sld_case span{width: 80px;font-size: 1.4rem;}
.lp01_content_02_list > li .lp01_02_list_left .lp_sld_big{font-size: 2.0rem;padding: 15px 0;}
.lp01_content_02_list > li .lp01_02_list_left .lp_sld_big .mini{font-size: 1.4rem;}
.lp01_content_02_list > li .lp01_02_list_left p.txt{font-size: 1.4rem;}
}

.lp01_content_02_frow{margin-bottom: 10px;display: block;}

.lp01_content_02_frow_txt{font-size: 1.6rem;color: var(--c_lp_02);}

.lp01_faq{padding: 100px 0;}


@media screen and (max-width: 767px) {
.lp01_content_02_frow_txt{font-size: 1.4rem;margin-bottom: 50px;}
.lp01_faq{padding: 60px 0;}
}
#lp01_contact{padding: 115px 0 0 0;}
@media screen and (max-width: 767px) {
#lp01_contact{padding: 60px 0 0 0;}
} 

