/*--------------------------------------------

header

--------------------------------------------*/
/*--------------------------------------------
max-width 1200
--------------------------------------------*/
@media (max-width: 1200px) {
.header_bottom::before {
    width: 100vw;
    height: 100vw;
    right: -60%;
}
.header_bottom::after {
    width: 70vw;
    height: 70vw;
    right: -30%;
}
}
/*--------------------------------------------
max-width 1080
--------------------------------------------*/
@media (max-width: 1080px) {
.header_bottom {
    height: fit-content;
    padding-bottom: 60px;
}
.header_bottom::after {
    width: 90vw;
    height: 90vw;
    border: solid 3em var(--sub);
    right: auto;
    left: -10%;
}
.header_bottom__inner {
    text-align: center;
    align-items: center;
}
.header_bottom img {
    max-width: 500px;
    width: 90%;
    position: static;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    z-index: 1;
}
}
/*--------------------------------------------
max-width 810
--------------------------------------------*/
@media (max-width: 810px) {

}
/*--------------------------------------------
max-width 600
--------------------------------------------*/
@media (max-width: 600px) {
.header_bottom::before {
    border: solid 3em var(--sub);
    top: 40%;
}
.header_bottom::after {
    width: 150vw;
    height: 150vw;
    border: solid 3em var(--main);
    left: -10%;
    top: -27%;
}
.header_bottom__title {
    font-size: 110%;
}
.header_bottom__title hgroup h1 {
    font-size: 275%;
}
}

/*--------------------------------------------

wrap

--------------------------------------------*/
/*--------------------------------------------
max-width 1200
--------------------------------------------*/
@media (max-width: 1200px) {

}
/*--------------------------------------------
max-width 1080
--------------------------------------------*/
@media (max-width: 1080px) {
    
}
/*--------------------------------------------
max-width 810
--------------------------------------------*/
@media (max-width: 810px) {
.article_view {
    font-size: 100%;
}
.article_view__inner h2 span {
    display: block;
}
}
/*--------------------------------------------
max-width 600
--------------------------------------------*/
@media (max-width: 600px) {
.article_view__inner h2 {
    font-size: 180%;
}
}

/*--------------------------------------------

first_view

--------------------------------------------*/
/*--------------------------------------------
max-width 1200
--------------------------------------------*/
@media (max-width: 1200px) {
/*--------------------------------------------
overview
--------------------------------------------*/

/*--------------------------------------------
flow
--------------------------------------------*/
}
/*--------------------------------------------
max-width 1080
--------------------------------------------*/
@media (max-width: 1080px) {
/*--------------------------------------------
overview
--------------------------------------------*/

/*--------------------------------------------
flow
--------------------------------------------*/
.flow_content__inner {
    width: 100%;
}
}
/*--------------------------------------------
max-width 810
--------------------------------------------*/
@media (max-width: 810px) {
/*--------------------------------------------
overview
--------------------------------------------*/
.overview_content {
    flex-direction: column;
}
.overview_content > * {
    width: 100%;
}

/*--------------------------------------------
flow
--------------------------------------------*/
}
/*--------------------------------------------
max-width 600
--------------------------------------------*/
@media (max-width: 600px) {
/*--------------------------------------------
overview
--------------------------------------------*/

/*--------------------------------------------
flow
--------------------------------------------*/
.flow_content__inner hgroup p {
    font-size: 150%;
}
}


/*--------------------------------------------

second_view

--------------------------------------------*/
/*--------------------------------------------
max-width 1200
--------------------------------------------*/
@media (max-width: 1200px) {
/*--------------------------------------------
merit
--------------------------------------------*/
}
/*--------------------------------------------
max-width 1080
--------------------------------------------*/
@media (max-width: 1080px) {
/*--------------------------------------------
merit
--------------------------------------------*/
}
/*--------------------------------------------
max-width 810
--------------------------------------------*/
@media (max-width: 810px) {
/*--------------------------------------------
merit
--------------------------------------------*/
#merit > p {
    line-height: 1.6em;
    margin-bottom: 3em;
}
.merit_content__inner {
    flex-direction: column-reverse;
    padding: 1em;
    border-radius: 1em;
}
.merit_content__inner dl,
.merit_content__inner img {
    width: 100%;
}
.merit_content__inner dd {
    line-height: 1.6em;
}
}
/*--------------------------------------------
max-width 600
--------------------------------------------*/
@media (max-width: 600px) {
/*--------------------------------------------
merit
--------------------------------------------*/
}


/*--------------------------------------------

third_view

--------------------------------------------*/

/*--------------------------------------------
max-width 1200
--------------------------------------------*/
@media (max-width: 1200px) {
/*--------------------------------------------
support
--------------------------------------------*/
}
/*--------------------------------------------
max-width 1080
--------------------------------------------*/
@media (max-width: 1080px) {
/*--------------------------------------------
support
--------------------------------------------*/
}
/*--------------------------------------------
max-width 810
--------------------------------------------*/
@media (max-width: 810px) {
.support_content__inner {
    padding: 1em;
}

/*support_content__inner__1*/
.support_content__inner__1 {
    width: 100%;
    margin: 0;
    padding: 1em;
}
.support_content__inner__1 h4 {
}
.support_content__inner__1 > p {
}
.support_content__inner__1 div {
    flex-direction: column;
}
.support_content__inner__1:first-of-type,
.support_content__inner__1:nth-of-type(2),
.support_content__inner__1:last-of-type {
    margin: 0 1em;
}
.support_content__inner__1 div > * {
    width: 100%;
}
.support_content__inner__1 div p {
    line-height: 1.6em;
}
.support_content__list {
    flex-direction: column;
    margin: 2em 0 0 0;
    padding: 1em;
}
.support_content__list li {
    width: 100%;
}

/*support_content__inner__2*/
.support_content__inner__2 {
    width: 100%;
    flex-direction: column;
    padding: 0 1em;
    gap: 1em 0;
}
.support_content__inner__2:nth-of-type(1),
.support_content__inner__2:nth-of-type(2),
.support_content__inner__2:nth-of-type(3) {
    margin: 0;
}
.support_content__inner__2 > * {
    width: 100%;
}
.support_content__inner__2 dt {
    margin-bottom: 0.5em;
}
.support_content__inner__2 dd {
    line-height: 1.6em;
}

/*support_content__inner__3*/
.support_content__inner__3 {
    flex-direction: column;
}
.support_content__inner__3 div {
    width: 100%;
}
.support_content__inner__3 div p {
    line-height: 1.6em;
}

/*support_content__inner__4*/
.support_content__inner__4 {
    width: calc(100% - 3em);
}

/*--------------------------------------------
support
--------------------------------------------*/
}
/*--------------------------------------------
max-width 600
--------------------------------------------*/
@media (max-width: 600px) {
/*--------------------------------------------
support
--------------------------------------------*/
}


/*--------------------------------------------

fourth_view

--------------------------------------------*/
/*--------------------------------------------
max-width 1200
--------------------------------------------*/
@media (max-width: 1200px) {
/*--------------------------------------------
cost
--------------------------------------------*/
}
/*--------------------------------------------
max-width 1080
--------------------------------------------*/
@media (max-width: 1080px) {
/*--------------------------------------------
cost
--------------------------------------------*/
}
/*--------------------------------------------
max-width 810
--------------------------------------------*/
@media (max-width: 810px) {
/*--------------------------------------------
cost
--------------------------------------------*/
}
/*--------------------------------------------
max-width 600
--------------------------------------------*/
@media (max-width: 600px) {
/*--------------------------------------------
cost
--------------------------------------------*/
.cost_content {
    padding: 1em;
}
.cost_content__inner div dl {
    text-align: center;
    flex-direction: column;
}
.cost_content__inner div dt {
    width: 100%;
    border-right: 0;
    margin: 0 auto;
    border-bottom: solid 1px var(--main);
    padding-bottom: 0.5em;
}
.cost_content__inner div dd {
    padding-right: 1em;
}
}
