@charset "utf-8";
/*=====================
main__main
===================  */
.main__main {
    padding: 50px 6%;
}

/* .main__main pc */
@media screen and (min-width:769px) {
    .main__main {
        display: grid;
        width: 100%;
        max-width: 1700px;
        margin: 0 auto;
        grid-template-columns: 1fr 1fr 1fr;
        height: auto;
        grid-template-rows: 1600px 1600px 1100px 1100px;
        grid-template-areas: "areaA areaA areaC" "areaA areaA areaC" "areaB areaB areaD" "areaB areaB areaE" ;
    }

    .suisou__topic {
        padding: 60px 5% 10px 8%;
    }

    .suisou__topic {
        grid-area: areaA;
        display: block;
    }

    .suisou__kogame {
        grid-area: areaB;
    }

    .mizunasi__column{
        grid-area: areaC;
    }

    .kogame__column {
        grid-area: areaD;
        /* height: 50%; */
    }

    .sick__column {
        grid-area: areaE;
    }

    /* scroll_wrap */
    .scroll_wrap {
        margin: 0 auto;
    }
}
/* pc 769px */


/*=====================
suisou__topic
===================  */
.suisou__siiku {
    margin: 80px auto;
    height: auto;
}

.mainCaption__txt {
    color: #000;
    text-align: center;
    font-size: 1.1rem;
    font-weight: 900;
    line-height: 1.6;
    margin: 15px auto;
}

.img_01, .img_02 {
    display: block;
    margin: 0 auto;
}

.suisou_01 {
    width: 98%;
    margin: 0 auto;
}

.suisou__txt span {
    font-size: 2.8rem;
    color: var(--primary-blue, #3399cc);
}

.suisou_04 {
    width: 15%;
    float: left;
    margin:10px 4% 0 0;
}

.suisou__txt {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.6;
}

.suisou_07 {
    width: 40%;
    float: left;
    margin:10px 4% 0 0;
}

.suisou__mente {
    padding: 20px 8%;
    height: auto;

}

.suisou__title {
    color: #C40E0E;
    font-size: 1.2rem;
	display: flex;
	align-items: center;
    margin: 20px auto;
}

.suisou__title:before, .suisou__title:after {
	content: "";
	flex-grow: 1;
	border-top: 1px dashed #C40E0E;
	display: block;
}

.suisou__title:before {
	margin-right: .4em;
}
.suisou__title3:after {
	margin-left: .4em;
}

.suisou__txt2 {
    color: #000;
    font-size: 1.1rem;
    font-weight: 900;
    line-height: 1.8;
    text-align: center;
    margin: 10px auto;
}

.suisou__txt2 span {
    color: #2A8EAE;
}

/* .suisou pc */
@media screen and (min-width:769px) {
    .mainCaption__copy {
        font-size: 1.4rem;
        font-weight: 900;
        line-height: 1.8;
        text-align: center;
        margin: 15px auto;
    }
    .img_01 {
        width: 10%;
    }  
    
    .img_02 {
        width: 35%;
    }

    .suisou__topic__title {
        width: 130%;
    }

    .suisou_01 {
        width: 90%;
        margin: 0 auto;
    }

    .suisou__txt {
        font-size: 1.1rem;
        font-weight: 700;
        line-height: 1.6;
    }

    .suisou_04 {
        width: 6%;
        float: left;
        margin:10px 4% 0 0;
    }

    .suisou_05 {
        width: 40%;
        float: right;
        margin:10px 4% 0 0;
    }

    .suisou_07 {
        width: 22%;
        float: left;
        margin: -40px 4%;
    }

    .suisou__mente {
        width: 100%;
        margin-top: 30px;
        height: auto;
    }

    .suisou__title {
        font-size: 1.2rem;
        display: flex;
        align-items: center;
        margin: 20px auto;
    }
}
/* pc 769px */


/* suisou__kogame */
img.suisou_09 {
    display: block;
    margin: 50px auto;
}

.mainCaption__txt {
    color: #000;
    font-size: 1.1rem;
    font-weight: 900;
    line-height: 1.8;
    text-align: center;
    margin: 20px auto;
}

.mainCaption__txt span {
    color: #C40E0E;
    margin: 10px auto;
}

.suisou__border {
    border-bottom:solid#000 1px; /*borderの指定*/
    padding-bottom:10px; /*余白の指定*/
}

.suisou_10, .suisou_12 {
    width: 60%;
    display: block;
    margin: 0 auto;
}

.suisou_11 {
    width: 40%;
    float: right;
    margin:20px 8% 0 0;
}

.mainCaption__txt1 {
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.6;
    margin: 20px 8%;
}

.mainCaption__txt2 {
    font-size: 1.1rem;
    font-weight: 900;
    line-height: 1.8;
    text-align: center;
    margin: 20px 8%;
}

.mainCaption__txt3 {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.8;
    text-align: center;
    margin: 20px 8%;
}

@media screen and (min-width:769px) {
    img.suisou_09 {
        width: 50%;
        /* display: block; */
        margin: 50px auto;
    }
    
    .suisou_10, .suisou_12 {
        width: 50%;
    }

    .suisou_11 {
        width: 20%;
        float: right;
        margin:20px 8% 0 0;
    }


}
/* pc 769px */


/*=====================
suisou__column
===================  */

/* mizunasi__column */
.mizunasi__column {
    display: block;
    width: 100%;
    max-width: 600px;
    height: auto;
    text-align: center;
    border-radius: 20px;
    border: 2px solid #000;
    box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.25);
    margin: 100px auto 0;
    padding: 120px 8%;
    position: relative;
}

.mizunasi_clip {
    position: absolute;
    top: -60px;
    left: 38%;
}

.multicolumnbox {
    column-width: 13em;
 }

p {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.6;
    text-align: start;
}

.mainCaption__txt4 {
    font-size: 1.1em;
    font-weight: 900;
    line-height: 1.8;
    text-align: center;
    margin: 40px 0 0;
}

.suisou__border1 {
    border-bottom:solid#000 1px; /*borderの指定*/
    margin: 10px; /*余白の指定*/
}

li {
    text-align: start;
    margin: 10px 0;
}

li span {
    color: #2A8EAE;
}

.box-1 {
    border: 1px solid #000;
    padding: 0;
    margin-top: 30px;
}

.box-2 {
    border: 1px solid #000;
    padding: 0 1em;
    margin-top: 10px;
}

.suisou__txt1 {
    color: #000;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.8;
    text-align: center;
    margin: 30px auto;
} 

.suisou__txt3 {
    color: #C40E0E;
    text-align: center;
    margin: 10px auto;
}

.suisou__txt4 {
    text-align: start;
}

.suisou__txt4 span {
    color: #C40E0E;
}

/* kogame__column */
.kogame__column {
    display: block;
    width: 100%;
    max-width: 600px;
    height: auto;
    text-align: center;
    border-radius: 20px;
    border: 2px solid #000;
    box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.25);
    margin: 100px auto 0;
    padding: 120px 8%;
    position: relative;
}

.kogame_clip {
    position: absolute;
    top: -60px;
    left: 38%;
}

/* sick__column */
.sick__column {
    display: block;
    width: 100%;
    max-width: 600px;
    height: auto;
    text-align: center;
    border-radius: 20px;
    border: 2px solid #000;
    box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.25);
    margin: 100px auto 0;
    padding: 120px 8%;
    position: relative;
}

.sick_clip {
    position: absolute;
    top: -60px;
    left: 38%;
}
.sick li span {
    color: #C40E0E;
    font-size: 1.1rem;
    font-weight: 700;
}

.sick_01 {
    width: 50%;
    float: left;
    margin:20px 0 0 8%;
}

.sick__column a {
    color: blue;
    text-decoration: underline;
}