@charset "utf-8";
/*Title*/
section.cas01title h1 {
    margin: 0 0 1em 0;
}
section.cas01title h2 {
    font-size: 1.5em;
    line-height: 1.2;
    font-style: italic;
    text-align: center;
}
section.cas01title h2 > span {
    display: inline;
    font-size: 0.85em;
}
section.cas01title h2 span > span {
    color: #e60012;
}
section.cas01title figure {
    position: relative;
    margin: 2em 0 0 0;
}
section.cas01title figure div.labels {
    position: absolute;
    width: 100%;
    top: -7em;
    left: 0;
}
section.cas01title figure div.labels span {
    box-sizing: border-box;
    background: #e60012;
    color: #fff;
    text-align: center;
    font-size: 2em;
    font-weight: 700;
    padding: 0.25em 0.5em;
    display: inline-block;
    border: solid 3px #e60012
}
section.cas01title figure div.labels span:nth-of-type(2) {
    background: #FFFFFF;
    border: solid 3px #e60012;
    color: #e60012
}
section.cas01title p.coution {
    font-size: 1.75em;
}

/*Youtube*/
section.youtube {
    width: 100%;
    aspect-ratio: 16 / 9;   
}
section.youtube iframe {
    width: 100%;
    height: 100%;
}

/*exercise*/
section.exercise p.mincho {
    width: 90%;
    max-width: 1024px;
    margin: 1em auto;
    font-size: 1.85rem;
}

/*cas01feature*/
section.cas01feature h3 {
    font-size: 2em;
    font-weight: 700;
    color: #1d2088;
	margin-bottom: 0.5em;
}
section.cas01feature p {
    margin-bottom: 2.5em;
}
section.cas01feature figure.graf {
    margin: 0 0 1.75em ;
    width: 100%;
    max-width: 500px;
}
section.cas01feature .left {
    width: 100%;
    float: none;
}
section.cas01feature .right {
    width: 100%;
    float: none;
}
section.cas01feature .right img:nth-of-type(1) {
    margin-bottom: 4em;
}

/*cas01compatible*/
section.cas01compatible header {
    background: #1d2088;
    padding: 0.5em;
    margin-bottom: 2em;
}
section.cas01compatible header h1 {
    color: #fff;
}
section.cas01compatible header.coming {
    background: #FFF;
    padding: 0.5em;
    margin-bottom: 2em;
    border: solid 1px #1d2088;
}
section.cas01compatible header.coming h1 {
    color: #1d2088;
}
section.cas01compatible div.left {
    width: 100%;
    float: none;
    margin-bottom: 2em;
}
section.cas01compatible div.right {
    width: 100%;
    float: none;
}
section.cas01compatible table th,
section.cas01compatible table td {
    border-top: solid 1px #1d2088;
    border-bottom: solid 1px #1d2088;
    padding: 0.25em 0.5em;
    box-sizing: border-box;
}
section.cas01compatible table th {
    text-align: left;
    background: #dcddef;
}

/*cas01flow*/
section.cas01flow header {
    background: #1d2088;
    padding: 0.5em;
    margin-bottom: 2em;
}
section.cas01flow header h1 {
    color: #fff;
}
section.cas01flow div.customer {
    display: none;
}
section.cas01flow div.chart {
    width: 100%;
    float: none;
    margin: 0 0%;
}
section.cas01flow div.chart div.coution ol {
    margin-top: 1.25em;
    counter-reset: number;
    list-style: none;
    margin-left: 2em;
}
section.cas01flow div.chart div.coution ol li {
    list-style-type: none;
    text-indent: -2em;
}
section.cas01flow div.chart div.coution ol li:before {
    counter-increment: number;
    content: "※"counter(number)" ";
    color: #f00;
}
section.cas01flow div.tresa {
    display: none;
}

/*cas01fee*/
section.cas01fee header {
    background: #1d2088;
    padding: 0.5em;
    margin-bottom: 2em;
}
section.cas01fee header h1 {
    color: #fff;
}
section.cas01fee dl {
    width: 100%;
}
section.cas01fee div.constitution dl {
    font-size: 1.25em;
    width: 100%;
    margin: 0 0 2em;
}
section.cas01fee div.constitution dl dt {
    padding: 0em 1em;
    float: none;
    width: 100%;
    border: solid 1px rgba(0,0,0,0.00);
    text-align: center;
    margin-bottom: 1em;
    box-sizing: border-box;
}
section.cas01fee div.constitution dl dd {
    padding: 0 0 0 0;
    font-weight: 700;
    text-align: center;
}
section.cas01fee div.constitution dl dd span {
    margin: 0;
    display: block;
}
section.cas01fee div.constitution dl dd span.items01 {
    margin-left: 0;
}
section.cas01fee .items01 {
    background: #f7f5ae;
    border: solid 1px #231815;
    padding: 0.25em 1em;
    font-weight: 500;
}
section.cas01fee .items02 {
    background: #d1e17b;
    border: solid 1px #231815;
    padding: 0.25em 1em;
    font-weight: 500;
}
section.cas01fee .items03 {
    background: #c9caca;
    border: solid 1px #231815;
    padding: 0.25em 1em;
    font-weight: 500;
}
section.cas01fee > dl.details > dt {
    width: 100%;
    float: none;
    text-align: center;
    box-sizing: border-box;
}
section.cas01fee > dl.details > dd {
    padding: 0.25em 0 0.25em 0;
    border: solid 1px rgba(0,0,0,0.00);
    margin-bottom: 1em;
}
section.cas01fee > dl.details > dd dl dt {
    float: left;
    padding-top: 0.5em;
}
section.cas01fee > dl.details > dd dl dd {
    padding-top: 0.5em;
}
section.cas01fee > dl.details > dd > ul > li,
section.cas01fee > dl.details > dd > ul > li > ul > li {
    float: left;
    margin-right: 2em;
}
section.cas01fee > dl.details > dd > ul > li:nth-last-of-type(1),
section.cas01fee > dl.details > dd > ul > li > ul > li:nth-last-of-type(1) {
    margin-right: 0em;
}
section.cas01fee > dl.details dl.base dt {
    width: 5em;
    float: left;
}
section.cas01fee > dl.details dl.base dd {
    padding-left: 5em;
}
section.cas01fee > dl.details dl.base span {
    color: #e83518;
}
section.cas01fee > dl.details dl.rank {
    padding-left: 1em;
}
section.cas01fee > dl.details dl.rank dt {
    width: 1em;
    float: left;
}
section.cas01fee > dl.details dl.rank dd {
    padding-left: 2em;
}

/*cas01other*/
section.cas01other header {
    background: #1d2088;
    padding: 0.5em;
    margin-bottom: 2em;
}
section.cas01other header h1 {
    color: #fff;
}
section.cas01other h2 {
    font-size: 1.1em;
    font-weight: 500;
    margin-bottom: 1em;
}
section.cas01other figure {
    text-align: center;
}
section.cas01other figure figcaption {
    margin-top: 0.5em;
}
section.cas01other div.clearfix {
    padding-left: 0;
    margin-bottom: 2em;
}
section.cas01other div.documents {
    float: none;
    width: 100%;
}
section.cas01other div.documents ul {
    padding: 0 0em 0 0em;
}
section.cas01other div.documents ul li {
    width: 30%;
    margin: 0 5% 0 0;
    float: left;
}
section.cas01other div.documents ul li:nth-of-type(3n) {
    margin-right: 0;
}
section.cas01other div.documents ul li figure img {
    border: solid 1px #000;
}
section.cas01other div.labels {
    float: none;
    width: 100%;
}
section.cas01other div.labels ul {
    padding: 0 1.5em;
}
section.cas01other div.labels ul figure figcaption {
    text-align: left;
}
section.cas01other div.pamphlet {
    width: 100%;
}
section.cas01other div.pamphlet ul {
    padding: 0 0 0 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
section.cas01other div.pamphlet ul li {
    margin-bottom: 2em;
    width: 50%;
}
section.cas01other div.pamphlet img {
    border: solid 1px #ccc;
    box-shadow: 10px 10px 10px #ccc;
    width: 75%;
    height: auto;
}

/*inspection*/
section.inspection header {
    background: #1d2088;
    padding: 0.5em;
    margin-bottom: 2em;
}
section.inspection header h1 {
    color: #fff;
}
section.inspection h2 {
    margin-bottom: 1em;
    text-align: center;
    font-size: 1.75em;
}
section.inspection h3 {
    font-weight: 300;
    font-size: 1rem;
    margin-bottom: 0.5em;
}
section.inspection div.inspection {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 3rem;
}
section.inspection div.inspection dl {
    margin-left: 1em;
}
section.inspection div.inspection div.left dl dt {
    width: 8em;
    float: left;
}
section.inspection div.inspection div.left dl dd {
    padding-left: 8em;
}
section.inspection div.inspection div.right dl dt {
    width: 4em;
    float: left;
}
section.inspection div.inspection div.right dl dd {
    padding-left: 4em;
}
section.inspection figure.graf {
    width: 90%;
    margin: 1.5rem auto 0;
}

/* ----------------------------------------------------------------------
 Smartphone
---------------------------------------------------------------------- */
@media screen and (max-width: 480px) {

}
@media screen and (max-width: 767px) {
	
}

/* ----------------------------------------------------------------------
 Tablet
---------------------------------------------------------------------- */
@media screen and (min-width: 768px) {
    
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
    section.cas01title h2 {
        font-size: 2.25em;
    }
    section.cas01title h2 > span {
        display: block;
    }
    section.cas01title h2 > span.p1 {
        margin-left: 2em;
    }
    section.cas01title h2 > span.p2 {
        margin-left: 4em;
    }
        
}
@media screen and (max-width: 768px) {
    section.cas01fee span.desktop {
        display: none;
    }
    section.cas01fee span.mobile {
        display: inline-block;
    }
    section.cas01fee > dl.details > dd > ul > li > ul {
        margin-top: 1.5em;
    }
}

/* ----------------------------------------------------------------------
 Desktop
---------------------------------------------------------------------- */
@media screen and (min-width: 1024px) {
    
    /*Title*/
    section.cas01title h1 {
        margin: 0 0 1em 0;
    }
    section.cas01title h2 {
        font-size: 3.15em;
    }
    section.cas01title h2 > span {
        display: block;
    }
    section.cas01title h2 > span.p1 {
        margin-left: 2.5em;
    }
    section.cas01title h2 > span.p2 {
        margin-left: 5.5em;
    }
    section.cas01title figure {
        margin: 1em 0 0 0;
    }
    section.cas01title figure div.labels {
        width: auto;
        top: 0em;
        left: 0;
    }

    /*cas01feature*/
    section.cas01feature .left {
        width: 65%;
        float: left;
    }
    section.cas01feature .right {
        width: 30%;
        float: right;
    }
    section.cas01feature .right img:nth-of-type(1) {
        margin-bottom: 4em;
    }

    /*cas01compatible*/
    section.cas01compatible div.left {
        width: 48%;
        float: left;
        margin-bottom: 0;
    }
    section.cas01compatible div.right {
        width: 48%;
        float: right;
        margin-bottom: 0;
    }

    /*cas01flow*/
    section.cas01flow div.customer {
        width: 18%;
        float: left;
        display: block;
    }
    section.cas01flow div.chart {
        width: 56%;
        float: left;
        margin: 0 4%;
    }
    section.cas01flow div.tresa {
        width: 18%;
        float: right;
        display: block;
    }

    /*cas01fee*/
    section.cas01fee span.desktop {
        display: inline-block;
    }
    section.cas01fee span.mobile {
        display: none;
    }
    section.cas01fee dl {
        width: 100%;
    }
    section.cas01fee div.constitution dl {
        font-size: 1.25em;
        width: 100%;
        margin: 0 0 2em;
    }
    section.cas01fee div.constitution dl dt {
        padding: 0em 1em;
        float: left;
        width: 5rem!important;
        border: solid 1px rgba(0,0,0,0.00);
        text-align: center;
        box-sizing: content-box;
    }
    section.cas01fee div.constitution dl dd {
        padding: 0 0 0 9rem;
        font-weight: 700;
        text-align: left;
    }
    section.cas01fee div.constitution dl dd span {
        margin: 0 0.5em;
        display: inline-block;
    }
    section.cas01fee > dl.details > dt {
        width: 5rem;
        float: left;
        text-align: center;
        box-sizing: content-box;
    }
    section.cas01fee > dl.details > dd {
        padding: 0.25em 0 0.25em 9rem;
        border: solid 1px rgba(0,0,0,0.00);
        margin-bottom: 1em;
    }

    /*cas01other*/
    section.cas01other div.clearfix {
        padding-left: 2em;
        margin-bottom: 2em;
    }
    section.cas01other div.documents {
        float: left;
        width: 75%;
    }
    section.cas01other div.documents ul {
        padding: 0 5em 0 1.5em;
    }
    section.cas01other div.documents ul li {
        width: 30%;
        margin: 0 5% 0 0;
        float: left;
    }
    section.cas01other div.documents ul li:nth-of-type(3n) {
        margin-right: 0;
    }
    section.cas01other div.documents ul li figure img {
        border: solid 1px #000;
    }
    section.cas01other div.labels {
        float: left;
        width: 25%;
    }
    section.cas01other div.labels ul {
        padding: 0 1.5em;
    }
    section.cas01other div.labels ul figure figcaption {
        text-align: left;
    }
    section.cas01other div.pamphlet {
        width: 100%;
    }
    section.cas01other div.pamphlet ul {
        padding: 0 0 0 0;
        justify-content: flex-start;
    }
    section.cas01other div.pamphlet ul li {
        width: 25%;
        margin-right: 8%;
    }
    section.cas01other div.pamphlet img {
        width: 100%;
        height: auto;
    }
    
    /*inspection*/
    section.inspection div.inspection:nth-of-type(1) div.left {
        width: 42%;
    }
    section.inspection div.inspection:nth-of-type(2) {
        justify-content: space-between;
    }
    section.inspection div.inspection:nth-of-type(2) div.left {
        width: 48%;
    }
    section.inspection div.inspection:nth-of-type(2) div.right {
        width: 48%;
    }

}