@charset "utf-8";

.detailbr{line-height:200%;}
/*トップ*/
.topimageweb{width:calc((100 / 1500) * 203.4644vw);}

/*記事*/
.articleimg{
    background-image:url(../img/9.columndetail/1.jpg);
    background-repeat: no-repeat;
    background-size:cover;
    background-position:center;
    align-items: center;
    height: min(calc((100 / 1920) * 700vw), 700px);
    margin: 0 auto;
}

.article{width:51.5%;margin-left: 12.5%;margin-top:4.2%;}
.article h3{margin-top:1em;padding-top: 1em;padding-bottom: 1em;padding-left:0.5em;font-size: 28px; line-height:32px;font-weight:bold;background: linear-gradient(to right, #B9EFEE, #9BD5FF);}
.article p{font-size: 16px; line-height:45px; letter-spacing:0.05em; font-weight:300; margin: 1em 0;}
.article1 {margin-bottom:6%;}
.article1 img {width:100%; height:auto !important;}

.page{display:flex; justify-content: space-between; font-size:0.8rem;font-weight:bold;margin-top:3%;margin-bottom:3%;}


/*アコーディオン↓*/
.webposition{position: relative;max-width: 1920px;margin: auto;}
.accordion{width:18%;position:absolute;right:10%;top:0;}
p {margin: 0;}
ul {margin: 0;padding: 0;}
li {list-style: none;}

.accordion1 {text-align: center;}
.accordion1 .inner {display: none;}
.accordion1 p{cursor: pointer; padding: 10px;}
.accordion1 p.ac1{background: #398DF3;}
.accordion1 p.ac2{background: #61BFE9;}
.accordion1 .inner li{padding: 10px 0;}
.accordion1 .inner li.content1{background: #398DF3;color:white;}
.accordion1 .inner li.content1-1{background: #398DF3;color:white;}
.accordion1 .inner li.content1-2{background: #398DF3;color:white;}
.accordion1 .inner li.content1-3{background: #398DF3;color:white;}
.accordion1 .inner li.content2-1{background: #61BFE9;color:white;}
.accordion1 .inner li.content2-2{background: #61BFE9;color:white;}
.accordion1 .inner li.content2-3{background: #61BFE9;color:white;}


.ac1{color:white; font-weight: 900;text-align: left;position: relative;}
.ac2{color:white; font-weight: 900;text-align: left;position: relative;}
.acd1{margin-bottom: 3%;}

.ac1::after{
    content:"";
    display: inline-block;
    position:absolute;
    width: min(calc((100 / 1920) * 25vw), 25px);
    height: min(calc((100 / 1920) * 25vw), 25px);
    min-width:15px;
    min-height:15px;
    top:12px;
    left: min(calc((100 / 1920) * 280vw), 280px);
    background-image:url(../img/8.columnlist/4.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.ac2::after{
    content:"";
    display: inline-block;
    position:absolute;
    width: min(calc((100 / 1920) * 25vw), 25px);
    height: min(calc((100 / 1920) * 25vw), 25px);
    min-width:15px;
    min-height:15px;
    top:12px;
    left: min(calc((100 / 1920) * 280vw), 280px);
    background-image:url(../img/8.columnlist/4.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.spaccordion{display:none;}
   
/*アコーディオン↑*/







/*SP版非表示↓*/

/*SP版*/
@media screen and (max-width: 800px) {

.detailbr{display:none;}

/*WEB版アコーディオンを非表示↓*/
.accordion {display: none;}

/*SP版のアコーディオンを表示↓*/
.spaccordion{display:block;}
.acd1{margin-bottom: 1%;}
.spaccordion{width:95%; margin: 0 auto;margin-bottom: 3%;}

.ac1::after{
    content:"";
    display: inline-block;
    position:absolute;
    width: min(calc((100 / 1920) * 25vw), 30px);
    height: min(calc((100 / 1920) * 25vw), 30px);
    min-width:15px;
    min-height:15px;
    top:15px;
    left: min(calc((100 / 1920) * 1580vw), 1580px);
    background-image:url(../img/8.columnlist/4.svg);
    background-size: contain;
    background-repeat: no-repeat;
    }

    .ac2::after{
        content:"";
    display: inline-block;
    position:absolute;
    width: min(calc((100 / 1920) * 25vw), 30px);
    height: min(calc((100 / 1920) * 25vw), 30px);
    min-width:15px;
    min-height:15px;
    top:15px;
    left: min(calc((100 / 1920) * 1580vw), 1580px);
    background-image:url(../img/8.columnlist/4.svg);
    background-size: contain;
    background-repeat: no-repeat;
    }
     

    /*記事↓*/
    .article h3{font-size: 22px; line-height:25px;}
    .article{width:100%;margin-left: 0;}
    .articleimg{
        background-image:url(../img/9.columndetail/2.jpg);
        background-repeat: no-repeat;
        background-size:cover;
        background-position:center;
        align-items: center;
        height: min(calc((100 / 1920) * 1300vw), 1300px);
        margin: 0 auto;
    }

    .columunitem{padding:2.5%;}
    .article p {font-size: 14px; line-height:25px;}
}
