* {
    box-sizing: border-box;
}
img {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}
#container {
    overflow:hidden;
}
.rich_font, .p-vertical { font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; font-weight:500; }
.color_font {
    color: #66c3b1!important;
}
.crsec01 p span {
    padding-top: 1rem;
    font-size: min(8vw, 32px);
    display: inline-block;
    line-height: 1.25;
}
.crsec01{
    margin-bottom:5rem;
}
.crsec01 h2{
    margin-bottom:2rem;
    text-align:center;
    font-size:40px;
}
.crsec01 ul{
    max-width: 450px;
    margin: 0 auto;
    line-height: 1.8;
    padding: 1.5rem;
    box-shadow: 1px 1px 5px #999;
    border-radius: 1rem;
    margin-bottom: 2rem;
}
.crsec01 ul li{
    border-bottom: 4px dotted #999;
    text-indent: -1.5rem;
    padding-left: 1.5rem;
    line-height: 1.5;
    margin-bottom: 1rem;
}
.crsec01 ul li:before{
    max-width: 500px;
    margin: 0 auto;
    background-color: #fefefe;
    box-shadow: 2px 2px 5px #bbb;
    border-radius: 1rem;
    padding-right:.5rem;
    background-repeat:no-repeat;
}
.crsec01 p{
    text-align:center;
}
.crsec01 p span{
    padding-top:1rem;
    font-size:32px;
}
.crsec02{
    margin-bottom:3rem;
}
.crsec02 h2{
    font-size:40px;
    text-align:center;
}
.crsec02 .reason-cont{
    display:flex;
    gap:1rem;
    flex-wrap:wrap;
    justify-content:center;
    margin:1rem auto;
    text-align:center;
}
.crsec02 .reason{
    width:calc(50% - .5rem);
    border-radius: 1rem;
    padding: 1rem;
    box-sizing: border-box;
    border: 1px solid #66c3b1;
    box-shadow: 2px 2px 4px #66c3b1;
}
.crsec02 .reason:first-of-type{
    width:100%;
}
@media screen and (max-width:550px){
    .crsec02 .reason{
        width:100%;
    }
}
.crsec03{
    margin-bottom:3rem;
}
.crsec03 li{
    text-align:center;
}
.crsec03 p{
    display: block;
    margin: 1rem auto;
    width: 60%;
    text-align: center;
}
.crsec03 h2{
    text-align:center;
    font-size:40px;
}
.crsec03 h3{
    font-size: 32px;
    text-align:center;
    border-bottom: 1px solid #66c3b1;
    padding-bottom: .5rem;
    margin-bottom: 1rem;
    margin-top:1.5rem;
}
.crsec03 h3:first-child{
    margin-top:initial;
}
.crsec04 details{
border: 1px solid #66c3b1;
    padding: 1rem;
    border-radius: 1rem;
    margin-bottom:1.5rem;
}
.crsec04 details summary{
    text-indent:-1rem;
    list-style:none;
}
.crsec04 details[open] summary {
    border-bottom: 1px solid #999;
    padding-bottom: .5rem;
}
.crsec04 details summary:marker{
    display:none;
    content:"";
}
.crsec04 details div{
    padding:1rem;
}
.crsec04 div p{
    text-indent:-1rem;
}
.crsec04 details summary:before{
    content:"Q.";
    padding-right:.5rem;
    padding-left:1rem;
}
.crsec04 details div p:before{
    content:"A.";
    padding-right:.5rem;
    padding-left:1rem;
}
.crsec05 h2{
    font-size:40px;
    text-align:center;
}
.crsec05 .human-cont{
    display:flex;
    gap:1rem;
    flex-wrap:wrap;
}
.crsec05 .human{
    padding: 1rem;
    width: 280px;
    margin: 0 auto;
    border: 1px solid #999;
    border-radius: 1rem;
    margin-top: 3rem;
}
@media screen and (max-width:550px){
    .crsec05 .human{
        width:100%;
    }
}
.crsec05 .human h3{
    margin-top: -2rem;
    border-radius: 99rem;
    text-align: center;
    border: 1px solid #666;
    padding: 1rem 0;
    background:#66c3b1;
}
.crsec05 .human p{
    padding-top:1rem;
    line-height:1.5;
}
.crsec05 small{
    margin-top:.5rem;
}
.crsec05{
    margin-bottom:3rem;
}
.crsec07 h2{
    text-align:center;
    font-size:40px;
}
.crsec07 details{
    border: 1px solid #66c3b1;
    padding: 1rem;
    border-radius: 1rem;
    margin-bottom:1.5rem;
}
.crsec07 details summary{
    text-indent:-1rem;
    list-style:none;
}
.crsec07 details open summary{
    padding-bottom: .5rem;
    border-bottom: 1px solid #999;
}
.crsec07 details summary:marker{
    display:none;
}
.crsec07 details div{
    padding:1rem;
}
.crsec07 div p{
    text-indent:-1rem;
}
.crsec07 details summary:before{
    content:"Q.";
    padding-right:.5rem;
    padding-left:1rem;
}
.crsec07 details div p:before{
    content:"A.";
    padding-right:.5rem;
    padding-left:1rem;
}
.crsec08{
    text-align:center;
    line-height:1.5;
}
.crsec08 a{
    display: block;
    padding: 1rem 1.5rem;
    border: 1px solid #999;
    border-radius: 99rem;
    margin: 1rem auto 0;
    width: calc(100% - 6rem);
    min-width: 250px;
    max-width: 300px;   
}
.crsec08 .cta-box{
    display:flex;
    gap:2rem;
    flex-wrap:wrap;
    justify-content:center;
}
.crsec08 .cta-box a{
    display:inline-box;
    width:33%;
    min-width:250px;
    background:#97dcce;
    text-align:center;
}
.crsec06{
    background:#97dcce;
    margin-bottom:3rem;
    padding:2rem 0;
}
.crsec06 h2{
    font-size:40px;
    text-align:center;
}
.crsec06 .schedule-cont{
    display:flex;
    gap:1rem;
    flex-wrap:wrap;
    justify-content:center;
    padding: 0 1rem;
    box-sizing:border-box;
}
.crsec06 .schedule{
    background:#ffffffed;
    width:calc(50% - 1rem);
    min-width:500px;
    margin-top:2rem;
    padding:1rem;
    border-radius:1rem;
    box-sizing:border-box;
}
@media screen and (max-width:600px){
.crsec06 .schedule{
    width:100%;
    min-width:initial;
}
}
.crsec06 h3{
    background:#66c3b1;
    border-radius:1rem;
    margin-top:-1.5rem;
    padding:1rem;
    margin-bottom:2rem;
}
.crsec06 .schedule p{
    position: relative;
    margin-bottom: 1rem;
    border: 1px solid #999;
    border-radius: 1.5rem;
    padding: 1rem;
    padding-left: 8rem;
}
.crsec06 .schedule p:before {
    position: absolute;
    left: .5rem;
    top: .5rem;
    padding: 1rem;
    background: powderblue;
    border-radius: 1rem;
}
.crsec06 .schedule p:first-of-type:before {
    content:"STEP1";
}
.crsec06 .schedule p:nth-of-type(2):before {
    content:"STEP2";
}
.crsec06 .schedule p:nth-of-type(3):before {
    content:"STEP3";
}
.crsec06 .schedule p:nth-of-type(4):before {
    content:"STEP4";
}
.crsec06 .schedule p:nth-of-type(5):before {
    content:"STEP5";
}
.crsec06 .schedule p:nth-of-type(6):before {
    content:"STEP6";
}
.crsec06 .schedule p:nth-of-type(7):before {
    content:"STEP7";
}
.crsec06 .schedule p:nth-of-type(8):before {
    content:"STEP8";
}
#index_gmap .p-access__map {
    height: auto!important;
}
#header_slider {
    position: relative;
    display: flex;
    align-items: center;
    justify-content:center;
    text-align:center;
}
#header_slider h1.title {
    font-family: "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
    font-weight: 500;
    font-size: 38px;
    color: #66c3b1;
    text-shadow: 0px 0px 1px #fff;
    text-align: center;
    position: absolute;
    z-index: 1;
}
html.pc #index_3box {
    justify-content:center;
}
#index_wide_content {
    z-index: -1;
}
#index_wide_content .headline {
    background: rgba(255, 255, 255, 0.84);
    padding: 1em;
    border-radius: 0px;
    width: 100%;
}
#index_wide_content .button {
  display: flex !important;
  align-items: center;
  justify-content: center;
  position: relative;
  margin: 30px auto !important;
  width: 250px;
  height: 105px !important;
  line-height: 1.5 !important;
  background: white;
  border-radius: 75px;
  font-family: 'Montserrat', sans-serif;
  font-weight: lighter;
  letter-spacing: 2px;
  transition: 1s box-shadow;
  box-shadow: 0 5px 35px 0px rgba(0,0,0,.1);
  font-weight: 700;
}
#index_wide_content .button {
    background-color: #66c3b1!important;
    color: #ffffff!important;
}
#index_wide_content .button::before, #index_wide_content .button::after {
    display: block;
    content: '';
    position: absolute;
    width: 221px;
    height: 105px;
    background: #FDA8CF;
    border-radius: 75px;
    z-index: -1;
    animation: 1s clockwise infinite;
    
}
#index_wide_content .button::after {
    background: #F3CE5E;
    animation: 2s counterclockwise infinite;
}
@keyframes clockwise {
  0% {
    top: -5px;
    left: 0;
  }
  12% {
    top: -2px;
    left: 2px;
  }
  25% {
    top: 0;
    left: 5px;
  }
  37% {
    top: 2px;
    left: 2px;
  }
  50% {
    top: 5px;
    left: 0;
  }
  62% {
    top: 2px;
    left: -2px;
  }
  75% {
    top: 0;
    left: -5px;
  }
  87% {
    top: -2px;
    left: -2px;
  }
  100% {
    top: -5px;
    left: 0;
  }
}
@keyframes counterclockwise {
  0% {
    top: -5px;
    right: 0;
  }
  12% {
    top: -2px;
    right: 2px;
  }
  25% {
    top: 0;
    right: 5px;
  }
  37% {
    top: 2px;
    right: 2px;
  }
  50% {
    top: 5px;
    right: 0;
  }
  62% {
    top: 2px;
    right: -2px;
  }
  75% {
    top: 0;
    right: -5px;
  }
  87% {
    top: -2px;
    right: -2px;
  }
  100% {
    top: -5px;
    right: 0;
  }
}
#index_news .headline {
    font-size: 40px;
    text-align: center;
    line-height: 1.5;
    margin: 0;
    font-weight: 500;
}
#index_gmap .button {
    text-align: center;
    margin: 40px 0 0 0;
}
#index_blog {
    background: #f5f5f5;
    padding: 50px 20px 70px;
}
#index_blog_list {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    box-sizing: border-box;
    height: auto!important;
}
#index_blog_list article {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    box-sizing: border-box;
    width: 25%;
    padding: 10px;
    border-right:1px solid #ddd;
    text-align: center;
}
#index_blog_list article .blog-img {
    height:168px;
    overflow: hidden;
    margin-bottom: 1rem;
}
#index_news {
    background:none!important;
}
#index_news .button {
    text-align:center!important;
}
.design_button a {
    display: block;
    height: 55px;
    line-height: 55px;
    min-width: 220px;
    padding: 0 20px;
    background: #66c3b1!important;
    color: #fff;
    text-align: center;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    margin-top:1rem!important;
}
#index_blog .design_button {
    display:flex;
    justify-content:center;
    flex-wrap: wrap;
}
#index_news_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}
#index_news_list article {
    margin: 0!important;
}
.cta_btn img {
    width:700px;
    margin:0 auto;
}
@media screen and (max-width: 768px) {
    #index_blog_list article {
        width: 48%;
    }
    #index_wide_content {
        height: auto!important;
    }
}
@media screen and (max-width: 470px) {
    #index_blog_list {
        height: auto;
    }
    #index_blog_list article {
        width: 100%;
    }
}

