@charset "UTF-8";
@import url("./module.css?date=20230426");
/* ==========================================================

Name:
    top.css

Description:
    トップページ共用モジュール

========================================================== */

/*  main_image-area メインイメージエリア
--------------------------------------------- */
@media screen and (min-width: 768px) { /* pc size */
    #main_image-area .image-copy {
        background: url(../img/top/main_image_desc.svg) top left no-repeat;
        background-size: 160px;
        background-position: top 45% left 0px;
    }
}
@media screen and (max-width: 767px) { /* sp size */
    #main_image-area .sp-image-copy {
        background: url(../img/top/sp/main_image_desc.svg) top 20px center no-repeat;
        background-size: 80%;
        height: 0;
        padding-top: 27.6666666667%;
        text-indent: -9999px;
    }
}


/*  product_info-area 製品情報エリア
--------------------------------------------- */

#product_info-area .concept-title {
    font-size: 26px;
}
@media screen and (max-width: 767px) { /* sp size */
    #product_info-area .concept-title {
        font-size: 5.83333vw;
    }
}

@media screen and (min-width: 768px) { /* pc size */
    #product_info-area .concept-desc {
        margin-top: 50px;
    }
}
@media screen and (max-width: 767px) { /* sp size */
    #product_info-area .concept-desc {
        font-size: 3.93333vw;
    }
}

@media screen and (max-width: 767px) { /* sp size */
    #product_info-area .concept-area {
        background: url('') top left no-repeat;
        background-position: left 0 top 20px;
        min-height: 430px;
    }
}


/*  product-area
--------------------------------------------- */

@media screen and (min-width: 768px) { /* pc size */
    #product_info-area .product-area dt .product-btn {
        position: inherit;
        top: 0;
        left: 0;
        margin-top: 20px;
    }
}

/*  new_brand-pickup-area 新ブランド・ピックアップエリア
--------------------------------------------- */

@media screen and (min-width: 768px) { /* pc size */
    .brand-area {
        background: url(../img/top/new_brand-title.svg) top left no-repeat;
        background-position: left 20px top;
    }
    .brand-area ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;

        margin-left: 290px;
    }
}
@media screen and (max-width: 767px) { /* sp size */
    .sp-brand-title {
        background: url(../img/top/sp/new_brand-title.svg) top left no-repeat;
        background-position: center top;
        background-size: 80%;
        height: 0px;
        padding-top: 25.1888034188%;
        text-indent: -9999px;
    }
}

@media screen and (min-width: 768px) { /* pc size */
    .brand-area li {
        width: 49%;
        padding: 0;
    }
    .brand-list {
        background-color: #E8D2B3;
        padding: 10px;
    }
    .brand-list li.list-poche {
        margin-left: 14px;
    }
}

/*  our_strength-area ゴリーデンケリーの強みエリア
--------------------------------------------- */

@media screen and (min-width: 768px) { /* pc size */
    #our_strength-area .strength-point {
        padding: 60px 20px 20px 20px;
        height: 250px;
    }
    #our_strength-area .point {
        width: 100px;
        position: absolute;
        top: -60px;
        left: 0;
    }
}
@media screen and (max-width: 767px) { /* sp size */
    #our_strength-area .strength-point {
        padding: 60px 10px 20px 10px;
    }
    #our_strength-area .point {
        width: 80px;
        position: absolute;
        top: -30px;
        left: -10px;
    }
    #our_strength-area .strength-desc {
        margin-bottom: 40px;
    }
}