@charset "utf-8";
/* -----------------------------------------------
 home SP CSS
-------------------------------------------------- */
p.red{
 color: #e60012;
}

@media screen and (max-width: 851px) {/* 以下 */
a{
 cursor: pointer;
}
header{
 width: 100%;
 color: #333;
 position: relative;
 background: url(../img/header-bg.jpg) no-repeat center top;
 background-size: cover;
}

header .inner{
 padding: 5%;
}
header .text_1{
 text-align: center;
 font-family: "Noto Sans JP", sans-serif;
 font-size: clamp(1rem, 0.6111rem + 1.7778vw, 1.5rem);
 color: #e83928;
 font-weight: 700;
 margin-top: 20px;
 margin-bottom: 20px;
 line-height: 1.6;
}

article .inner{
 max-width: 90%;
 padding-left: 4%;
 padding-right: 4%;
 margin-left: auto;
 margin-right: auto;
 overflow: hidden;
}
/* ------------------------------------- */
article .inner{
 max-width: 96%;
 margin-left: auto;
 margin-right: auto;
}
/* group_1 
------------------------------ */
.group_1 .inner{
 padding: 8% 5% 4% 5%;
}
.group_1{
 background-color: #e83928;
}
.group_1 h2{
 text-align: center;
}
.group_1 h3{
 text-align: center;
}
.group_1 h3{
 font-family: "Noto Sans JP", sans-serif;
 font-size: clamp(1rem, 0.6111rem + 1.7778vw, 1.5rem);
 color: #fff;
 font-weight: 700;
 margin-top: 20px;
 margin-bottom: 20px;
 line-height: 1.6;
}
.group_1 ul{
 margin-left: auto;
 margin-right: auto;
}
.group_1 ul li{
 text-align: center;
 margin-bottom: 6vw;
 padding-left: 3%;
}

/* group_2 
------------------------------ */
.group_2{
 margin-bottom: 3vw;
 line-height: 1.6;
 padding-top: 8vw;
 padding-bottom: 8vw;
}
.group_2 h2{
 text-align: center;
 margin: 0 auto 6vw auto;
}
.group_2 .poster{
 text-align: center;
 position: static;
 max-width: 70%;
 margin: 10px auto;
}
.group_2 .subtitle{
 margin-bottom: 20px;
}
.group_2 .text_1{
 font-family: "Noto Sans JP", sans-serif;
 font-size: clamp(1.25rem, 1rem + 0.5vw, 1.375rem);
 color: #e83928;
 font-weight: 700;
 padding-left: 6%;
}
.group_2 .text_2{
 padding-left: 6%;
}
.group_2 .text_2.mgb{
 margin-bottom: 30px;
}
.group_2 h3{
 text-align: center;
 max-width: 95%;
 margin: 0 auto 2vw auto;
}

.group_2 .sub_group_2{
 margin-top: 6vw;
 border: 7px solid #e83928;
 border-radius: 50px;
 padding: 3%;
}
.group_2 .sub_group_2 h2{
 font-size: clamp(1.625rem, 1.4306rem + 0.8889vw, 1.875rem);
 font-weight: 900;
 text-align: center;
 color: #e83928;
}
.group_2 .sub_group_2 ul li{
 text-align: center;
 margin-bottom: 2vw;
}

/* group_3 
------------------------------ */
.group_3{
 padding-top: 8vw;
 background-color: #e83928;
}
.group_3 h2{
 text-align: center;
 max-width: 80%;
 margin: 0 auto 2vw auto;
}
.group_3 h3{
 margin-bottom: 20px;
}
.group_3 .sg_1{
 max-width: 90%;
 margin: 0 auto 2vw auto;
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 20px;
}
.group_3 .sg_2{
 max-width: 90%;
 margin: 3vw auto 6vw auto;
 display: grid;
 justify-items: center;
 align-content: stretch;
 grid-template-columns: 48% 48%;
 justify-content: space-between;
}
.group_3 .sg_3{
 text-align: center;
 max-width: 90%;
 margin: 0 auto;
}

/* group_4 
------------------------------ */
.group_4{
 padding-top: 10vw;
 background-color: #e83928;
 position: relative;
 padding-bottom: 8vw;
}
.group_4 .inner{
 padding-top: 10vw;
 background-color: #fff;
 border-radius: 50px;
 overflow: hidden;
}
.group_4 h2{
 position: absolute;
 top: 12vw;
 left: 50%;
 transform: translate(-50%, -50%);
 z-index: 2;
 text-align: center;
 max-width: 85%;
 margin: 0vw auto 0 auto;
}
.group_4 .text_1{
 font-family: "Noto Sans JP", sans-serif;
 font-size: clamp(1.125rem, 0.95rem + 0.8vw, 1.375rem);
 font-weight: 700;
 text-align: center;
 line-height: 1.5;
 margin-bottom: 20px;
 color: #e83928;
}
.group_4 .kikan{
 text-align: center;
 max-width: 90%;
 margin: 0 auto 3vw auto;
}
.group_4 .text_3,
.group_4 .text_2{
 text-align: center;
 max-width: 90%;
 margin: 0 auto 5vw auto;
}
/* ダウンロード */
.group_4 .sub_group_5{
 padding-top: 8vw;
 padding-bottom: 2vw;
 margin-bottom: 5vw;
 background: url(../img/g3-bg.png) no-repeat center bottom;
 background-size: 110% auto;
 
}
.group_4 .sub_group_5 .title_2{
 text-align: center;
 margin-bottom: 2vw;
}
.group_4 .sub_group_5 .text_1{
 font-size: clamp(1.125rem, 0.95rem + 0.8vw, 1.375rem);
 text-align: center;
 margin-bottom: 2.7vw;
 font-family: "Noto Sans JP";
 font-weight: 600;
 color: #fff;
}
.group_4 .sub_group_5 .text_2{
 font-size: clamp(0.7rem, 0.85rem + 0.8vw, 1rem);
 text-align: center;
 font-family: "M PLUS Rounded 1c";
 font-weight: 700;
 margin-bottom: 0.5vw;
}

.group_4 .sub_group_5 ul{
 display: grid;
 max-width: 80%;
 margin-left: auto;
 margin-right: auto;
 justify-items: center;
 align-content: stretch;
 grid-template-columns: 47% 47%;
 justify-content: space-between;
 color: #fff;
}
.group_4 .sub_group_5 ul li p{
 text-align: center;
 margin-bottom: 1.5vw;
}
.group_4 .sub_group_5 .os{
 font-size: 60%;
}
/* group_5-6 
------------------------------ */
.group_5{
 padding: 5vw 0;
}
.group_5 .text{
 max-width: 90%;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 3vw;
 line-height: 1.6;
 font-family: "Noto Sans JP", sans-serif;
 font-size: clamp(1rem, 0.75rem + 0.5vw, 1.125rem);
}

.group_6{
 background-color: #e83928;
 padding: 7vw 0;
}
.group_6 .inner{
 background-color: #fff;
 border-radius: 30px;
 padding: 3%;
}
.group_6 .inner_box{
 padding-left: 12%;
}
.group_6 h2{
 text-align: center;
 margin-bottom: 3vw;
 max-width: 90%;
 margin-left: auto;
 margin-right: auto;
}
.group_6 h3{
 font-family: "Noto Sans JP", sans-serif;
 font-size: clamp(1.25rem, 0.625rem + 1.25vw, 1.5625rem);
 color: #e83928;
 font-weight: 700;
 margin-bottom: 2vw;
}
.group_6 .sub_group_3,
.group_6 .sub_group_2,
.group_6 .sub_group_1{
 display: flex;
 gap: 20px;
}
.group_6 .sub_group_1{
 margin-bottom: 5vw;
}
.group_6 .sub_group_1 img{
 min-width: 50px;
}
.group_6 .sub_group_2{
 background-color: #569cd7;
 border-radius: 20px;
 padding: 15px;
 color: #fff;
 margin-bottom: 5vw;
 font-size: clamp(1rem, 0.9125rem + 0.4vw, 1.125rem);
 line-height: 1.6;
}
.group_6 .sub_group_3{
 background-color: #8ec220;
 border-radius: 20px;
 padding: 15px;
 color: #fff;
 font-size: clamp(1rem, 0.9125rem + 0.4vw, 1.125rem);
 line-height: 1.6;
 margin-bottom: 5vw;
}
.group_6 .sub_group_3 img,
.group_6 .sub_group_2 img{
 min-width: 50px;
}
.group_6 .child_3{
 background: url(../img/g6-bg-sp.png) no-repeat 2.8% bottom;
 background-size: 7% auto;
}

/* group_7 
------------------------------ */
.group_7{
 padding: 7vw 0;
 background-color: #8dc21f;
}
.group_7 h2{
 max-width: 95%;
 margin: 3vw auto;
 text-align: center;
}
.group_7 .inner{
 background-color: #fff;
 border-radius: 30px;
 padding: 3%;
}
.group_7 .grid{
 max-width: 85%;
 margin: 0 auto 3vw auto;
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 20px;
}
.group_7 p.text{
 font-size: clamp(1rem, 0.75rem + 0.5vw, 1.125rem);
 line-height: 1.6;
 margin-bottom: 25px;
}
/* youtube
---------------------------------------- */
.slider{
 margin-bottom: 20px;
}

.youtube {
  height: 100%;
  max-width: 200px;
}
.youtube iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 9 / 16;
  margin-left: auto;
  margin-right: auto;
  border-radius: 10px;
}
.slider li{
 margin-left: 10px;
 margin-right: 10px;
}
.slider .title{
 text-align: center;
 margin-bottom: 20px;
}
.slider .title img{
 max-width: 90%;
 margin-left: auto;
 margin-right: auto;
}
.slick-slide{
 width: 200px;
}
.slider .slick-prev {
    background: url(../img/prev-btn.png) no-repeat center center;
    background-size: auto;
    width: 30px;
    height: 30px;
    text-indent: -9999px;
    border: none;
    position: absolute;
    left: 20%;
    top: 50%;
    z-index: 50;
    background-size: 100% auto;
}
.slider .slick-next {
    background: url(../img/next-btn.png) no-repeat center center;
    background-size: auto;
    width: 30px;
    height: 30px;
    text-indent: -9999px;
    border: none;
    position: absolute;
    top: 50%;
    right: 20%;
    z-index: 50;
    background-size: 100% auto;
  }

/* ------------------------------------------------------------------ */
}/*----------------------------------------------------------- SP end */