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

  * {
    font-feature-settings: "palt";
  }

  .pc {
    display: block;
  }

  .sp {
    display: none;
  }

  .mid_width {
    width: 90%;
    padding: 40px 20px;
  }

  .mid_width.extra {
    padding: 0px 20px;
  }

  .slim_width {
    width: 90%;
    padding: 40px 20px;
  }

  .gray {
    margin-top: 0px;
    padding: 0px 0;
  }

  .blue {
    margin-top: 0px;
    padding: 0px 0;
  }


  #contact_btn_sp {
    display: none;
  }


  /*title*/

  .title1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px;
    margin-top: 20px;
  }

  #member .title1 {
    margin-bottom: 0px;
  }

  #support .title1 {
    margin-top: 20px;
    margin-bottom: 0px;
  }

  #contents .title1 {
    margin-bottom: 40px;
  }



  .title1.extra {
    margin-top: 0px;
    margin-bottom: 0px;
  }



  .title1 h2 {
    font-size: 30px;
  }

  .title1 span {
    font-size: 14px;
    margin-bottom: 20px;
  }

  .title1 h3 {
    text-align: center;
    font-size: 24px;
    margin-bottom: 20px;
    margin-top: 30px;
    line-height: 1.5;
  }

  .title1 p {
    text-align: center;
    font-size: 14px;
    line-height: 1.5;
    color: #404040;
  }


  .title2 {
    padding-left: 10px;
    border-left: 6px solid #559fd2;
    font-size: 24px;
    margin-bottom: 0px;
  }


  .title3 {
    font-size: 18px;
    width: 280px;
    margin: 0 auto;
    height: 52px;
    line-height: 52px;
    margin-bottom: 40px;
    border-radius: 50px;
    margin-top: 50px;
  }

  .profile .title3 {
    margin: 0;
    margin-bottom: 40px;
  }

  .title3.white {
    font-size: 14px;
    width: 80%;
    margin: 0 auto;
    height: 35px;
    line-height: 35px;
    font-weight: bold;
    margin-top: 10px;
  }


  .title3.yellow {
    background-color: #ffc400;
    color: #fff;
    font-size: 16px;
    width: 360px;
    margin: 0 auto;
    height: 50px;
    line-height: 50px;
    font-weight: bold;
    margin-top: 10px;
  }


  .title3.flow {
    background-color: #fff;
    color: #559fd2;
    font-size: 18px;
    width: 270px;
    margin: 0 auto;
    height: 48px;
    line-height: 48px;
    font-weight: bold;
    margin-top: 10px;
  }



  .title4 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 20px;
    margin-top: 20px;
    line-height: 1.5;
  }

  .title5 {
    font-size: 17px;
    color: #fff;
    text-align-last: center;
    font-weight: bold;
    line-height: 1.3;
    margin-top: 20px;
  }


  .title6 {
    font-size: 16px;
    font-weight: bold;
    display: block;
  }


  .price {
    margin-top: 20px;
    font-size: 16px;
    color: #fff;
    margin-top: -10px;
  }

  .price span {
    font-family: din-condensed, sans-serif;
    font-size: 60px;
    letter-spacing: -3px;
  }

  .detail {
    margin-top: -30px;
    color: #fff;
  }

  .item .title3:first-child {
    margin-top: 0px;
  }




  /*contents*/

  .flex {
    display: flex;
    flex-wrap: wrap;
  }

  .flex.flow {
    justify-content: space-between;
    padding: 0 40px;
  }


  .container {
    margin-top: 60px;
    margin-bottom: 60px;
  }

  .flex .item .txt {
    margin-bottom: 30px;
  }

  .txt.sub {
    font-size: 14px;
    line-height: 2;
  }

  .txt.sub span {
    font-size: 16px;
    padding-bottom: 2px;
    border-bottom: 1px solid #000;
    color: #559fd2;
  }

  .txt.sub i {
    margin-left: 6px;
    margin-right: 6px;
  }


  .flex .item .txt:last-child {
    margin-bottom: 0px;
  }

  .flex .item {
    width: 45%;
    height: auto;
  }

  .flex .item.img {
    width: 45%;
    height: auto;
  }

  .item.img {
    background-repeat: no-repeat;
    background-size: contain;
  }

  .item.img.taishou {
    background-image: url(../img/image1.jpg);
    background-position: 50% 0%;
    margin-left: auto;
  }

  .item.img.merit {
    background-image: url(../img/image2.jpg);
    background-position: 100% 0%;
    margin-right: auto;
  }


  .item.img.future {
    background-image: url(../img/image3.jpg);
    background-position: 100% 0%;
    margin-right: auto;

  }


  .item.img.group {
    background-image: url(../img/image4.jpg);
    background-position: 0% 0%;
    margin-right: auto;
  }

  .item.img.relation {
    background-image: url(../img/image5.jpg);
    background-position: 100% 50%;
    margin-right: auto;
    margin-left: 50px;
  }


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


  .flex.column3 {
    flex-wrap: wrap;
  }


  .flex.column3 .box {
    width: 32%;
    height: 370px;
    margin-right: 2%;
    background-color: #559fd2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
    border-radius: 30px;
  }

  .flex.column3 .box:nth-child(3n) {
    margin-right: 0px;
  }

  #support .column3,
  #company .column3 {
    justify-content: space-between;
    margin-top: 60px;
  }

  #support .column3 div,
  #company .column3 div {
    width: 32%;
    text-align: center;
  }

  .room p {
    font-size: 13px;
    font-weight: bold;
    line-height: 1.8;
  }

  .room p:last-child {
    font-weight: bold;
    line-height: 1;
    font-weight: normal;
  }


  .style {
    width: 100%;
    ;
    height: 350px;
    background-color: #f09dc1;
    position: relative;
    display: flex;
    align-items: center;
    text-align: center;
    padding: 20px;
    margin-bottom: 50px;
  }

  .style.last {
    margin-bottom: 40px;
  }

  .style.blue {
    background-color: #559fd2;
    margin-top: 0px;
  }

  .style img {
    position: absolute;
    left: 10px;
    bottom: 0px;
  }

  .style img.one {
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: -1
  }

  .style img.right {
    position: absolute;
    left: auto;
    right: 10px;
    bottom: 0px;
  }

  .style div {
    margin-left: auto;
    padding-right: 40px;
  }

  .style div.right {
    margin-left: 0;
    margin-right: auto;
    padding-right: 0px;
    padding-left: 40px
  }


  .style p:nth-child(1) {
    color: #fff;
    font-size: 20px;
  }

  .style p:nth-child(2) {
    color: #fff;
    font-size: 40px;
    font-weight: bold;
  }

  .style p:nth-child(3) {
    font-size: 27px;
    font-weight: bold;
    color: #fff;
    margin-top: -50px;
    margin-bottom: -50px;
  }

  .style p:nth-child(3) span {
    font-family: din-condensed,
      sans-serif;
    font-size: 150px;
    letter-spacing: -3px;
  }


  .style p:nth-child(4) {
    color: #fff;
    font-size: 14px;
  }


  .member {
    margin-bottom: 100px;
  }

  .profile {
    width: 60%;
    margin-left: auto;
  }

  .profile p {
    margin-bottom: 30px;
  }

  .profile p:last-child {
    margin-bottom: 0px;
  }

  .face {
    width: 40%;
    text-align: center;
  }

  #support .center {
    text-align: center;
  }

  .center b {
    display: block;
    font-size: 18px;
    margin-bottom: 8px;
  }

  .seminar_title {
    margin-top: 100px;
  }

  .seminar_container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .seminar {
    position: relative;
    width: 48%;
    background-color: #f5f5f5;
    margin-top: 60px;
  }

  .seminar .title3 {
    background-color: #559fd2;
    margin: 0;
    width: 180px;
    height: 50px;
    position: absolute;
    top: 10px;
    left: 10px;
  }

  .seminar .info {
    padding: 20px 20px;
    text-align: center;
  }

  .seminar .info h3 {
    font-size: 20px;
    margin-bottom: 10px;
  }

  .seminar .info p {
    text-align: left;
    margin-bottom: 10px;
  }

  .seminar_price {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .seminar_price p {
    font-size: 20px;
    height: 30px;
    padding-top: 3px;
    font-weight: bold;

  }


  .seminar_price span {
    font-size: 15px;
    height: 30px;
    padding: 0 10px;
    padding-top: 1px;
    border: 1px solid #000;
    border-radius: 6px;
    margin-right: 10px;
  }


  .info_container {
    text-align: center;
  }

  .info_container b {
    font-size: 16px;
  }

  .info_container p {
    margin-bottom: 40px;

  }



  /*form*/

  .required {
    margin-left: 10px;
    font-size: 13px;
    border: 1px solid #fff;
    padding: 2px 6px;
    border-radius: 6px;
  }

  form label {
    display: flex;
    height: 30px;
    align-items: center;
    margin-bottom: -20px;
  }

  form label p {
    display: inline;
  }

  form {
    margin-top: 40px;
  }


  form .item {
    font-size: 16px;
    width: 340px;
    margin: 0 auto;
    margin-bottom: 30px;
  }

  form button {
    display: block;
    margin: 0 auto;
    background-color: #ffc400;
    color: #fff;
    width: 200px;
    height: 50px;
    font-size: 18px;
    border-radius: 10px;
    cursor: pointer;
    border: 0px;
  }

  form button:hover {
    opacity: 0.8;
  }


  form input {
    height: 50px;
    border-radius: 10px;
    border: 1px solid #fff;
    padding: 10px;
    font-size: 16px;
    line-height: 50px;

  }


  form input:not(.purpose):not(#age) {
    width: 100%;
  }

  .purpose {
    height: 30px;
  }


  #age {
    width: 100px;
  }

  .age {
    margin-left: 10px;
  }

  textarea {
    width: 100%;
    height: 250px;
    border-radius: 10px;
    border: 1px solid #fff;
    padding: 10px;
    font-size: 16px;
  }




  /*footer*/

  footer {
    background-color: #444;
    margin-bottom: 0px;
    color: #fff;
    height: 50px;
    line-height: 50px;
  }

  .copylight {
    text-align: center;
    font-size: 14px;
  }

}