/*******************************************************************/
/* PC */
/*******************************************************************/
@media print, screen and (min-width: 769px) {
  /*<start>==========================================================*/
  /*=================================================================*/
  /*	mainvisual */
  /*=================================================================*/
  .mainvisual {
    width: 100%;
    height: 800px;
    background: url(../images/top/mainbg.png) no-repeat center;
    background-size: cover;
  }
  .mainvisual .inner {
    padding-top: 195px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 80px;
  }
  /*=================================================================*/
  /*	about */
  /*=================================================================*/
  .about {
    width: 100%;
    background: url(../images/top/bg_section01.png) no-repeat center top 65px;
    background-size: auto;
    padding: 172px 0 237px;
  }
  .about .inner > div {
    display: flex;
    gap: 86px;
  }
  .about .inner > div .aboutBox {
    width: 570px;
    margin-top: 184px;
  }
  .about .inner > div .aboutBox .ttl {
    margin-bottom: 30px;
  }
  .about .inner > div .aboutBox .aboutTxt {
    font-size: 1.8rem;
    font-weight: 300;
    line-height: 1.6;
    padding-bottom: 25px;
    border-bottom: 2px solid #d6d6d6;
    margin-bottom: 25px;
  }
  .about .inner > div .aboutBox .aboutLink a {
    width: 280px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.8rem;
    margin-bottom: 20px;
  }
  .about .inner > div .aboutBox .aboutLink a span {
    text-align: center;
    font-size: 10px;
    color: #fff;
    background: #dd6b74;
    border-radius: 9px;
    line-height: 18px;
    width: 48px;
    height: 18px;
  }
  /*=================================================================*/
  /*	consultation */
  /*=================================================================*/
  .consultation {
    width: 100%;
    background: url(../images/top/bg_section02.png) no-repeat center top -10px;
    background-size: auto;
    margin-top: -86px;
    padding-bottom: 138px;
  }
  .consultation .inner > div {
    display: flex;
    gap: 36px;
  }
  .consultation .inner > div .conBox {
    width: 600px;
    margin-top: 144px;
  }
  .consultation .inner > div .conBox .ttl {
    margin-bottom: 30px;
  }
  .consultation .inner > div .conBox .conTxt {
    font-size: 1.8rem;
    font-weight: 300;
    line-height: 1.6;
    padding-bottom: 25px;
    border-bottom: 2px solid #d6d6d6;
    margin-bottom: 25px;
  }
  .consultation .inner > div .conBox .conLink a {
    width: 380px;
    height: 80px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 2.4rem;
    font-weight: 500;
    color: #fff;
    background-color: #f6ab34;
    border-radius: 10px;
    margin-bottom: 38px;
    box-sizing: border-box;
    padding: 0 20px;
  }
  .consultation .inner > div .conBox .conLink a span {
    text-align: center;
    font-size: 10px;
    color: #fff;
    background: #dd6b74;
    border-radius: 9px;
    line-height: 18px;
    width: 48px;
    height: 18px;
  }
  .consultation .inner > div .conBox .conLink a:last-child {
    background-color: #ea687d;
  }
  /*=================================================================*/
  /*	info */
  /*=================================================================*/
  .info {
    width: 100%;
    background: url(../images/top/bg_section03.png) no-repeat left -300px bottom -200px #fff;
    padding: 80px 0 53px;
  }
  .info .ttl {
    text-align: center;
  }
  .info ul.infoList {
    width: 1120px;
    margin: 40px auto 40px;
    border-top: 1px solid #dbdad6;
  }
  .info ul.infoList li {
    width: 100%;
    padding: 26px 20px;
    box-sizing: border-box;
    border-bottom: 1px solid #dbdad6;
    display: flex;
    gap: 30px;
  }
  .info ul.infoList li .days {
    font-size: 1.6rem;
    font-family: "M PLUS 1p", sans-serif;
    font-weight: 500;
    color: #b0ab97;
  }
  .info ul.infoList li .cat {
    width: 110px;
    height: 25px;
    text-align: center;
    box-sizing: border-box;
    font-size: 1.4rem;
    color: #333;
    background-color: #f4efdc;
    padding: 0 16px;
    border-radius: 20px;
  }
  .info ul.infoList li a {
    font-size: 1.6rem;
    font-weight: 500;
    color: #333;
    flex: 1;
  }
  .info ul.infoList li a:hover {
    text-decoration: underline;
  }
  /*=================================================================*/
  /*	event */
  /*=================================================================*/
  .event {
    width: 100%;
    padding: 80px 0;
    background: url(../images/top/bg_section04_01.png) no-repeat top -30px left -60px, url(../images/top/bg_section04_02.png) no-repeat bottom right -60px;
  }
  .event .ttl {
    text-align: center;
  }
  .event ul.eventList {
    margin-top: 60px;
    display: flex;
    justify-content: center;
    gap: 54px;
    margin-bottom: 60px;
  }
  .event ul.eventList li {
    width: 300px;
  }
  .event ul.eventList li a {
    display: block;
  }
  .event ul.eventList li a .img {
    width: 300px;
    height: 200px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #d6d6d6;
    border-radius: 20px;
  }
  .event ul.eventList li a .img img {
    width: auto;
    height: 100%;
  }
  .event ul.eventList li a .days {
    font-size: 1.4rem;
    font-family: "M PLUS 1p", sans-serif;
    font-weight: 500;
    color: #b0ab97;
    margin-top: 18px;
  }
  .event ul.eventList li a .eventTtl {
    font-size: 1.8rem;
    font-weight: 500;
    color: #333;
  }
  /*<end>============================================================*/
}
/*******************************************************************/
/* SP */
/*******************************************************************/
@media screen and (max-width: 768px) {
  /*<start>==========================================================*/
  /*=================================================================*/
  /*	mainvisual */
  /*=================================================================*/
  .mainvisual {
    width: 100%;
    background: url(../images/top/mainbg.png) no-repeat center;
    background-size: cover;
  }
  .mainvisual .inner {
    padding-top: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2%;
  }
  .mainvisual .inner .visualL, .mainvisual .inner .visualR {
    width: 48%;
    height: auto;
  }
  /*=================================================================*/
  /*	about */
  /*=================================================================*/
  .about {
    width: 100%;
    background: url(../images/top/bg_section01.png) no-repeat center top 65px;
    background-size: auto;
    padding: 52px 0 290px;
  }
  .about .inner > div {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  .about .inner > div .aboutBox {
    width: 100%;
    margin-top: 34px;
  }
  .about .inner > div .aboutBox .ttl {
    margin-bottom: 30px;
  }
  .about .inner > div .aboutBox .ttl img {
    width: auto;
    height: 50px;
  }
  .about .inner > div .aboutBox .aboutTxt {
    font-size: 1.6rem;
    font-weight: 300;
    line-height: 1.6;
    padding-bottom: 25px;
    border-bottom: 2px solid #d6d6d6;
    margin-bottom: 25px;
  }
  .about .inner > div .aboutBox .aboutLink a {
    width: 90%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.8rem;
    margin-bottom: 20px;
  }
  .about .inner > div .aboutBox .aboutLink a span {
    text-align: center;
    font-size: 10px;
    color: #fff;
    background: #dd6b74;
    border-radius: 9px;
    line-height: 18px;
    width: 48px;
    height: 18px;
  }
  .about .inner > div img {
    width: 80%;
    height: auto;
  }
  /*=================================================================*/
  /*	consultation */
  /*=================================================================*/
  .consultation {
    width: 100%;
    background: url(../images/top/bg_section02.png) no-repeat center top -10px;
    background-size: auto;
    margin-top: -86px;
    padding-bottom: 38px;
  }
  .consultation .inner > div {
    display: flex;
    flex-direction: column-reverse;
    gap: 16px;
  }
  .consultation .inner > div .conBox {
    width: 100%;
    margin-top: 24px;
  }
  .consultation .inner > div .conBox .ttl {
    margin-bottom: 30px;
  }
  .consultation .inner > div .conBox .ttl img {
    width: auto;
    height: 50px;
  }
  .consultation .inner > div .conBox .conTxt {
    font-size: 1.6rem;
    font-weight: 300;
    line-height: 1.6;
    padding-bottom: 25px;
    border-bottom: 2px solid #d6d6d6;
    margin-bottom: 25px;
  }
  .consultation .inner > div .conBox .conLink a {
    width: 100%;
    height: 80px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 2.2rem;
    font-weight: 500;
    color: #fff;
    background-color: #f6ab34;
    border-radius: 10px;
    margin-bottom: 38px;
    box-sizing: border-box;
    padding: 0 20px;
  }
  .consultation .inner > div .conBox .conLink a span {
    text-align: center;
    font-size: 10px;
    color: #fff;
    background: #dd6b74;
    border-radius: 9px;
    line-height: 18px;
    width: 48px;
    height: 18px;
  }
  .consultation .inner > div .conBox .conLink a:last-child {
    background-color: #ea687d;
  }
  .consultation .inner > div img {
    width: 80%;
    height: auto;
  }
  /*=================================================================*/
  /*	info */
  /*=================================================================*/
  .info {
    width: 100%;
    background: url(../images/top/bg_section03.png) no-repeat left -300px bottom -200px #fff;
    padding: 80px 0 53px;
  }
  .info .ttl {
    text-align: center;
  }
  .info .ttl img {
    width: auto;
    height: 50px;
  }
  .info ul.infoList {
    width: 92%;
    margin: 40px auto 40px;
    border-top: 1px solid #dbdad6;
  }
  .info ul.infoList li {
    width: 100%;
    padding: 26px 20px;
    box-sizing: border-box;
    border-bottom: 1px solid #dbdad6;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
  }
  .info ul.infoList li .days {
    font-size: 1.6rem;
    font-family: "M PLUS 1p", sans-serif;
    font-weight: 500;
    color: #b0ab97;
  }
  .info ul.infoList li .cat {
    width: 110px;
    height: 25px;
    text-align: center;
    box-sizing: border-box;
    font-size: 1.4rem;
    color: #333;
    background-color: #f4efdc;
    padding: 0 16px;
    border-radius: 20px;
  }
  .info ul.infoList li a {
    width: 100%;
    font-size: 1.6rem;
    font-weight: 500;
    color: #333;
    display: block;
  }
  /*=================================================================*/
  /*	event */
  /*=================================================================*/
  .event {
    width: 100%;
    padding: 80px 0;
    background: url(../images/top/bg_section04_01.png) no-repeat top -30px left -60px, url(../images/top/bg_section04_02.png) no-repeat bottom right -60px;
  }
  .event .ttl {
    text-align: center;
  }
  .event .ttl img {
    width: auto;
    height: 50px;
  }
  .event ul.eventList {
    margin: 60px auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 34px;
  }
  .event ul.eventList li {
    max-width: 300px;
    width: 80%;
  }
  .event ul.eventList li a {
    display: block;
  }
  .event ul.eventList li a .img {
    width: 100%;
    aspect-ratio: 300/200;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #d6d6d6;
    border-radius: 20px;
  }
  .event ul.eventList li a .img img {
    width: auto;
    height: 100%;
  }
  .event ul.eventList li a .days {
    font-size: 1.4rem;
    font-family: "M PLUS 1p", sans-serif;
    font-weight: 500;
    color: #b0ab97;
    margin-top: 18px;
  }
  .event ul.eventList li a .eventTtl {
    font-size: 1.6rem;
    font-weight: 500;
    color: #333;
  }
  /*<end>============================================================*/
}

/*# sourceMappingURL=top.css.map */