/* ～～～～～～～～～～～～～～～～～～～ */
/* 鴨鍋のｃｓｓ */
/* ～～～～～～～～～～～～～～～～～～～ */


@charset "utf-8";
*{
    padding: 0;
    margin: 0;
}
main{
    background-color: rgb(249, 243, 234);
}
.news-head-logo{
    text-align: center;
}
/* グリッドの始まり */
.container{
    display: grid;
    grid-template-columns: 1fr 4fr 4fr 1fr;
    grid-template-rows: 150px 370px 150px 100px 600px 500px 500px 300px ;
    grid-template-areas: "rit dai     dai      left"
                         "rit nabega  housouga left"
                         "rit shoumei shoumei  left"
                         "rit kakaku  kakaku   left"
                         "rit bunn    bunn     left"
                         "rit nabedou nabedou  left"
                         "rit sukidou sukidou  left"
                         "rit link    link     left"
                         ;
}
/* 右端 */
.rit{
    grid-area: rit;
}
/* 題名 */
.dai{
    grid-area: dai;
    text-align: center;
    vertical-align: bottom;
    font-size: 2vw;
    font-family: "Shippori Mincho", serif;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 2;
    color: black;
    padding-top: 1%;
    border-bottom: 2px solid #888e7e;
}
/* 鍋画像 */
.nabega{
    grid-area: nabega;
    text-align: center;
    padding-top: 9%;
}
/* 折画像 */
.housouga{
    grid-area: housouga;
    text-align: center;
    padding-top: 9%;
}
/* 商品名 */
.shoumei{
    grid-area: shoumei;
    text-align: center;
    vertical-align: bottom;
    font-size: 1.4vw;
    font-family: "Shippori Mincho", serif;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 2;
    color: black;
}
/* 価格 */
.kakaku{
    grid-area: kakaku;
    text-align: center;
    vertical-align: bottom;
    font-size: 1.4vw;
    font-family: "Shippori Mincho", serif;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 2;
    color: black;
}
/* 説明文 */
.bunn{
    grid-area: bunn;
    text-align: center;
    vertical-align: bottom;
    font-size: 1.2vw;
    font-family: "Shippori Mincho", serif;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 2;
    color: black;
}
/* 動画 */
.nabedou{
    grid-area: nabedou;
    text-align: center;
    width: 100%;
    position: relative;
    padding-top: 56.25%;
}
.nabedou iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60%;
    height: 60%;
}
.sukidou{
    grid-area: sukidou;
    text-align: center;
    width: 100%;
    position: relative;
    padding-top: 56.25%;
}
.sukidou iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60%;
    height: 60%;
}
/* リンク */
.link{
    grid-area: link;
    text-align: center;
    vertical-align: bottom;
    font-size: 2vw;
    font-family: sans-serif;
    font-weight: 600;
    line-height: 2;
    color: black;
    padding-top: 5%;
}
.link a{
    text-decoration: underline;
}
    

/* フッター */
footer{
    text-align: center;
    font-family: serif;
    background-color: black;
    color: white;
}