@charset "UTF-8";


/* ---------------------------------------------
*   選択フォーム
---------------------------------------------*/
#selectForm{
    display:block;
    overflow:hidden;
    text-align:center;
    margin-bottom:30px;
}

.selectMenu,
#selectForm .allBtn{
    width:300px;
    margin:0 1em;
}

/* for Sp --------------------*/
@media screen and (max-width: 738px) {

   .selectMenu,
   #selectForm .allBtn{
        width:100%;
        margin:0.5em 0;
    }

}


/* ---------------------------------------------
*   製品リスト
---------------------------------------------*/
#itemList{
    display:block;
    overflow:hidden;
}

#itemList > ul{
    margin-bottom:30px;
    border-bottom:1px solid #cccccc;
}

#itemList > ul > li{
    display:block;
    overflow:hidden;
    padding:30px;
    letter-spacing:-.4em;
}

#itemList > ul > li:nth-child(odd){
    background-color:#f7f7f7;
}

#itemList > ul > li .itemPct{
    display:inline-block;
    overflow:hidden;
    width:280px;
    height:220px;
    vertical-align:top;
    background-color:#ffffff;
}


#copyFld{
    opacity:0;
    width:0;
    height:0;
}

.itemData{
   display:inline-block;
   overflow:hidden;
   letter-spacing:normal;
   width:calc(100% - 280px);
   padding-left:30px;
}

.itemData > h4{
    font-size:2.0rem;
    line-height:155%;
    color:#012169;
    padding-bottom:1em;
    margin-bottom:1em;
    border-bottom:1px solid #cccccc;
}

.itemData .code{
    font-size:1.2rem;
}

.itemData > p{
    margin:1em 0;
    line-height: 1.75;
}

/* for Sp --------------------*/
@media screen and (max-width: 738px) {

    #itemList > ul > li{
        padding:1em;
    }

    #itemList > ul > li .itemPct{
        display:block;
        margin-bottom:1em;
        width:100%;
        height:auto;
        min-height:220px;
        /*max-width:280px;*/
    }

    .itemData{
       width:100%;
       padding-left:0;
    }

    .itemData > h4{
        padding:1em 0;
    }

}


/* ---------------------------------------------
*   製品詳細
---------------------------------------------*/

#itemInfoBox{
    display:block;
    overflow:hidden;
    padding:30px;
    margin:0 1em;
    border-top:1px solid #cccccc;
}

#itemInfoBox > .itemPct{
    width:280px;
    height:220px;
    float:left;
    background-color:#ffffff;
}




/* for Sp --------------------*/
@media screen and (max-width: 738px) {

    #itemInfoBox{
        padding:1em;
        margin:0;
        border-top:none;
    }

    #itemInfoBox > .itemPct{
        width:100%;
        height:auto;
        min-height:220px;
        float:none;
    }

    #itemInfoBox .itemData a.lintToItem{
        margin-left:calc(50% - 75px);
    }

}

/* ---------------------------------------------
*   文例リスト
---------------------------------------------*/
#sampleList{
    display:block;
    overflow:hidden;
    padding:0 0 30px;
    margin:0 1em 30px;
    border-bottom:1px solid #cccccc;
}

#sampleList > ul > li{
    display:block;
    overflow:hidden;
    padding:2em;
}

#sampleList > ul > li:nth-child(odd){
    background-color:#f7f7f7;
}

#sampleList > ul > li > p{
    width:calc(100% - 115px);
    padding-right:1em;
    line-height:155%;
    float:left;
}



/* for Sp --------------------*/
@media screen and (max-width: 738px) {
    #sampleList{
        margin:0 0 30px;
    }


    #sampleList > ul > li{
        padding:1em;
        color:both;
    }

    #sampleList > ul > li > p{
        width:100%;
        padding-right:0;
        float:none;
        margin-bottom:1em;
    }

    #sampleList > ul > li > a{
        float:right;
    }

}