@charset "utf-8";

strong, span, p, em, b, a, small, br, li
{
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    font-family: inherit;
    line-height: inherit;
}
ul
{
    list-style: square;
}
img, svg
{
   vertical-align: middle;
}
img
{
   max-width: 100%;
}

iframe
{
  width: 500px;
  height: 281px;
}
#EYECATCH_IMG_SP, #SEC01_TTL_SP
{
   display: none;
}
/*アイキャッチ*/
#EYECATCH_IMG
{
   max-width: 1000px;
   width: 100%;
}
#ARERGO_LOGO
{
   z-index: 1;
   left: 0;
   top: 50%;
}
#SK_LOGO
{
   width: 200px;
   z-index: 1;
   left: 0;
   top: 53%;
}
#EYECATCH_SUV
{
   position: absolute;
   width: 250px;
   bottom: 15%;
   left: 50%;
   transform: translateX(-50%);
}
#EYECATCH_SUVTTL
{
   z-index: 1;
   left: 0;
   top: 63%;
}
#EYECATCH_SUVTTL span
{
   display: inline-block;
   padding: 0 0 0 .3em;
   margin: 0 0 5px;
   color: #003dcf;
   font-size: 1.3rem;
   line-height: 1.357;
   font-weight: 700;
   background: #fff;
}
#EYECATCH_RIGHT
{
   z-index: 1;
   right: 0;
   color: #002bb3;
   text-align: right;
   top: 50%;
   margin-right: 5px;
}
#EYECATCH_RIGHT_SEMINARNAME
{
   position: relative;
   text-align: center;
}
#EYECATCH_RIGHT_SEMINARNAME::before
{
   position: absolute;
   content: '';
   background-image: url(../img/eyecatch_ttl_svg.svg);
   width: 65px; 
   height: 25px;
   background-size: contain;
   background-repeat:no-repeat;
   top: -30px;
   left: 35%;
}
.cta_button1
{
   display: flex;
   align-items: center;
   justify-content: center;
   line-height: 1;
   text-decoration: none;
   color: #ffffff;
   font-size: 1.1rem;
   border-radius: 50px;
   width: 250px;
   height: 50px;
   font-weight: bold;
   transition: 0.3s;
   background-image: linear-gradient(0deg, rgba(214, 16, 101, 1) 0%, rgba(199, 22, 54, 1) 100%);
   box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.5);
   text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
   border: 2px solid #c71636;
   right: 0px;
   top: 70px;
   position: absolute;
   margin-right: 5px;
 }
 
 .cta_button1:hover {
   box-shadow: 0 0 rgba(0, 0, 0, 0);
 }
 .cta_button1 p
 {
   position: relative;
    display: inline-block;
 }
 .cta_button1::after
 {
   content: '';
   width: 8px;
   height: 8px;
   margin-top: -4px;
   border-top: solid 2px #FFFFFF;   /* 好みで色を変えてください */  
   border-right: solid 2px #FFFFFF;   /* 好みで色を変えてください */  
   transform: rotate(45deg);
   position: absolute;
   top: 50%;
   right: 30px;
 }
/*sec01*/
.ttl_wrap
{
   text-align: center;
   max-width: 100%;
   width: 60%;
   margin: 0 auto;
}
#SEC01_SOLUTION
{
   clip-path: polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%);
}
#SEC01_IMG
{
  max-width: 400px;
  width: 90%;
}
.cta_button2 {
   position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
   line-height: 1;
   text-decoration: none;
   color: #ffffff;
   font-size: 1.1rem;
   border-radius: 50px;
   max-width: 450px;
   width: 100%;
   height: 60px;
   margin: 0 auto;
   font-weight: bold;
   transition: 0.3s;
   background-image: linear-gradient(0deg, rgba(214, 16, 101, 1) 0%, rgba(199, 22, 54, 1) 100%);
   box-shadow: 0px 5px 5px 0px rgba(255, 255, 255, 0.3);
   text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
   border: 2px solid #c71636;
 }
 .cta_button2:hover {
   box-shadow: 0 0 rgba(0, 0, 0, 0);
 }
 .cta_button2::after
 {
   content: '';
   width: 8px;
   height: 8px;
   margin-top: -4px;
   border-top: solid 2px #FFFFFF;   /* 好みで色を変えてください */  
   border-right: solid 2px #FFFFFF;   /* 好みで色を変えてください */  
   transform: rotate(45deg);
   position: absolute;
   top: 50%;
   right: 25px;
 }
 .cta_button3 {
   position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-decoration: none;
    color: #ffffff;
    font-size: 1.1rem;
    border-radius: 50px;
    max-width: 350px;
    width: 100%;
    height: 60px;
    margin: 0 auto;
    font-weight: bold;
    transition: 0.3s;
    background-image: linear-gradient(0deg, rgba(214, 16, 101, 1) 0%, rgba(199, 22, 54, 1) 100%);
    box-shadow: 0px 5px 5px 0px rgba(255, 255, 255, 0.3);
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
    border: 2px solid #c71636;
  }
  
  .cta_button3:hover {
    box-shadow: 0 0 rgba(0, 0, 0, 0);
  }
  .cta_button3::after
  {
    content: '';
    width: 8px;
    height: 8px;
    margin-top: -4px;
    border-top: solid 2px #FFFFFF;   /* 好みで色を変えてください */  
    border-right: solid 2px #FFFFFF;   /* 好みで色を変えてください */  
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 40px;
  }
 .clippath_bottom
 {
   margin-top: -100px;
 }
/*sec02*/
.sec02ttl_wrap
{
   text-align: center;
   max-width: 100%;
   width: 40%;
   margin: 0 auto;
}
#SEC02_TXT
{
   border: 5px solid #dbe6ec;
   padding-left: 5px;
   padding-right: 5px;
}
/*sec03*/
#SEC03
{
   position: relative;
   z-index: -1;
   margin-top: -25px;
   background-image: url(../img/dot_bg.png);
   background-size: 7px;
   clip-path: polygon(40% 0, 50% 80px, 60% 0, 100% 0, 100% 100%, 0 100%, 0 0);
}
.orange_box
{
   border: 2px solid #ea7c26;
   padding: 0px 5px;
   margin-right: 5px;
}
.orange_border
{
   border-bottom: 2px solid #ea7c26;
}
/*sec04*/
#SEC04_BOX
{
   border-radius: 20px;
   border: 2px solid #07326e;
}
#SEC04_BOX_TOP
{
   border-radius: 20px 20px 0 0;
}
#SEC04_BOX_BOTTOM
{
   border-radius: 0 0 20px 20px;
}
#SEC04_BOX_TOP_SUB
{
   padding: 5px 20px;
   border-radius: 20px;
   border: 3px solid #07326e;
   top: -25px;
   left: 50%;
   transform: translateX(-50%);
}
#SEC04_TXTBOX
{
   padding: 30px 100px;
}
#SEC04_ICON2
{
   right: -8px;
   top: -20px;
   width: 150px;
}
#SEC04_UL
{
   list-style: none;
}
#SEC04_UL li
{
   left: 35px;
   margin-top: 10px;
}
#SEC04_UL li::before
{
   position: absolute;
   content: '';
   background-image: url(../img/sec04_ul_icon.svg);
   background-repeat: no-repeat;
   padding-bottom: 5px;
   width: 35px;
   height: 35px;
   left: -45px;
}
#TRIANGLE_BOX
{
   padding-left: 5px;
   padding-right: 5px;
}
#TRIANGLE_BOX::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border-bottom: 80px solid transparent;
  border-right: 80px solid #07326e;
  z-index: 100;
}
#TRIANGLE_BOX::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  border-top: 80px solid transparent;
  border-left: 80px solid #07326e;
  z-index: 100;
}

/*sec05*/
#SEC05
{
   position: relative;
   z-index: -1;
   clip-path: polygon(40% 0, 50% 80px, 60% 0, 100% 0, 100% 100%, 0 100%, 0 0);
   background-color: #f2f2f2;
}
.blueshadow_box
{
   background-color: #FFFFFF;
   border: 2px solid #333333;
   padding: 10px ;
   line-height: 5rem;
   box-shadow: 5px 5px 0px 0px rgba(79, 183, 192, 1);
}
.dot_yellow
{
   display: inline-block;
   position: relative;
}
.dot_yellow::before
{
   position: absolute;
   top: -0.8em;
   left: 50%;
   transform: translate(-50%, 0);
   color: #ffdb49;
   font-size: 1em;
   content: "・";
}
#SEC05_ICON1
{
   max-width: 350px;
}
#SEC05_ICON2::before
{
   position: absolute;
   content: url(../img/sec05_icon2.svg);
   width: 150px;
   height: 180px;
   right: -150px;
   top: -20px;
}
#SEC05_TEACHER_TXT
{ 
   background-color: #FFFFFF;
   border-radius: 20px;
   padding-top: 15px;
   padding-bottom: 15px;
}
/*sec06*/
#SEC06
{
   background:repeating-linear-gradient(130deg,
   #f0f3f8,
   #f0f3f8 5px,
   #fff 0,
   #fff 10px
   );
}
.pink_box
{
   color: #e93a7d;
   border: 2px solid #e93a7d;
   padding: 0px 5px;
   margin-right: 5px;
   line-height: 2rem;
}
.pink_border
{
   border-bottom: 2px solid #e93a7d;
}
/*sec07*/
#SEC07
{
   position: relative;
   z-index: -1;
   background-image: url(../img/dot_bg.png);
   background-size: 7px;
}
.bl_stepNav {
   display: flex;
   padding-right: 30px;
}
.bl_stepNav_item {
   flex: 1 1 auto;
   line-height: 1;
   min-width: 160px;
   padding: 31px 10px 31px 42px;
   position: relative;
}
.bl_stepNav_item:first-child {
   background: #80bfff;
}
.bl_stepNav_item:nth-child(2) {
   background: #55aaff;
}
.bl_stepNav_item:nth-child(3) {
   background: #2b95ff;
}
.bl_stepNav_item:nth-child(4) {
   background: #0080ff;
}
.bl_stepNav_item:nth-child(5) {
   background: #0055aa;
}
.bl_stepNav_item_inner {
   align-items: center;
   display: flex;
   position: relative;
   word-break: keep-all;
   z-index: 2;
}
.bl_stepNav_num {
   color: #fff;
   font-weight: 700;
   padding-right: .5em;
}
.bl_stepNav_txt {
   color: #fff;
   font-weight: 700;
}
.bl_stepNav_item:after {
   border-bottom: 40px solid transparent;
   border-left: 30px solid #80bfff;
   border-top: 40px solid transparent;
   content: "";
   height: 0;
   inset: 0 -30px auto auto;
   position: absolute;
   width: 0;
   z-index: 1;
}
.bl_stepNav_item:first-child:after {
   background: linear-gradient(to right top, hsla(0, 0%, 100%, 0) 50%, #80bfff 50.5%) 0 0 / 50% 100% no-repeat, linear-gradient(to left top, hsla(0, 0%, 100%, 0) 50%, #80bfff 50.5%) 100% 0 / 50% 100% no-repeat;
}
.bl_stepNav_item:nth-child(2):after {
   background: linear-gradient(to right top, hsla(0, 0%, 100%, 0) 50%, #55aaff 50.5%) 0 0 / 50% 100% no-repeat, linear-gradient(to left top, hsla(0, 0%, 100%, 0) 50%, #55aaff 50.5%) 100% 0 / 50% 100% no-repeat;
   border-left-color: #55aaff;
}
.bl_stepNav_item:nth-child(3):after {
   background: linear-gradient(to right top, hsla(0, 0%, 100%, 0) 50%, #2b95ff 50.5%) 0 0 / 50% 100% no-repeat, linear-gradient(to left top, hsla(0, 0%, 100%, 0) 50%, #2b95ff 50.5%) 100% 0 / 50% 100% no-repeat;
   border-left-color: #2b95ff;
}
.bl_stepNav_item:nth-child(4):after {
   background: linear-gradient(to right top, hsla(0, 0%, 100%, 0) 50%, #0080ff 50.5%) 0 0 / 50% 100% no-repeat, linear-gradient(to left top, hsla(0, 0%, 100%, 0) 50%, #0080ff 50.5%) 100% 0 / 50% 100% no-repeat;
    border-left-color: #0080ff;
}
.bl_stepNav_item:nth-child(5):after {
   background: linear-gradient(to right top, hsla(0, 0%, 100%, 0) 50%, #0055aa 50.5%) 0 0 / 50% 100% no-repeat, linear-gradient(to left top, hsla(0, 0%, 100%, 0) 50%, #0055aa 50.5%) 100% 0 / 50% 100% no-repeat;
   border-left-color: #0055aa;
}
#STEP li
{
   max-width: 700px;
   margin: 0 auto 50px;
}
#STEP li img
{
   max-width: 130px;
}
#SEC07_BOX
{
   border: 3px solid;
   border-image: linear-gradient(to right, #6525a2, #19aeca) 1;
   background-color: #FFFFFF;
}
.teacher_name:after
{
   position: absolute;
   content: 'Nakata Kouichi';
   font-size: 0.8rem;
   bottom: -15px;
}
/*sec08*/
.voice_orange_border
{
   background: repeating-linear-gradient(130deg, #ffeea8, #ffeea8 5px, #fff 0, #fff 10px);
   background-repeat: no-repeat;
   background-position: left bottom;
   background-size: 100% 40%;
}
.teacher_wrap img
{
   max-width: 300px;
}
/*sec09*/
#SEC09_HUKIDASHI::before
{
   position: absolute;
   content: '';
   background-image: url(../img/sec09_before.svg);
   background-repeat: no-repeat;
   width: 25px;
   height: 40px;
   left: -30px;
}
#SEC09_HUKIDASHI::after
{
   position: absolute;
   content: '';
   background-image: url(../img/sec09_after.svg);
   background-repeat: no-repeat;
   width: 25px;
   height: 40px;
   right: -30px;
}
.cta_ttl2
{
   border-radius: 50px;
   background-color: #ffffff;
   padding: 5px 30px;
   border: 5px solid #07326e;
   margin-top: -25px;
}
#CTA_TTL2_SP
{
   display: none;
}
/*sec10*/

#SUMMARY_TABLE
{
   border-collapse: separate;
   border-spacing: 0;
}
#SUMMARY_TABLE th
{
   color: #ffffff;
   background-color: #003dcf;
   border: 1px solid #333;
   padding: 10px 0;
}
#SUMMARY_TABLE th:nth-child(1)
{
   border-radius: 10px 0 0 0;
}
#SUMMARY_TABLE th:nth-child(3)
{
   border-radius: 0 10px 0 0;
}
#SUMMARY_TABLE td
{
   border: 1px solid #333;
   padding: 5px 0;
   background-color: #FFFFFF;
}
#SUMMARY_DATE_TTL
{
   margin-left: 20px;
}
#SUMMARY_DATE_TTL::before
{
   position: absolute;
   content: '';
   width: 5px;
   height: 100%;
   background-color: #4fb7c0;
   margin-left: -15px;
}
/*sec11*/


/* ----------------------------------------------------------------------------- */
/* 1200px以下 */
/* ----------------------------------------------------------------------------- */
@media screen and (max-width : 1200px)
{
    .width_minus_40
    {
       width: calc(100% - 40px);
    }
    .margin_bottom150
    {
       margin-bottom: 50px;
    }
    .padding_bottom150
    {
      padding-bottom: 50px;
    }
    .margin_top100
    {
        margin-top: 50px;
    }
    .font_size_100
    {
       font-size: 5rem;
    }
    .font_size_80
    {
       font-size: 4rem;
    }
    .font_size_50
    {
       font-size: 2.4rem;
    }
    .font_size_32
    {
        font-size: 1.5rem;
     }
    .font_size_36
    {
        font-size: 1.6rem;
     }
     .font_size_40
    {
        font-size: 1.8rem;
     }
     .font_size_28
     {
         font-size : 1.3rem;
      }
    .font_size_24
    {
        font-size : 1.125rem;
     }
    h3.font_size_24
    {
        font-size: 1.3rem;
     }
     .font_size_21
    {
        font-size : 1rem;
     }
     .font_size_18
    {
        font-size : 0.95rem;
    }
    .bl_stepNav {
      display: block;
      margin: 0 auto;
      max-width: 540px;
      padding-right: 0;
   }
  .bl_stepNav_item {
      padding: 42px 10px 5px;
   }
   .bl_stepNav_item_inner {
      justify-content: center;
   }
   .bl_stepNav_item:after {
      border: 0 !important;
      inset: inherit;
      bottom: -38%;
      height: 38%;
      left: 0;
      width: 100%;
  }
  #EYECATCH_SUVTTL span
  {
      font-size: 1.1rem;
  }
  .cta_button1
  {
      font-size: 0.9rem;
  }
}

/* ----------------------------------------------------------------------------- */
/* 768px以下 */
/* ----------------------------------------------------------------------------- */
@media screen and (max-width : 768px)
{
    .font_size_100
    {
       font-size: 5rem;
    }
    .font_size_80
    {
       font-size: 3.1rem;
    }
    .font_size_50
    {
       font-size: 2rem;
    }
     .font_size_40
    {
        font-size: 1.5rem;
     }
    .font_size_14
    {
       font-size: 0.85rem;
    }
    .font_size_12
    {
       font-size: 0.65rem;
    }
    .font_size_28
    {
       font-size: 1.3rem;
    }
    .line_height_1rem
    {
       line-height: 0.8rem;
   }
    .width_minus_40
    {
        width: calc(100% - 20px);
    }
    .margin_bottom100
    {
        margin-bottom: 15vw;
    }
    .padding_bottom100
    {
        padding-bottom: 15vw;
    }
    .margin_top100
    {
        margin-top: 15vw;
    }
    .margin_tb100
    {
       margin-top: 15vw;
       margin-bottom: 15vw;
    }
    .margin_tb75
    {
        margin-top: 9.7vw;
        margin-bottom: 9.7vw;
    }
    .margin_top50
    {
       margin-top: 8vw;
    }
    .margin_tb50
    {
       margin-top: 7vw;
       margin-bottom: 7vw;
    }
    .padding_top150
    {
        padding-top: 19vw;
    }
    .padding_tb100
    {
       padding-top: 15vw;
       padding-bottom: 15vw;
    }
    .padding_tb50
    {
       padding-top: 7vw;
       padding-bottom: 7vw;
    }
    .padding_bottom50
    {
        padding-bottom: 7vw;
    }
    .eyecatch_font_size_21
    {
       font-size: 1.2rem;
    }
    .flex_columnreverse
    {
        flex-direction: column-reverse;
    }
    .fixed_cta
    {
       width: 250px;
       right: 10px;
       bottom: 15px;
    }
    .display_flex_768column
    {
      flex-direction: column;
    }
    #SEC04_ICON1, #SEC05_ICON1
    {
       width: 150px;
    }
    #SEC04_TXT
    {
      padding-left: 10px;
      text-align: center;
      line-height: 2rem;
    }
}

/* ----------------------------------------------------------------------------- */
/* 450px以下 */
/* ----------------------------------------------------------------------------- */
@media screen and (max-width : 450px)
{
    *
    {
        font-size: 13px;
    }
    iframe
    {
      width: 300px;
      height: 200px;
    }
    .font_size_80
    {
       font-size: 2rem;
    }
    .font_size_36
    {
        font-size: 1.4rem;
    }
    .font_size_28
    {
        font-size: 1.1rem;
    }
    #EYECATCH_SUV
    {
      width: 150px;
      bottom: 45%;
    }
    #EYECATCH_IMG, #SEC01_TTL
    {
      display: none;
    }
    #EYECATCH_IMG_SP, #SEC01_TTL_SP
    {
      display: block;
    }
    .ttl_wrap, .sec02ttl_wrap
    {
      width: 90%;
    }
    #SEC05_ICON2::before
    {
      width: 85px;
      right: -25px;
      top: 25px;
    }
    #ARERGO_LOGO
    {
      width: 130px;
      top: 38%;
    }
    #SK_LOGO
    {
       width: 130px;
       top: 37%;
    }
    #EYECATCH_SUVTTL
    {
      top: 46%;
    }
    #EYECATCH_SUVTTL span
    {
      margin: 0 0 5px;
    }
    #EYECATCH_RIGHT
    {
      position: unset;
      background-color: #FFFFFF;
      margin-right: unset;
      padding: 50px 0 30px;
    }
    .cta_button1
    {
      position: relative;
      margin-right: unset;
      margin: 10px auto;
      top: unset;
      right: unset;
    }
    #EYECATCH_RIGHT_SEMINARNAME::before
    {
      left: 41%;
    }
    #SEC01_IMG
    {
      max-width: 200px;
    }
    .cta_button2
    {
      font-size: 1rem;
      width: 85%;
      height: 45px;
      margin-top: 50px;
    }
    .cta_button2::after
    {
      right: 15px;
    }
    .cta_button3
    {
      font-size: 1rem;
      width: 50%;
      height: 40px;
    }
    .cta_button3::after
    {
      right: 15px;
    }
    #SEC03, #SEC05
    {
      clip-path: polygon(30% 0, 50% 40px, 70% 0, 100% 0, 100% 100%, 0 100%, 0 0);
    }
    #SEC04_ICON2
    {
      right: -10px;
      width: 70px;
      bottom: 0;
      top: unset;
  }
   #SEC04_TXTBOX
   {
      padding: 20px 60px 20px 17px;
   }
   #TRIANGLE_BOX::before
   {
      border-bottom: 50px solid transparent;
      border-right: 50px solid #07326e;
   }
   #TRIANGLE_BOX::after
   {
      border-top: 50px solid transparent;
      border-left: 50px solid #07326e;/
   }
   #SEC04_UL li::before
   {
      width: 25px;
      height: 20px;
      left: -35px;
   }
   #SEC04_UL li
   {
      left: 20px;
   }
   .line_height_25rem
   {
      line-height: 2rem;
   }
   .br_off
   {
      display: none;
   }
   .gap_50
   {
      gap: 20px;
   }
   #STEP li img
   {
      max-width: 90px;
   }
   .teacher_wrap img
   {
      max-width: 200px;
   }
   #CTA_TTL2_SP
   {
      display: block;
   }
   #CTA_TTL2
   {
      display: none;
   }
   .cta_ttl2
   {
      width: 200px;
   }
}