@charset "UTF-8"; /*  文字コードの指定（Shift_JIS, EUC-JP,UTF-8） */
/************************************************/
/*  製品情報基本設定                            */
/*    画面サイズ                                */
/*      1260px以上 : width 1220px               */
/************************************************/
/*------------------ ブロック ------------------*/
div.group1{
    /* 背景 */
    background-color           : #599fff;      /* 背景色 */
    /* マージン・パディング */
    margin-top                 : 3.2rem;       /* 外側の余白（上） */
    /* 表示・配置 */
    clear                      : both;         /* フロート解除 */
}
div.group2{
}
div.group3{
}
/************************************************/
/*  商品コンセプト設定                          */
/************************************************/
.concept p{
    /* マージン・パディング */
    margin-top                 : 0.8rem;       /* 外側の余白（上） */
}
/************************************************/
/*  ラインナップ設定                            */
/************************************************/
div.promotion{
    /* 背景 */
    background-color           : #808080;      /* 背景色 */
}
.promotion div.name{
    /* 背景 */
    background-color           : #ff55ff;      /* 背景色 */
    /* 表示・配置 */
    clear                      : both;         /* フロート解除 */
}
.promotion .infomation div.title{
    /* マージン・パディング */
    margin-top                 : 2.2rem;       /* 外側の余白（上） */
    /* 表示・配置 */
    clear                      : both;         /* フロート解除 */
    /* テキスト・フォント */
    font-size                  : 1.2rem;       /* 文字サイズ */
}
.promotion .infomation + .fclear + .infomation > div.title{
    /* マージン・パディング */
    margin-top                 : 1.4rem;       /* 外側の余白（上） */
}
.promotion .infomation div.img{
    /* 背景 */
    background-color           : #59ff9f;      /* 背景色 */
    /* 幅・高さ */
    width                      : 283px;        /* 内容領域の幅 */
    /* 表示・配置 */
    float                      : left;         /* フロート */
    /* テキスト・フォント */
    font-size                  : 0.8rem;       /* 文字サイズ */
    text-align                 : center;       /* 水平方向の表示位置 */
}
.promotion .infomation div.list{
    /* 背景 */
    background-color           : #59ff9f;      /* 背景色 */
    /* 幅・高さ */
    width                      : 210px;        /* 内容領域の幅 */
    /* 表示・配置 */
    float                      : left;         /* フロート */
    /* テキスト・フォント */
    font-size                  : 0.8rem;       /* 文字サイズ */
    text-align                 : center;       /* 水平方向の表示位置 */
}
.promotion .infomation div.list.text{
    /* テキスト・フォント */
    font-size                  : 1.0rem;       /* 文字サイズ */
    text-align                 : left;         /* 水平方向の表示位置 */
}
.promotion .text p{
    /* マージン・パディング */
    margin-top                 : 0.8rem;       /* 外側の余白（上） */
}
.promotion .text p + p{
    /* マージン・パディング */
    margin-top                 : 1.2rem;       /* 外側の余白（上） */
}
/* ++++++++         1260px以上         ++++++++ */
@media screen and (min-width:1260px) {
/*---------------- デザイン設定 ----------------*/
.promotion > div.text{
    /* 幅・高さ */
    width                      : 1196px;       /* 内容領域の幅 */
    /* マージン・パディング */
    padding-left               : 24px;         /* 内側の余白（左） */
    /* テキスト・フォント */
    font-size                  : 1.2rem;       /* 文字サイズ */
}
.promotion > div.text p.notes{
    /* テキスト・フォント */
    font-size                  : 1.0rem;       /* 文字サイズ */
}
.promotion .infomation div.title + div.info1{
    /* マージン・パディング */
    margin                     : 0px auto;     /* 外側の余白（中央揃え） */
}
/*                    幅・高さ                  */
.group1 div.info1.col1{ width : 244px; } /* 内容領域の幅 */
.group1 div.info1.col2{ width : 488px; } /* 内容領域の幅 */
.group1 div.info1.col3{ width : 732px; } /* 内容領域の幅 */
.group1 div.info1.col4{ width : 976px; } /* 内容領域の幅 */
.group1 div.info1.col5{ width : 1220px; } /* 内容領域の幅 */
.promotion .infomation div.title + div.info2{
    /* 幅・高さ */
    width                      : 580px;        /* 内容領域の幅 */
    /* マージン・パディング */
    margin                     : 0px auto;     /* 外側の余白（中央揃え） */
}
.promotion .infomation div.img + div.img{
    /* マージン・パディング */
    margin-left                : 14px;         /* 外側の余白（左） */
}
.promotion .infomation div.list{
    /* マージン・パディング */
    margin                     : 5px 17px;     /* 外側の余白 */
}
/*                    幅・高さ                  */
.promotion .infomation div.list.col2{ width : 454px; } /* 内容領域の幅 */
.promotion .infomation div.list.col3{ width : 698px; } /* 内容領域の幅 */
.promotion .infomation div.list.col4{ width : 942px; } /* 内容領域の幅 */
/*                                              */
}
/* ++++++++----------------------------++++++++ */
/* ++++++++         1259px以下         ++++++++ */
@media screen and (max-width:1259px) {
/*---------------- デザイン設定 ----------------*/
div.group1{
    /* マージン・パディング */
    margin-top                 : 2.4rem;       /* 外側の余白（上） */
}
.promotion > div.text{
    /* マージン・パディング */
    padding-left               : 0.5em;        /* 内側の余白（左） */
}
.promotion div.name + div.text{
    /* マージン・パディング */
    margin-top                 : 0.4rem;       /* 外側の余白（上） */
}
.promotion .infomation div.title + div.info2{
    /* 幅・高さ */
    width                      : 80vw;         /* 内容領域の幅 */
    /* マージン・パディング */
    margin                     : 0px auto;     /* 外側の余白（中央揃え） */
}
.promotion .infomation div.img + div.img{
    /* マージン・パディング */
    margin-top                 : 0.4rem;       /* 外側の余白（上） */
}
.promotion .infomation div.list{
    /* 幅・高さ */
    width                      : 30vw;         /* 内容領域の幅 */
    height                     : auto;         /* 内容領域の高さ */
    /* マージン・パディング */
    margin-top                 : 1.4rem;       /* 外側の余白（上） */
}
.promotion .infomation div.list img{
    /* 幅・高さ */
    width                      : 30vw;         /* 内容領域の幅 */
    height                     : auto;         /* 内容領域の高さ */
}
.promotion .infomation div.info1{
    /* 幅・高さ */
    width                      : 80vw;         /* 内容領域の幅 */
    /* マージン・パディング */
    margin                     : 0px auto;     /* 外側の余白（中央揃え） */
}
.promotion .infomation .info1 div.list{
    /* 幅・高さ */
    width                      : 80vw;         /* 内容領域の幅 */
    /* テキスト・フォント */
    font-size                  : 1.2rem;       /* 文字サイズ */
}
.promotion .infomation .info1 div.list + div.list{
    /* マージン・パディング */
    margin-top                 : 2.8rem;       /* 外側の余白（上） */
}
.promotion .infomation .info1 div.list img{
    /* 幅・高さ */
    width                      : 80vw;         /* 内容領域の幅 */
}
/*                                              */
}
/* ++++++++----------------------------++++++++ */
/*++++++++++++++++++++++++++++++++++++++++++++++*/
/*  デバッグ用                                  */
/*++++++++++++++++++++++++++++++++++++++++++++++*/
*{
    /* 背景 */
    background-color           : transparent !important; /* 背景色 */
}


