@media screen and (min-width: 751px) {
	.line-btn.pc a {
		border: 1px solid #19d219;
		background: #fff;
		text-decoration: none;
		display: flex;
		border-radius: 100px;
		padding: 5px 10px;
		height: 50px;
		width: 250px;
		justify-content: center;
		align-items: center;
		color: #19d219;
		font-size: 18px;
	}
	.line-btn.pc a img {
		margin-right: 10px;
		width: 33px;
	}
	.header-btn a {
	width: 250px;
  
  text-align: center;
  justify-content: center;
}
	
  footer>.inner-sm {
    width: 1300px;
  }

  .ft-last {
    margin-left: 40px;
  }

  .uline-ft.cus {
    display: flex;
    justify-content: center;
    width: 480px;
    margin: 50px auto 0;
  }

  .uline-ft.btn_blue {
    width: 640px;
  }

  .help-bl:hover,
  .it-post:hover {
    opacity: .7
  }

  @keyframes mainvs_anime {
    0% {
      transform: scale(1.2);
      opacity: 0
    }

    100% {
      transform: scale(1);
      opacity: 1
    }
  }

  @keyframes mainct_anime {
    0% {
      opacity: 0;
      filter: blur(10px)
    }

    100% {
      opacity: 1;
      filter: blur(0px)
    }
  }

  .img-vs[data-aos=fade][data-aos] {
    -webkit-animation-name: mainvs_anime;
    animation-name: mainvs_anime;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
  }

  .ct-vs[data-aos=fade][data-aos] {
    -webkit-animation-name: mainct_anime;
    animation-name: mainct_anime;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
  }

  body [data-aos=fade][data-aos] {
    opacity: 0;
    -webkit-filter: blur(10px);
    filter: blur(10px);
    -webkit-transition: 1s;
    transition: 1s
  }

  body [data-aos=fade][data-aos].aos-animate {
    opacity: 1;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    -webkit-transition: 1s;
    transition: 1s
  }

  .tab-btn-if [data-aos=fade][data-aos],
  .wr-vid [data-aos=fade][data-aos] {
    opacity: 0;
    -webkit-transform: translate(0, 100px);
    transform: translate(0, 100px);
    -webkit-transition: all 1.5s;
    transition: all 1.5s
  }

  .tab-btn-if [data-aos=fade][data-aos].aos-animate,
  .wr-vid [data-aos=fade][data-aos].aos-animate {
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
  }

  .bl1-course [data-aos=fade][data-aos],
  .img-learn [data-aos=fade][data-aos] {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    opacity: 0;
    -webkit-transition: 2s;
    transition: 2s
  }

  .bl1-course [data-aos=fade][data-aos].aos-animate,
  .img-learn [data-aos=fade][data-aos].aos-animate {
    opacity: 1;
    -webkit-transition: 2s;
    transition: 2s;
    -webkit-transition-delay: .2s;
    transition-delay: .2s;
    -webkit-transform: scale(1);
    transform: scale(1)
  }

  .msg[data-aos=fade][data-aos],
  .main-post[data-aos=fade][data-aos],
  .tab-price[data-aos=fade][data-aos] {
    opacity: 0;
    -webkit-transform: translate(0, 100px);
    transform: translate(0, 100px);
    -webkit-transition: all 1.5s;
    transition: all 1.5s
  }

  .msg[data-aos=fade][data-aos].aos-animate,
  .main-post[data-aos=fade][data-aos].aos-animate,
  .tab-price[data-aos=fade][data-aos].aos-animate {
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
  }

  #lightboxOverlay,
  #lightbox {
    min-width: var(--content-width) !important;
    width: 100% !important
  }

  .sp {
    display: none !important
  }

  a:hover {
    text-decoration: none
  }

  .to-top a:hover {
    opacity: .7
  }

  .main-vs .help-btn2 a {
    padding: 0 34px
  }

  .header-nav a,
  .header-nav .has-sub {
    transition: all .2s ease-in
  }

  .header-nav.header-top a:hover,
  .header-nav.header-top .has-sub:hover {
    opacity: .7;
  }

  header.change-bg-hd .header-nav.header-top a:hover,
  header.change-bg-hd .header-nav.header-top .has-sub:hover {
    color: #fff;
    opacity: 1;
	  text-shadow: none;
  }

  .header-nav a:hover,
  .header-nav .has-sub:hover {
    color: #001F3F
  }

  .bl-child li a:hover {
    text-decoration: underline;
    text-underline-offset: 8px;
    opacity: .7
  }

  .header-btn a {
    transition: all .2s ease-in
  }

  .header-btn a:hover {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
    color: #fff
  }

  .nav-sub .bx-sub {
    transition: all .2s ease-in
  }

  .nav-sub .bx-sub:hover {
    opacity: .7
  }

  .btn-price {
    transition: all .2s ease-in
  }

  /* .btn-price:not(.active):hover {
    opacity: .7
  } */
  .btn-if {
    transition: all .2s ease-in
  }

  .btn-if:not(.active):hover {
    color: var(--color-primary);
    background-color: #fff
  }

  .btn-all a {
    transition: all .2s ease-in
  }

  .btn-all a:hover {
    border: 1px solid var(--color-secondary);
    background-color: #fff;
    color: var(--color-secondary)
  }

  .btn-all a:hover::after {
    content: "";
    display: block;
    position: absolute;
    background: url(../images/btn-arrow-black.png) no-repeat;
    width: 39px;
    height: 39px;
    background-size: contain;
    right: 8px
  }

  .prev-arrow,
  .next-arrow {
    transition: all .2s ease-in
  }

  .prev-arrow:hover,
  .next-arrow:hover {
    opacity: .7
  }

  .tab-if {
    --space: -66px;
    margin-left: var(--space);
    margin-right: var(--space)
  }
}

@media screen and (min-width: 751px)and (max-width: 1900px) {
  .wrap-vs-01 {
    justify-content: center;
    padding: 130px 0 0 0;
  }

  .ct-vs-01 {
    width: 1200px;
    display: flex;
    flex-direction: column;
    /*align-items: flex-end;*/
	align-items: last baseline;
  }

  .h2-vs-01 {
	  font-size: 50px;
    width: 730px;
    margin-bottom: 30px;
  }

  .sub-vs-01 {
    font-size: 22px;
    /*width: 720px*/
  }
	.sub-vs-01 span{
    font-size: 25px;
		border-bottom: 4px solid #F39D32;
  }

}

@media screen and (min-width: 751px)and (max-width: 1750px) {
  .btn-vs {
    left: 10px;
  }

  .header-wr {
    height: 80px;
    padding: 0 15px
  }

  .logo {
    width: 220px
  }

  .header-nav a {
    font-size: 15px
  }

  .header-nav ul li:not(:last-child) {
    margin-right: 25px
  }

  .header-btn {
    margin-left: 20px
  }

  .header-btn a {
    padding: 7px 15px
  }

  /*  .sec-if {
    padding-top: 190px
  }*/


  /*  .main-vs {
    max-height: 650px
  }

  .main-vs .ct-vs {
    width: 640px;
  }

  .main-vs .slogan-vs {
    width: 400px
  }

  .h2-vs {
      font-size: 42px;
  }
  .sub-vs{
      font-size: 18px;
  }
*/

  .main-vs .help-vs {
    max-width: 1400px;
    padding-top: 15px;
    bottom: -10%
  }

  .help-line {
    right: 0;
  }

  .main-vs .help-img {
    width: 160px
  }

  .main-vs .help-btn a {
    font-size: 14px;
    width: 280px
  }

  .help-desc {
    font-size: 14px;
  }

  .sec-course .bx-course .bl2-course {
    padding: 20px 20px 30px 60px
  }

  .sec-course .bx-course .bl1-course {
    flex: unset;
    width: 50%
  }

  .sec-course .bx-course .tit-course {
    margin-bottom: 20px
  }

  .sec-course .bx-course .desc-course {
    margin-bottom: 20px
  }

  .sec-arist .wr-arist::before {
    left: 80px
  }

  .sec-vid .wr-vid {
    max-width: calc(100% - 240px);
    margin-left: auto;
    margin-right: auto
  }

  .sec-learn .img-learn {
    width: 48%;
    margin-right: 0
  }

  .sec-learn .ct-learn {
    width: 52%;
    padding-left: 50px;
    padding-top: 0
  }

  .h4-all {
    font-size: 28px
  }

  .sec-learn .desc-learn {
    margin-bottom: 30px
  }

  .sec-learn {
    padding-bottom: 60px
  }

  .sec-vid .view-it-vid {
    width: 100%
  }

  .sec-vid .it-vid {
    padding: 30px 30px 30px
  }

  .sec-price .person-price {
    right: 0
  }

  .lt1280 {
    display: block;
    max-height: 650px
  }

  .ltn1280 {
    display: none
  }
}

@media screen and (min-width: 1280px)and (max-width: 1750px) {}

@media screen and (min-width: 751px) {}

@media screen and (min-width: 751px)and (max-width: 1366px) {
	.line-btn.pc a {
		font-size: 13px;
		padding: 5px 10px;
		width: 180px;
		height: 40px;
	}
	.line-btn.pc a img {
		width: 28px;
		margin-right: 5px;
	}
  .header-btn a {
    font-size: 13px;
	  width: 180px;
	  height: 40px;
  }

  .line-btn {
    margin-left: 15px;
  }
  .logo {
    width: 160px;
  }

  .header-nav ul li:not(:last-child) {
    margin-right: 15px;
  }

  .header-btn {
    margin-left: 10px;
  }

  .tab-if {
    --space: 0
  }

  .main-vs .help-vs {
    max-width: 970px;
  }

  .help-line {
    top: 9px;
    width: 36px;
  }

  .btn-vs .help-desc {
    font-size: 12px;
  }

  .help-tit {
    font-size: 16px;
    margin-bottom: 14px;
    margin-right: 24px;
  }

  .help-ct {
    position: relative;
    max-width: 600px;
    gap: 10px;
    padding-bottom: 90px;
  }

  .help-desc {
    font-size: 12px;
  }

  .main-vs .help-btn a {
    width: 260px;
    padding: 0 30px 2px 10px;
  }

  .help-video {
    max-width: 150px;
    margin-left: 10px;
  }

  .help-bl {
    padding: 5px 5px 8px;
  }

  .main-vs .help-img {
    position: absolute;
    bottom: 0;
    margin: 0 0;
    width: 140px;
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
  }

  .main-vs .help-img img {
    height: 96px;
    object-position: top center;
  }
}

@-moz-document url-prefix() {}

@media screen and (min-width: 1px)and (max-width: 750px) {
	#indexForm tr:nth-child(4) > td:nth-child(2) {
		display: flex;
		flex-direction: column;
	}
	.wrap-cpn-sp .ilist-btn {
		display: block;
	}
	.line-fixed a {
		background: #19d219;
		text-decoration: none;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #fff;
		font-weight: bold;
		font-size: 12px;
	}
	.line-fixed a img {
		width: 28px;
    	margin-right: 8px;
	}
	#menusp .header-btn a {
		margin-left: auto;
        margin-right: auto;
		width: 250px;
	}
	#menusp .line-btn.line-sp {
		margin-bottom: 10px;
		margin-right: 0;
	}
	#menusp .line-btn.line-sp a {
		border: 1px solid #19d219;
		background: #fff;
		text-decoration: none;
		display: flex;
		border-radius: 100px;
		height: 50px;
		width: 250px;
		justify-content: center;
		align-items: center;
		color: #19d219;
		font-size: 16px;
		margin-left: auto;
        margin-right: auto;
	}
	#menusp .line-btn.line-sp img {
		width: 28px;
		margin-right: 8px;
	}
	
	.uline-ft .line-btn-cus a {
		max-width: 280px;
		height: 60px;
		font-size: 16px;
	}
	.uline-ft .ucontainer.line-btn-cus a img {
		width: 35px;
		margin-right: 10px;
	}
	
  .sec-qa {
    padding: 40px 0;
  }

  .sec-qa .qabox {
    background: #f4f4f4;
    padding: 15px;
  }

  .sec-qa dl {
    background: #fff;
    padding: 10px 15px 10px;
    border-radius: 16px;
  }

  .sec-qa dl:not(:last-child) {
    margin-bottom: 15px
  }

  .sec-qa dl dt {
    align-items: flex-start;
    padding: 10px 15px 10px 0;
  }

  .sec-qa dl dt span.first {
    width: 40px;
    top: 0;
    padding: 0 3px 4px;
  }

  .sec-qa dl dt span {
    width: calc(100% - 50px);
  }

  .sec-qa dl dt::after {
    top: 16px;
  }

  .box_yt_thumb:before {
    width: 60px;
    height: 60px;
  }

  .uline-ft.btn_or .ubtn {
    max-width: 300px;
    height: auto;
    font-size: 18px;
  }

  /*  */
  .sec-form .formbox {
    padding: 15px 15px;
  }

  .sec-form .formbox table tr>th,
  .sec-form .formbox table tr>td {
    width: 100%;
    display: block;
  }

  .sec-form .formbox table tr>td {
    border: none;
  }

  .sec-form .formbox table tr input {
    padding: 10px 15px;
  }

  #indexForm .ct_btn>input {
    width: 100%;
    max-width: 250px;
  }

  /*  */

  .ttl_yt_sub2 {
    font-size: 18px;
    line-height: 1.4;
  }

  .img-list a {
    width: 100%;
    margin: auto;
    max-width: 410px;
    grid-template-columns: repeat(1, 1fr);
  }

  .uline-ft.cus .ubtn {
    max-width: 300px;
    padding-left: 70px;
    margin-left: auto;
    margin-right: auto;
  }

  .tag-list {
    display: block;
  }

  .tag-item.left {
    margin-right: 0;
    text-align: center;
  }

  .tag-item.right {
    padding-left: 0;
    padding-top: 15px;
    margin-top: 15px;
  }

  .tag-item.right:before {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 1px;
  }

  .item-line a img {
    width: 50px;
  }

  .menusp .header-btn a {
    width: 204px;
  }

  .btn-wrapper .btn-all a:after,
  .btn-list .btn-all a:after {
    left: 16%;
  }

  .uline-ft .ubtn:before {
    left: 14%;
  }

  .uline-ft .ubtn {
    padding-left: 60px;
  }

  .btn-wrapper .btn-all a,
  .btn-list .btn-all a {
    font-size: 18px;
    height: 54px;
    padding-left: 60px;
    max-width: 280px;
  }

  #wrapper {
    min-width: unset !important
  }

  .pc {
    display: none !important
  }

  .inner {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px
  }

  .inner-sm {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px
  }

  .br512 {
    display: block
  }

  .br449 {
    display: block
  }

  .mh100vh {
    height: 100vh;
    max-height: 100vh
  }

  .sec-arist .wr-msg-arist .left-msg .msg-img::before {
    width: 40px;
    height: 42px
  }

  .sec-arist__inner {
    padding: 10px;
    border-radius: 10px;
  }

  .sec-arist__inner .__bg {
    padding: 10px;
  }

  .sec-if .btn-all,
  .sec-price .btn-all {
    bottom: -17px
  }

  .sec-if .btn-all a,
  .sec-course .bx-course .btn-all a,
  .sec-learn .btn-all a {
    width: 200px;
  }

  .bl-child .ft-top-tit a,
  .bl-child .ft-menu-tit {
    font-size: 16px
  }

  .bl-child li a {
    font-size: 14px
  }

  .ft-stick .ft-stick-tel .ic-tel::before {
    top: -9px;
    margin: 0 auto
  }

  .h3-all {
    font-size: 22px
  }

  .h3-sub {
    font-size: 16px;
    margin-bottom: 1em
  }

  .h4-all {
    font-size: 20px;
    margin-bottom: .9em
  }

  .open-hamb {
    overflow: hidden
  }

  .open-hamb header {
    background: #62bee7
  }

  .open-hamb header .menusp {
    opacity: 1;
    visibility: visible
  }

  .menusp {
    overflow-y: scroll;
    position: fixed;
    left: 0;
    top: 60px;
    background: #62bee7;
    width: 100%;
    height: 100vh;
    opacity: 0;
    visibility: hidden;
    transition-property: visibility opacity;
    transition-duration: .75s;
    transition-timing-function: ease;
    z-index: 1000;
    padding-bottom: 70px
  }

  .menusp .menu-list>li {
    border-bottom: 1px solid #fff
  }

  .menusp .menu-list>li>a {
    text-decoration: none;
    font-size: 16px;
    padding: 23px 0;
    line-height: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all .3s ease;
    color: #fff;
    text-decoration: none;
    font-weight: 300;
    letter-spacing: .01em
  }

  .menusp .menu-list>li>a::before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto 0;
    background: url(../images/arrow-sub-menu-sp.png) no-repeat center;
    background-size: contain;
    width: 24px;
    height: 14px;
    color: #fff
  }

  .menusp .menu-list .dropdown span {
    text-decoration: none;
    font-size: 16px;
    padding: 23px 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all .3s ease;
    color: #fff;
    text-decoration: none;
    font-weight: 300;
    letter-spacing: .01em
  }

  .menusp .menu-list .dropdown span::before {
    content: "";
    position: absolute;
    background: #fff;
    transition: .3s ease;
    top: 0;
    bottom: 0;
    margin: auto 0;
    right: 13px;
    width: 1px;
    height: 17px;
    display: block
  }

  .menusp .menu-list .dropdown span::after {
    content: "";
    position: absolute;
    background: #fff;
    transition: .3s ease;
    top: calc(50% - .5px);
    right: 5.5px;
    width: 17px;
    height: 1px;
    display: block
  }

  .menusp .menu-list .dropdown.open span::before {
    transform: rotate(90deg)
  }

  .menusp .sub-menu {
    display: none
  }

  .menusp .sub-menu .ttl-sub-menu {
    font-size: 15px;
    color: #fff;
    line-height: 1.5;
    margin-bottom: 15px
  }

  .menusp .sub-menu-link {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin-bottom: 30px
  }

  .menusp .sub-menu-link .bx-sub-img {
    margin-bottom: 0
  }

  .menusp .sub-menu-link .bx-sub-tit {
    margin-bottom: 0;
    margin-top: 2px;
    font-size: 14px;
    color: #fff
  }

  .menusp .sub-menu-link .bx-sub {
    width: calc((100% - 20px)/2);
    margin-bottom: 20px;
    position: relative
  }

  .menusp .sub-menu-link .bx-sub a {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
  }

  .menusp .sub-menu-link .bx-sub:not(:nth-child(2n), :nth-child(2n+1):nth-last-child(1)) {
    margin-right: 20px
  }

  .menusp .sub-menu-link .bx-sub:nth-child(2n):last-child,
  .menusp .sub-menu-link .bx-sub:nth-child(2n+1):nth-last-child(1),
  .menusp .sub-menu-link .bx-sub:nth-child(2n+1):nth-last-child(2) {
    margin-bottom: 0
  }

  .menusp .wrap-cpn-sp {
    padding: 0 15px 150px
  }

  .ilist-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
  }

  .menusp .header-btn {
    margin-left: 0;
    text-align: center
  }

  .menusp .header-btn.btn02-sp {
    margin-left: 63px;
  }

  .menusp .ilist-btn {
    flex-wrap: wrap;
  }

  .menusp .header-btn a {
    font-size: 16px;
    display: block;
  }

  .menusp .line-btn {
    margin-left: 0;
    margin-right: 20px;
  }

  .menusp .line-btn a {}

  .btn-all a {
    font-size: 14px;
    min-height: 34px;
    width: 100%;
    max-width: 340px;
    min-width: 180px;
    margin: auto;
    padding: 0 20px;
    height: 40px;
    line-height: 1.2em
  }

  .btn-all a::before {
    right: 10px;
    width: 12px;
    height: 10px
  }

  .logo {
    width: 160px;
    padding-left: 15px
  }

  #menu-toggle {
    width: 38px;
    height: 38px;
    background: none;
    position: unset;
    margin-right: 15px;
    display: block
  }

  #menu-toggle>span {
    width: 35px;
    left: unset;
    right: 15px
  }

  #menu-toggle>span:nth-child(1) {
    top: 17px
  }

  #menu-toggle>span:nth-child(2),
  #menu-toggle>span:nth-child(3) {
    top: 29px
  }

  #menu-toggle>span:nth-child(4) {
    top: 41px
  }

  #menu-toggle.open-hamb span:nth-child(1),
  #menu-toggle.open-hamb span:nth-child(4) {
    top: 29px;
    width: 0%;
    left: 9999px
  }

  #menu-toggle.open-hamb span:nth-child(2) {
    transform: rotate(45deg)
  }

  #menu-toggle.open-hamb span:nth-child(3) {
    transform: rotate(-45deg)
  }

  .header-wr {
    height: 60px
  }

  .img-vs {
    height: 100vh;
    max-height: 100vh
  }

  .img-vs img {
    display: none !important
  }

  .main-vs {
    position: relative;
    background: #83b7e6
  }

  .btn-vs {
    position: relative;
    top: unset;
    left: unset;
    z-index: 4;
    width: 100%;
  }

  .btn-vs .help-bl {
    width: 100%;
    max-width: 368px;
    margin-left: auto;
    margin-right: auto;
    height: auto;
  }

  .main-vs::before {
    display: block;
    position: absolute;
    content: "";
    width: 100%;
    height: calc(290px + 40vw);
    background: url(../images/person-vs.png) no-repeat left 94% bottom 50px;
    background-size: auto 90%;
    z-index: 4
  }

  .main-vs .ct-vs {
    right: 0;
    left: 0;
    padding: 15px 15px 10px;
    top: 305px;
    z-index: 1;
    bottom: unset;
    position: unset;
    --spacing: 12vw;
    margin-top: calc(1px - var(--spacing));
    padding-bottom: calc(10px + var(--spacing) - 60px)
  }

  .main-vs .ct-vs::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    z-index: -1
  }

  .main-vs .slogan-vs {
    width: min(86vw, 300px);
    max-width: 550px;
    margin-bottom: 10px;
    position: relative;
    z-index: 5
  }

  .main-vs .h2-vs {
    font-size: min(7vw, 25px);
    position: relative;
    z-index: 5
  }

  .help-vs {
    bottom: -107px;
    right: 0;
    border-radius: unset;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    display: block;
    box-shadow: unset;
    width: 100%;
  }

  .help-video .htmlvid img {
    width: 260px;
  }

  .help-vs .help-wrap {
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 15px;
    margin-left: 0;
    background-color: #fff;
    /* padding-bottom: 15px; */
    padding-bottom: 0;
    overflow: hidden
  }

  .help-vs .help-ct {
    margin-bottom: 10px;
    align-items: center
  }

  .help-vs .help-tit {
    font-size: 15px;
    margin-bottom: 10px
  }

  .help-vs .help-desc {
    font-size: 14px;
    line-height: 1.3em
  }

  .help-img {
    display: block;
    margin: 10px;
    width: 95px;
    flex: unset
  }

  .help-bl {
    padding: 5px 10px 10px;
    flex: unset;
    width: calc(50% - 46px)
  }

  .help-btn a {
    height: unset;
    width: 100%;
    max-width: 230px;
    min-width: unset;
    margin: auto;
    font-size: 12px
  }

  .help-btn a::before {
    right: 5px
  }

  .wrap-vs-vs {
    position: absolute;
    top: 290px;
    left: 0;
    right: 0;
    background-color: #83b7e6
  }

  .help-vs {
    padding-top: 15px;
    padding-bottom: 10px;
    background: unset;
    bottom: -68px;
    background-color: #79b8e8;
    position: unset;
    background: #fff;
    margin-top: 8vw;
  }

  .help-video {
    margin: 20px 0 20px;
  }

  .help-vs .help-ct {
    flex-direction: column;
    max-width: 300px;
    margin: 0 auto
  }

  .help-vs .help-bl {
    width: 100%
  }

  .help-vs .help-bl:not(:last-child) {
    margin-bottom: 10px
  }

  .help-vs .help-img {
    /* margin: 10px auto -20px; */
    margin: 10px auto;
  }

  .help-line {
    margin: 10px auto 0;
    width: 40px;
    position: static;
  }

  .btn-wrapper {
    padding: 40px 0 20px;
  }

  .sec-why .h3-all {
    margin-bottom: 20px;
  }

  .sec-why .box_number {
    padding: 20px;
  }

  .sec-why {
    padding: 30px 0 1px
  }

  .sec-if {
    padding: 30px 0 30px
  }

  .sec-if .btn-if {
    font-size: 16px;
    height: 40px
  }

  .sec-if .btn-if:not(:last-child) {
    margin-right: 1px
  }

  .sec-if .tab-ct-if {
    border-radius: 0px 0px 14px 14px;
    padding: 30px 10px 50px
  }

  .sec-if .tab-ct-if .nd-ct-if img:not(:last-child) {
    margin-bottom: 20px
  }

  .btn-list {
    padding: 40px 0;
  }

  .sec-course {
    padding: 40px 0 50px
  }

  .sec-course .bx-course {
    flex-direction: column
  }

  .sec-course .bx-course.blue-course {
    flex-direction: column-reverse
  }

  .sec-course .bx-course:not(:last-child) {
    margin-bottom: 30px
  }

  .sec-course .bx-course.revert {
    flex-direction: column
  }

  .sec-course .bx-course.revert .bl1-course {
    flex: unset
  }

  .sec-course .bx-course.revert .bl2-course {
    padding: 20px 15px
  }

  .sec-course .bx-course.revert .ps-course {
    max-width: 100%
  }

  .sec-course .bx-course .bl1-course {
    flex: unset
  }

  .sec-course .bx-course .bl2-course {
    padding: 20px 15px;
    width: 100%
  }

  .sec-course .bx-course.green-course {
    margin-top: 20px
  }

  .sec-course .bx-course .desc-course {
    margin-bottom: 20px;
    max-width: 100%
  }

  .sec-course .bx-course .desc-course p {
    font-size: 14px
  }

  .sec-course .bx-course .for-course {
    font-size: 15px
  }

  .sec-course .bx-course .num-course {
    font-size: 45px
  }

  .sec-course .bx-course .ps-course {
    max-width: 100%
  }

  .sec-course .bx-course .ps-course::before {
    width: calc(100% - 10vw);
    max-width: calc(100% - 170px);
    left: 50px
  }

  .sec-course .bx-course .tit-course {
    font-size: 26px;
    margin-top: 0;
    margin-bottom: 20px
  }

  .sec-course .bx-course.bl-course .ps-course::before {
    width: calc(100% - 10vw);
    max-width: calc(100% - 210px);
    inset: 0px -15px 0px 80px
  }

  .sec-course .bx-course.rd-course .ps-course::before {
    width: calc(100% - 10vw);
    max-width: calc(100% - 140px);
    inset: 0 0 0 25px
  }

  .sec-arist {
    padding: 30px 0
  }

  .sec-arist .wr-arist {
    /* padding: 0 10px */
  }

  .sec-arist .wr-arist::before {
    height: calc(100% + 60px);
    width: 100%;
    top: 0
  }

  .sec-arist .h3-all {
    margin-bottom: .4em
  }

  .sec-arist .h3-sub {
    margin-bottom: 1em
  }

  .sec-arist .arist-desc {
    margin-bottom: 30px
  }

  .sec-arist .arist-desc p {
    font-size: 14px
  }

  .sec-arist .wr-msg-arist {
    margin-top: 30px;
    margin-bottom: 30px
  }

  .sec-arist .wr-msg-arist .msg:not(:last-child) .msg-bubble {
    margin-bottom: 30px
  }

  .sec-arist .wr-msg-arist .msg-img {
    width: 70px;
    height: 70px;
    flex: 0 0 70px
  }

  .sec-arist .wr-msg-arist .msg-img::before {
    width: 40px;
    height: 42px
  }

  .sec-arist .wr-msg-arist .msg-bubble {
    max-width: 590px;
    background-color: #fff;
    border-radius: 45px;
    padding: 10px 15px;
    min-height: 30px;
    min-width: unset;
    text-align: left;
    position: relative
  }

  .sec-arist .wr-msg-arist .msg-bubble.msg-spec {
    padding: 10px 15px
  }

  .sec-arist .wr-msg-arist .msg-text p {
    font-size: 14px;
    line-height: normal
  }

  .sec-arist .wr-msg-arist .right-msg .msg-img {
    margin-left: 20px
  }

  .sec-arist .wr-msg-arist .right-msg .msg-bubble::before {
    height: 24px
  }

  .sec-arist .wr-msg-arist .left-msg .msg-img {
    margin-right: 20px
  }

  .sec-arist .wr-msg-arist .left-msg .msg-bubble::before {
    height: 20px;
    left: -20px
  }

  .sec-arist .btn-all a {
    width: 180px;
    max-width: 200px;
    min-width: 170px
  }

  .sec-learn {
    padding: 50px 0 0
  }

  .sec-learn .img-learn {
    margin-right: 0;
    padding-right: 15px
  }

  .sec-learn .ct-learn {
    padding: 20px 15px 0;
    text-align: center
  }

  .sec-learn .wr-learn {
    flex-direction: column
  }

  .sec-learn .h3-learn {
    margin-bottom: .9em
  }

  .sec-learn .desc-learn {
    margin-bottom: 20px
  }

  .sec-learn .desc-learn p {
    font-size: 14px
  }

  .sec-vid {
    padding: 0 0 50px
  }

  .sec-vid .view-it-vid {
    width: 100%;
    height: 200px;
    margin-bottom: 10px
  }

  .sec-vid .wr-vid {
    margin-bottom: 20px;
    justify-content: space-between
  }

  .sec-vid .it-vid {
    width: calc(50% - 5px);
    padding: 10px;
    margin-bottom: 25px
  }

  .sec-vid .it-vid:not(:nth-child(2n), :nth-child(2n+1):nth-last-child(1)) {
    margin-right: 0
  }

  .sec-vid .it-vid:nth-child(2n):last-child,
  .sec-vid .it-vid:nth-child(2n+1):nth-last-child(1),
  .sec-vid .it-vid:nth-child(2n+1):nth-last-child(2) {
    margin-bottom: 0
  }

  .sec-vid .it-vid:nth-child(2n+1):nth-last-child(2) {
    margin-bottom: 0
  }

  .sec-vid .tit-video {
    font-size: 16px;
    line-height: 1.3em
  }

  .sec-vid .desc-vdeo {
    font-size: 14px;
    line-height: normal
  }

  .sec-vid .btn-all a {
    width: 180px;
    max-width: 200px;
    min-width: 170px
  }

  .to-top {
    bottom: 105px
  }

  .to-top>a {
    width: 40px;
    height: 40px
  }

  .to-top>a::before {
    width: 10px;
    height: 10px;
    inset: 4px 0 0;
    margin: auto
  }

  .sec-price {
    padding-bottom: 60px;
    padding-top: 40px
  }

  .sec-price .tab-btn-price {
    flex-direction: column;
  }

  .sec-price .tab-ct-price {
    flex-direction: column;
    background-color: transparent;
  }

  .sec-price .ct-price {
    width: 100%;
  }

  .sec-price .ct-price:not(:last-child) {
    margin-bottom: 50px;
  }

  .sec-price .btn-price {
    width: 100%;
    font-size: 17px;
    letter-spacing: normal;
    height: auto;
    padding: 10px 6px;
  }

  .sec-price .btn-price.btn-price1 {
    letter-spacing: normal
  }

  .sec-price .btn-price.btn-price2 {
    letter-spacing: normal
  }

  .sec-price .btn-price.btn-price3 {
    letter-spacing: normal
  }

  .sec-price .ct-price {
    max-width: 100%;
    padding: 5px 10px 45px
  }

  .sec-price .bx-price {
    flex-direction: column;
    padding-bottom: 10px
  }

  .sec-price .bx-price p {
    line-height: normal
  }

  .sec-price .bx-price:last-of-type .main-price {
    margin: auto
  }

  .sec-price .bx-price:not(:first-child) {
    margin-top: 5px
  }

  .sec-price .stit-price {
    font-size: 18px;
    margin-right: 15px;
  }

  .utit-line {
    margin-bottom: 10px !important;
  }

  .sec-price .tit-price {
    text-align: center
  }

  .sec-price .tit-price .tag-price {
    font-size: 12px;
    margin-left: auto
  }

  .sec-price .main-price {
    font-size: 25px;
    margin: auto
  }

  .sec-price .main-price .per-price {
    font-size: 15px
  }

  .sec-price .person-price {
    bottom: -60px;
    right: 0px
  }

  .sec-price .person-price img {
    width: 63px
  }

  .sec-price .btn-all a {
    min-width: 170px;
    max-width: 170px
  }

  .sec-post {
    padding: 50px 0
  }

  .sec-post .h3-post {
    margin-bottom: .8em
  }

  .sec-post .wr-slider {
    margin-bottom: 20px;
    max-width: 100%
  }

  .sec-post .btn-all {
    margin-bottom: 0
  }

  .sec-post .btn-all a {
    width: 100%
  }

  .sec-post .ct-post {
    padding: 10px 15px
  }

  .sec-post .tit-post {
    font-size: 16px;
    line-height: 1.3em;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    display: -webkit-box
  }

  .sec-post .date-post {
    font-size: 12px
  }

  .sec-post .img-post {
    max-height: 250px;
    min-height: 180px
  }

  .sec-post .img-post img {
    max-height: 100%
  }

  .sec-post .it-post {
    width: 100% !important;
  }

  .sec-post .it-post:nth-child(2n+1) {
    margin-right: 0;
  }

  footer {
    padding: 30px 0;
    margin-bottom: 60px
  }

  footer .uline-ft {
    width: 50px;
    bottom: calc(100% + 15px);
  }

  .ft-logo {
    margin: auto
  }

  .ft-logo img {
    width: 203px
  }

  .ft-call a {
    font-size: 35px
  }

  .ft-time-work {
    font-size: 14px
  }

  .wr-ft-block {
    display: block
  }

  .ft-block-first {
    margin-bottom: 30px;
    width: 100%;
    text-align: center
  }

  .ft-block2 {
    margin-left: 0
  }

  .ft-block2 .bl-child {
    margin-bottom: 20px
  }

  .ft-block {
    flex-direction: column;
    margin-top: 15px
  }

  .bl-child ul {
    min-height: unset
  }

  .bl-child ul:not(:last-child) {
    margin-bottom: 20px
  }

  .bl-child li.ft-menu-tit {
    margin-bottom: 5px
  }

  .next-arrow {
    right: 10px
  }

  .prev-arrow {
    left: 10px
  }

  .prev-arrow,
  .next-arrow {
    width: 40px;
    height: 40px;
    z-index: 2;
    top: -125px
  }

  .prev-arrow::before,
  .next-arrow::before {
    width: 12px;
    height: 12px
  }

  address {
    text-align: center;
    margin-top: 30px
  }

  .uh4 {
    margin-bottom: 1em
  }

  .uh4 .jps {
    font-size: 19px
  }

  .uh4 .ens {
    font-size: 14px;
    margin-bottom: .4em
  }

  .uYoutube-list {
    flex-direction: column;
    align-items: center
  }

  .uYoutube-list>li {
    width: 100%;
    margin-right: 0;
    flex-direction: column;
    max-width: 450px
  }

  .uYoutube-list>li:not(:last-child) {
    margin-bottom: 20px
  }

  .uYoutube-img,
  .uYoutube-content {
    width: 100%
  }

  .uYoutube-content02 {
    padding-top: 0
  }

  .uYoutube-img {
    text-align: center
  }

  .uList-check li {
    font-size: 14px
  }

  .uList li {
    font-size: 14px
  }

  .uList li.mb2 {
    margin-bottom: 19px
  }

  .uList li:last-child {
    margin-bottom: 0
  }

  .uList-text li::before {
    /* top: 6px */
    top: 9px;
  }

  .f-info dt {
    margin-left: 0em;
  }

  .sec-course .bx-course .bl2-course {
    flex-direction: column;
  }

  .sec-course .bx-course .content-02 {
    margin-top: 30px;
    width: 100%;
  }

  .sec-video {
    margin-top: 40px;
  }

  .sec-video .ivideo {
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000;
  }

  .sec-video .ivideo img {
    object-fit: contain;
    max-height: 100%;
  }

  .sec-video .play-button {
    width: 80px;
  }

  .wrap-vs-01 {
    padding: 80px 3% 0px 0px;
  }

  .ct-vs-01 {
    /*width: 70%;*/
	  width: 100%;
	  align-items: center;
    padding-bottom: 15vw;
  }

  .h2-vs-01 {
    font-size: 4.5vw;
    margin-bottom: 3vw;
  }

  .sub-vs-01 {
    /*font-size: 2.4vw;*/
	  font-size: 2.6vw;
    padding: 1.5vw;
    border-radius: 2vw;
  }
	.sub-vs-01 span{
    font-size: 3vw;
		border-bottom: 3px solid #F39D32;
  }

  .l_blue {
    font-size: 18px;
  }

  .sec-arist .h3-sub.h3_arist {
    font-size: 24px;
  }

  .sec-arist .h3-sub.h3_arist1 {
    font-size: 18px;
  }

  .uline-ft.btn_blue {
    margin: 50px auto 0;
  }

  .uline-ft.btn_blue .ubtn {
    width: 90%;
    max-width: 450px;
    height: auto;
    padding: 20px 30px 18px;
    margin-left: auto;
    margin-right: auto;
  }

  .uline-ft.btn_blue .ubtn {
    background-size: 15px;
  }
  .sec_cta {
    padding: 15px 0 0px;
    background-color: #f4f4f4;
  }
  .sec_cta_in {
  	position: relative;
    padding: 10px 13px 20px;
  	max-width: 100%;
  }
	.sec_cta_txt {
    font-size: 14px;
    line-height: 1.4;
  }
	.sec_cta_btn a {
  font-size: 16px;
		padding: 10px 40px 10px 10px;
	}
	.sec_cta_btn img {
		width: 30px;
	}
	.sec_cta_btn a img {
    margin-right: 7px;
  }
	.cta_img_sp {
    max-width: 110px;
    transform: rotate(10deg);
		text-align: center;
		margin: 4vw auto 0;
}
}

@media screen and (min-width: 320px)and (max-width: 375px) {

  .sec-if .btn-if {
    font-size: 14px
  }

  .sec-price .btn-price {
    font-size: 17px;
  }

  .help-btn a {
    font-size: 12px;
    padding: 0 15px;
    min-width: unset
  }

  .help-btn a::before {
    width: 8px
  }
	.sec_cta_btn a {
  font-size: 0.8em;
		padding: 10px 30px 10px 10px;
		background: #47d45a url(../images/btn-arrow.png) no-repeat 96% center;
  background-size: 15px;
	}
}

@media screen and (min-width: 320px)and (max-width: 600px) {
  .sec-vid .h3-vid {
    margin-bottom: .4em
  }

  .sec-vid .it-vid {
    width: 100%
  }

  .sec-vid .it-vid:nth-child(2n+1):nth-last-child(2) {
    margin-bottom: 25px
  }

  .sec-vid .view-it-vid {
    height: 60vw;
    max-height: 300px
  }

}

@media screen and (min-width: 374px)and (max-width: 574px) {
  .help-vs {
    bottom: -80px
  }
}

@media screen and (min-width: 575px)and (max-width: 750px) {
  .help-vs {
    bottom: -105px
  }

  .sec-course .bx-course .bl2-course {
    flex-direction: row;
  }

  .sec-course .bx-course .content-02 {
    width: 340px;
    margin-top: 0;
  }
}

@media screen and (min-width: 375px)and (max-width: 750px) {
  .help-vs .help-ct {
    max-width: 400px
  }

  .help-vs .help-tit {
    font-size: 18px
  }

  .help-vs .help-desc {
    font-size: 16px
  }

  .btn-all.help-btn a {
    max-width: 280px;
    font-size: 14px
  }

  .help-img {
    width: 120px;
  }
}

@media screen and (min-width: 512px)and (max-width: 750px) {
  .br512 {
    display: none
  }
}

@media screen and (min-width: 449px)and (max-width: 750px) {
  .br449 {
    display: none
  }
}

@media screen and (max-width: 530px) {
  .menusp .header-btn.btn02-sp {
    margin-top: 20px;
  }

  .uline-ft.btn_blue .ubtn {
    font-size: 16px;
  }

  .box_frame {
    padding: 20px 30px;
  }

  .txt_imp {
    font-size: 18px;
  }

  .sec-arist .h3-sub.h3_arist {
    font-size: 18px;
  }

  .sec-arist .h3-sub.h3_arist1 {
    font-size: 16px;
  }

  .lg {
    font-size: 18px;
  }
}


@media screen and (max-width: 390px) {
  .help-vs .help-desc {
    font-size: 12px !important;
  }

  .uline-ft.btn_blue .ubtn {
    font-size: 4vw;
  }
}

@media screen and (max-width: 360px) {

  .help-vs .help-desc {
    font-size: 10px !important;
  }
}

@media(min-height: 320px)and (max-height: 375px) {
  .main-vs::before {
    background: url(../images/person-vs.png) no-repeat center 10px;
    background-size: 125px
  }

  .main-vs {
    height: 650px !important
  }

  .wrap-vs-vs {
    top: 135px
  }

  .help-vs .help-ct {
    flex-direction: row;
    max-width: unset;
    margin: unset
  }

  .main-vs .slogan-vs {
    width: 400px
  }

  .btn-all.help-btn a {
    width: unset
  }

  .help-vs .help-bl:not(:last-child) {
    margin-right: 10px;
    margin-bottom: 0
  }

  .nd-ct-if img {
    width: 300px
  }

  .help-vs .help-tit {
    font-size: 16px
  }

  .help-vs .help-img {
    width: 70px
  }
}

@-moz-document url-prefix() {}

@supports(-webkit-touch-callout: none) {
  @media screen and (min-width: 1px)and (max-width: 750px) {
    .main-vs {
      height: calc(100vh - 70px)
    }

    .help-vs {
      bottom: -120px
    }

    .sec-help {
      margin-top: 120px
    }
  }

  @media screen and (min-width: 320px)and (max-width: 374px) {
    .help-vs {
      bottom: -135px
    }
  }

  @media screen and (min-width: 375px)and (max-width: 574px) {
    .help-vs {
      bottom: -155px
    }
  }

  @media screen and (min-width: 575px)and (max-width: 750px) {
    .help-vs {
      bottom: -175px
    }
  }
}