@charset "UTF-8";   
    #contents h2 {
        font-size:17px;
        margin: -70px -20px 90px 0;
        transform: rotate(15deg); 
        display: block;
        text-align: right;
    }

    #contents div#top > p {
        text-align: right;
    }

    #contents .trouble + p {
    margin-top:-30px;
    }
    
/*/////// うんちくコーナー ///////*/
    #contents .trouble{
        width:95%;
        margin:0 auto 60px;
        padding: 30px 20px 20px 20px;
        font-size:14px;
        border-radius: 10px;
        box-sizing: border-box;
        border:2px solid #000;
    }

    #contents .trouble_tit{
        width:100%;
        text-align: center;
        margin:-10px 0 -15px;
    }

    #contents .trouble_tit > p{
        display: inline;
        font-weight: bold;
        font-size: 17px;
        padding:3px;
        background-color: white;
    }

    #contents .nayami{
        text-align-last: justify;
}
    

/*/////// ラインナップ ///////*/
    #contents ul.lineup_ldp > li{
        width:100%;
        max-width:100%;
        display: flex;
        flex-flow: row wrap;
        justify-content: space-between;
        margin:50px 0; 
    }
    
    /* 画像 */
    #contents .lineup_ldp > li > img{
        width:40%;
        margin:0;
        position: relative;
        border-radius: 10px;
    }
    
    /* テキスト */
    #contents .lineup_ldp > li > dl{
        width:calc(60% - 40px);
        margin-left:40px;
        position: relative;
    }

    /* タイトル */
    #contents .lineup_ldp > li > dl > dt{
        font-size:20px;
        line-height: 1.3em;
        margin: 3px 0 15px;
    }

    /* サブタイトル */
    #contents .lineup_ldp > li > dl > dt > span{
        font-size:16px;
    }
    
    #contents .lineup_ldp > li > dl > dd{
        font-size:14px;
        width:100%;
        margin-bottom:15px;
        line-height: 1.5em;
    }
    
    #contents .lineup_ldp > li > dl > dd:nth-of-type(2){
        font-size:11px;
        letter-spacing: 0.02em;
        margin-bottom:10px;
    }
    

    #contents .lineup_ldp > li > dl > a{
        font-size:12px;
        position: absolute;
        right:0;
        bottom:0;
        color:#000000;
        padding: 4px 12px;
        border-radius: 20px;
        box-sizing: border-box;
        border:1px solid #000;
    }

    #contents .lineup_ldp > li:first-of-type > dl > a:hover{
        background-color: #b2eaff;
    }

    #contents .lineup_ldp > li:nth-of-type(2) > dl > a:hover{
        background-color: #e2ef97;
    }

    #contents .lineup_ldp > li:last-of-type > dl > a:hover{
        background-color: #d7c4e5;
    }

/*/////// 比較表 ///////*/
    #contents table.laundry {
        width:100%;
        margin:20px auto 60px;
        border-collapse:  collapse; /* セルの線を重ねる */
        table-layout: fixed;        /* セルの幅計算指定 */
    }
    #contents table.laundry td,th{
        border:1px solid #999999;
        font-size:12px;
        text-align: center;
        padding:10px;

    }
    
    #contents table.laundry td > span {
        display: inline-block;
        padding-bottom:5px;
        font-size:24px;
        font-weight: bold;
        font-family: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    }
    
    #contents table.laundry th{
        background: #efefef;
        font-weight: 700;
        padding:12px 0;
        font-size: 14px;
        letter-spacing: -0.05em;
    }

    #contents table.laundry tr:last-of-type > td {
        text-align: justify;
        vertical-align: top;
        line-height: 1.5em;
    }




/*/////// スマホ用 ///////*/
@media screen and (max-width: 480px) {
    
    #contents .trouble{
        width: 100%;
        margin: 0 auto 40px;
        padding: 25px 15px 15px 15px;
        font-size: 13px;
    }
    
    #contents .nayami{
        text-align-last: center;
}

    #contents table.laundry td,th{
        font-size:12px;
        text-align: center;
        padding:10px;
        line-height: 1.5em;
    }
    
    
    #contents .lineup_ldp > li > img {
        max-width: 350px;
        width: 80% !important;
        margin: 0 auto;
    }

    #contents .lineup_ldp > li > dl {
        width: 100%;
        margin: 10px;
    }

    #contents .lineup_ldp > li > dl > dt {
        font-size: 18px;
        margin: 3px 0 10px;
    }
    
    #contents .lineup_ldp > li > dl > dt > span {
        font-size: 14px;
    }

    #contents .lineup_ldp > li > dl > a {
        margin-bottom: -20px;
    }
    
    #contents h2 {
        font-size: 14px;
        margin: -30px -10px 50px 0;
}

}