@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');
*{
    box-sizing: border-box;
}
body{
    font-family: 'Noto Serif JP', serif;
    color: #000000;
    font-weight: 600;
    line-height: 1.6;
    font-size: 14px;
    scroll-behavior: smooth;
}
img{
    max-width: 100%;
}
.mb__16{
    margin-bottom: 16px;
}
.mb__32{
    margin-bottom: 32px;
}
.mb__64{
    margin-bottom: 64px;
}
.w80{
    width: 80%;
}

.main__block{
    background: url(../images/back_main.svg);
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100vh;
    position: fixed;
    overflow-y: scroll;
    top: 0;
    left: 0;
}
.back_ra{
    background: url(../images/back_ra.svg);
    background-size: cover;
    background-position: center;
}
.contents__block{
    position: fixed;
    left: 5vw;
    top: 0;
    width: clamp(375px , 40% , 414px);
    max-width: 100%;
    background: #fff;
    height: 100vh;
    z-index: 1;
    overflow-y: scroll;
    box-shadow: 0 0 4px #dadada;
}
.balloon {
    position: relative;
  border: 3px solid #000000;
  border-radius: 20px;
  text-align: center;
  width: 70%;
  background-color: #fff;
  padding:  16px 24px;
  margin: auto;
}
.balloon > div{
    position: relative;
    z-index: 10;
}
.balloon::before {
  content: "";
  position: absolute;
  bottom: -17px;
  left: 50%;
  transform: translateX(-50%) rotate(-45deg);
  transform-origin:center center;
  width: 30px;
  height: 30px;
  background-color: #fff;
  border-bottom: 3px solid #000000;
  border-left: 3px solid #000000;
}
.h1__ttl{
    font-size: 48px;
    font-weight: 600;
    line-height: 1.2;
    margin-top: 64px;
}
.h1__ttl span.h1__subtext{
    font-size: 21px;
    display: inline-block;
    line-height: 1.4;
    margin-top: 16px;
}
.h1__ttl span b{
    color: #AF2929;
}
.left__text__center{
    display: flex;
    justify-content: center;
}
.mv{
    margin: 64px auto;
    width: 100%;
    padding: 0 5%;
}
.information{
    background: #000000;
    height: 80px;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
}
.information p{
    font-weight: 600;
    color: #fff;
    font-size: 16px;
    text-align: center;
    line-height: 1.2;
}
.information p b{
    font-size: 22px;
}
.price__box,
.contents__item{
    padding: 56px 0;
}
.contents__item2{
    padding: 16px 0;
}
.text-center{
    text-align: center;
}
p small{
    font-size: 14px;
}
.h2__ttl{
    font-size: 32px;
    text-align: center;
    font-weight: 600;
    position: relative;
    margin-bottom: 32px;
}
.h2__ttl span{
    display: inline-block;
    position: relative;
    padding-bottom: 8px;
}
.h2__ttl i{
    width: 182px;
    height: 5px;
    background: #900000;
    position: absolute;
    margin: auto;
    bottom: 0;
    left: 0;
    right: 0;
}
.point__text{
    font-size: 24px;
}
.point__text small{
    font-size: 14px;
}
.point__list{
    padding: 32px 5%;
    font-size: 20px;
}
.point__list li{
    margin: 8px 0;
    list-style-image: url("../images/list_image.svg"); /* 画像ファイルのパスを指定 */
}
.flex__center{
    display: flex;
    justify-content: center;
}
.attention{
    color: #900000;
}
.h3__ttl{
    display: inline-block;
    font-size: 20px;
    text-align: center;
    padding: 4px;
    border: 2px solid #000
}
.h3__ttl2{
    font-size: 20px;
    text-align: center;
    padding: 4px;
}
.offer__box{
    padding: 32px 0;
}
.offer1{
    width: 159px;
    height: 47px;
    background: #000;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 18px;
    font-size: 20px;
    color: #fff;
    text-decoration: none;
}
.offer2{
    width: 159px;
    height: 47px;
    background: #900000;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 18px;
    font-size: 20px;
    color: #fff;
    text-decoration: none;
}
.offer__pc{
    width: 280px;
    height: 104px;
}
.offer__item{
    display: flex;
    justify-content: center;
    column-gap: 16px;
}
.back__grey{
    background: #E9E9EE;
}
.time__table{
    font-size: 22px;
    display: flex;
    column-gap: 8px;
    align-items: center;
    width: 80%;
    margin: 0 auto 16px;
}
.time__table:last-child{
    margin-bottom: 0;
}
.time__table span{
    border: 2px solid #000;
    padding: 2px 8px;
    display: block;
}
.koushi__name{
    font-size: 18px;
    margin: 16px auto;
}
.koushi__name small{
    font-size: 11px;
}
.koushi__text{
    font-size: 11px;
    width: 80%;
    margin: 0 auto;
}
.check__list li{
    font-size: 14px;
}
.h2__ttl2{
    text-align: center;
    font-size: 18px;
}
.payment__item p{
    padding: 4px 8px;
    border: 1px solid #000;
    font-size: 18px;
    margin: 16px 8px 0;
}
.attention__box{
    width: 80%;
    margin: 0 auto;
}
.attention__box .attention{
    font-size: 16px;
}
.attention__box h3{
    font-size: 16px;
}
.attention__box div p{
    font-size: 11px;
}
p a{
    color: #291CC9;
    text-decoration: underline;
}
.pc__contents{
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 8vw;
    display: flex;
    align-items: center
}
.pc__ttl{
    font-size: 7vw;
    line-height: 1.2;
    margin-bottom: 2vw;
}
.offer__item2 {
    display: flex;
    justify-content: flex-start;
    column-gap: 16px;
}
.font__big{
    font-size: 30px;
}
@media screen and (max-width: 767px) {

    .pc__contents{
        display: none;
    }
    
}
@media screen and (max-width: 599px) {
    .contents__block{
        width: 100%;
        position: relative;
        left: 0;
        box-shadow: 0;
    }
}
.privacy{
    border: 1px solid #f5f5f5;
    margin: 5%;
    padding: 5% 0;
    height: 300px;
    overflow-y: scroll;
}
.thanks__item{
    width: 880px;
    max-width: 100%;
    margin: auto;
    display: flex;
    align-items: center;
    height: 100%;
}
.thanks__item h2{
    font-size: 180%;
    text-align: center;
    margin-bottom: 5%;
}
.h100{
    height: 100%;
}