@charset "UTF-8";
/*-------------------------
- base
- MV
- sec_special
- sec_blue-fes
- sec_promotion
- sec_snag-golf
- sec_playground
- sec_dunlop
- sec_map
-------------------------*/

/*=======================================
　base
=======================================*/
:root{
    --frame-gradation01: linear-gradient(90deg, #f9d3e3 1.87%, #fffac0 43.46%, #d3dfee 87%);
    --frame-gradation02: linear-gradient(90deg, #e7f3e8 1.87%, #fffac0 42.45%, #9fd9f6 78.29%);
    --frame-gradation03: linear-gradient(90deg, #d1c5e1 1.87%, #fffac0 42.45%, #d1c5e1 78.46%);
}

#suntory_contents img{
    display: block;
}

#suntory_contents .inner{
    width: 89.33%;
}

#suntory_contents .contents{
    background: #FFF;
}

#suntory_contents .day,
#suntory_contents .topic,
#suntory_contents .place{
    margin-inline: auto;
}

#suntory_contents .upper{
    text-transform: uppercase;
}

/*=======================================
　MV
=======================================*/
#suntory_contents .mv{
    width: 100%;
    margin-bottom: 0.554rem;
}
    /* ------PC MV */
    @media screen and (min-width: 769px){
        #suntory_contents .mv{
            margin-bottom: 1.107rem;
        }
    }
    /* /////PC mv */

/*=======================================
　sec_special
=======================================*/
#suntory_contents .sec_special .day{
    width: 46.8%;
    margin-bottom: 1.072rem;
}

#suntory_contents .sec_special .topic{
    width: clamp(271.7px, 81.1%, 543.4px);
    margin-bottom: 0.679rem;
}

#suntory_contents .sec_special .place{
    width: 63%;
    margin-bottom: 1.5rem;
}

#suntory_contents .content-box{
    background: #FFF;
    border: 7px solid;
    border-image: var(--frame-gradation01) 1;
    box-sizing: border-box;
    margin-bottom: 4rem;
    padding: 2rem 1rem;
    filter: drop-shadow(0 8px 4px rgba(4, 0, 0, 0.5));
    will-change: transform;
    mix-blend-mode: multiply;
}

#suntory_contents .special_img{
    margin-bottom: 0.536rem;
}

#suntory_contents .snag-golf_img,
#suntory_contents .playground_img,
#suntory_contents .box_dunlop .content_img{
    margin-bottom: 0.1rem;
}

#suntory_contents .note{
    font-size: 0.643rem;
    text-align: right;
    margin-bottom: 0.75rem;
}

#suntory_contents .content01,
#suntory_contents .content02{
    margin-bottom: 1.607rem;
}

#suntory_contents .content03{
    margin-bottom: 0.572rem;
}

#suntory_contents .content_day{
    width: 70px;
}

#suntory_contents .content_topic{
    font-size: 1.215rem;
    font-weight: 700;
    padding-left: 22px;
    margin-bottom: 0.143rem;
    position: relative;
}

#suntory_contents .content_topic::before{
    content: "";
    display: block;
    width: 13.5px;
    aspect-ratio: 1/1;
    background: #e95b9c;
    position: absolute;
    top: 8px;
    left: 2px;
}

#suntory_contents .content_note{
    margin-bottom: 0.572rem;
    font-size: 0.786rem;
    line-height: 1;
    display: flex;
    gap: 0.857rem;
}

#suntory_contents .sec_special .content_list li{
    font-size: 1rem;
    line-height: 1.75;
    padding-left: 11px;
    position: relative;
}

#suntory_contents .box_special .content_list li::before{
    content: "";
    display: block;
    width: 9px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background: #e95b9c;
    position: absolute;
    top: 7.5px;
    left: 1px;
}

#suntory_contents .content_target{
    font-size: 1rem;
}

#suntory_contents .content_list .span01{
    display: inline-block;
    color: #fff;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.1em;
    background-color: #00abe4;
    padding: 3px 8.5px;
}

#suntory_contents .content_list .span02{
    padding-left: 30px;
}

#suntory_contents .content_list .span03{
    display: block;
    font-size: 0.786rem;
    margin-top: -0.219rem;
    padding-left: 30px;
}

#suntory_contents .content_list .span04{
    padding-left: 70px;
}

    /* ---------PC sec_special-------- */
    @media screen and (min-width: 769px){
        #suntory_contents .content_day{
            width: 140px;
        }

        #suntory_contents .content_topic{
            padding-left: 40px;
        }

        #suntory_contents .content_topic::before{
            width: 27px;
            top: 17px;
            left: 4px;
        }

        #suntory_contents .content-box{
            border: 14px solid;
            border-image: var(--frame-gradation01) 1;
            padding: 2rem 42px 1rem;
        }

        #suntory_contents .sec_special .content_list li{
            padding-left: 22px;
        }
        
        #suntory_contents .box_special .content_list li::before{
            width: 18px;
            top: 16px;
        }

        #suntory_contents .content_list .span01{
            padding: 6px 17px;
        }

        #suntory_contents .content_list .span02,
        #suntory_contents .content_list .span03{
            padding-left: 120px;
        }

        #suntory_contents .content_list .span04{
            padding-left: 140px;
        }
    }
    /* /////////PC sec_special */

/*=======================================
　sec_blue-fes
=======================================*/
#suntory_contents .sec_blue-fes .day{
    width: 26.7%;
    margin-bottom: 0.965rem;
}

#suntory_contents .sec_blue-fes .topic{
    width: 72.8%;
    margin-bottom: 1.107rem;
}

#suntory_contents .box_blue-fes{
    border-image: var(--frame-gradation02) 1;
    padding: 2.286rem 10px;
    text-align: center;
}

#suntory_contents .box_blue-fes .blue-flag{
    width: 84.83%;
    margin-inline: auto;
    margin-bottom: 1.5rem;
}

#suntory_contents .box_blue-fes .date{
    width: 53.13%;
    margin-inline: auto;
    margin-bottom: 1.143rem;
}

#suntory_contents .box_blue-fes .content_txt{
    font-size: 1rem;
    line-height: 1.786;
    margin-bottom: 1.107rem;
}

#suntory_contents .box_blue-fes .content_txt span{
    color: #00afd0;
    font-weight: 700;
    font-size: 1.072rem;
    line-height: 1.7333;
}

/*=======================================
　sec_promotion
=======================================*/

#suntory_contents .sec_promotion .day{
    width: 46.78%;
    margin-bottom: 1.036rem;
}

#suntory_contents .sec_promotion .topic{
    width: 93.13%;
    margin-bottom: 1.036rem;
}

#suntory_contents .box_promotion{
    border: 7px solid #00afd0;
}

#suntory_contents .box_promotion .content_topic{
    font-size: 1.322rem;
    color: #00afd0;
}

#suntory_contents .box_promotion .content_topic::before{
    background-color: #b28247;
    top: 9px;
}

#suntory_contents .promotion_list li:not(:last-of-type){
    margin-bottom: 1.607rem;
}

#suntory_contents .promotion_list li p{
    font-size: 1rem;
}

    /* -----------PC sec_promotion */
    @media screen and (min-width: 769px){
        #suntory_contents .box_promotion .content_topic::before{
            top: 19px;
        }
    }
    /* /////////PC sec_promotion */

/*=======================================
　sec_snag-golf
=======================================*/
#suntory_contents .sec_snag-golf .day{
    width: 46.78%;
    margin-bottom: 0.964rem;
}

#suntory_contents .sec_snag-golf .topic{
    width: 63.1%;
    margin-bottom: 0.75rem;
}

#suntory_contents .sec_snag-golf .place{
    width: 63%;
    margin-bottom: 1.036rem;
}

#suntory_contents .box_snag-golf{
    border-image: var(--frame-gradation02) 1;
    padding: 1.286rem 21px;
}

#suntory_contents .box_snag-golf .participation{
    font-size: 0.786rem;
}

#suntory_contents .box_snag-golf .content_topic{
    color: #00b08d;
    font-size: 1rem;
    font-weight: 500;
    padding-left: 15px;
}

#suntory_contents .box_snag-golf .content_topic::before{
    width: 12px;
    background: #00b08d;
    top: 6px;
}

#suntory_contents .box_snag-golf .participation{
    margin-bottom: 0.607rem;
}

#suntory_contents .experience p:not(:nth-of-type(3)){
    font-size: 1rem;
    padding-left: 11px;
    position: relative;
}

#suntory_contents .experience p:not(:nth-of-type(3))::before{
    content: "";
    display: block;
    width: 9px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background-color: #00b08d;
    position: absolute;
    top: 8px;
    left: 0px;
}

#suntory_contents .experience p:last-of-type{
    font-size: 0.786rem;
    margin-bottom: 0.429rem;
}

    /* -------PC sec_snag-golf */
    @media screen and (min-width: 769px){
        #suntory_contents .box_promotion{
            border: 14px solid #00afd0;
        }

        #suntory_contents .box_snag-golf .content_topic{
            padding-left: 30px;
        }
        
        #suntory_contents .box_snag-golf .content_topic::before{
            width: 22.5px;
            top: 13px;
        }

        #suntory_contents .experience p:not(:nth-of-type(3)){
            margin-bottom: 0.071rem;
            padding-left: 22px;
        }
        
        #suntory_contents .experience p:not(:nth-of-type(3))::before{
            width: 18px;
            top: 16px;
            left: 3px;
        }
    }
    /* //////////PC sec_snag-golf */

/*=======================================
　sec_playground
=======================================*/
#suntory_contents .sec_playground .day{
    width: 46.78%;
    margin-bottom: 1.054rem;
}

#suntory_contents .sec_playground .topic{
    width: 41.9%;
    margin-bottom: 0.429rem;
}

#suntory_contents .sec_playground .place{
    width: 63%;
    margin-bottom: 1.286rem;
}

#suntory_contents .box_playground{
    border-image: var(--frame-gradation02) 1;
    padding: 1.286rem 21px;
}

/*=======================================
　sec_dunlop
=======================================*/
#suntory_contents .sec_dunlop .day{
    width: 46.78%;
    margin-bottom: 1.125rem;
}

#suntory_contents .sec_dunlop .topic{
    width: 77.2%;
    margin-bottom: 1.125rem;
}

#suntory_contents .box_dunlop{
    border-image: var(--frame-gradation03) 1;
    padding: 1.429rem 28px;
}

#suntory_contents .dark-orange{
    color: #b28247;
}

#suntory_contents .dunlop_list{
    list-style: none;
}

#suntory_contents  .sec_dunlop .content_topic{
    color: #a660a3;
    padding-left: 18px;
    margin-bottom: 1.036rem;
}

#suntory_contents .sec_dunlop .content_topic::before{
    background-color: #a660a3;
    top: 8px;
}

#suntory_contents .sec_dunlop .content02 .content_topic{
    line-height: 1.5;
}

#suntory_contents .sec_dunlop .content02 .content_topic::before{
    top: 7px;
}

#suntory_contents .box_dunlop .participation{
    font-size: 0.786rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

#suntory_contents .content01 li img{
    display: inline-block;
    width: 129.8px;
    margin-right: 15px;
    padding-left: 11px;
    padding-bottom: 0.215rem;
}

#suntory_contents .box_dunlop .content01 li{
    position: relative;
    font-size: 1rem;
}

#suntory_contents .box_dunlop .content01 li:last-of-type{
    padding-left: 11px;
}

#suntory_contents .sec_dunlop .content01 li::before,
#suntory_contents .sec_dunlop .content02 li::before,
#suntory_contents .sec_dunlop .content03 li::before{
    content: "";
    display: block;
    width: 10px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background-color: #a660a3;
    position: absolute;
    top: 8px;
    left: 0;
}

#suntory_contents .content02 .participation{
    margin-bottom: 0;
}

#suntory_contents .content02 .dunlop_list img{
    display: inline-block;
    width: 250px;
}

#suntory_contents .content02 .dunlop_list li,
#suntory_contents .content03 .dunlop_list li{
    padding-left: 11px;
    position: relative;
    font-size: 1rem;
    line-height: 1.75;
}

#suntory_contents .content02 .dunlop_list li:first-of-type::before{
    top: 13px;
}

#suntory_contents .content03 .participation{
    font-size: 0.786rem;
}

#suntory_contents .content03 .dunlop_list li:not(:nth-of-type(3)):before{
    top: 9px;
}

#suntory_contents .content03 .dunlop_list li:nth-of-type(3)::before{
    top: 8px;
}

#suntory_contents .content03 li img{
    display: inline-block;
    width: 69px;
    margin-right: 15px;
    padding-bottom: 0.215rem;
}

    /* ------------PC sec_dunlop */
    @media screen and (min-width: 769px){
        #suntory_contents  .sec_dunlop .content_topic{
            padding-left: 34px;
        }
        
        #suntory_contents .sec_dunlop .content_topic::before{
            top: 17px;
        }

        #suntory_contents .content01 li img{
            width: 259.5px;
            margin-right: 30px;
            padding-left: 22px;
        }

        #suntory_contents .sec_dunlop .content01 li::before,
        #suntory_contents .sec_dunlop .content02 li::before,
        #suntory_contents .sec_dunlop .content03 li::before{
            width: 18px;
            top: 16px;
            left: 3px;
        }

        #suntory_contents .box_dunlop .content01 li:last-of-type{
            padding-left: 22px;
        }

        #suntory_contents .sec_dunlop .content02 .content_topic::before{
            top: 14px;
        }

        #suntory_contents .content02 .dunlop_list img{
            width: 500px;
        }

        #suntory_contents .content02 .dunlop_list li,
        #suntory_contents .content03 .dunlop_list li{
            padding-left: 22px;
        }

        #suntory_contents .content02 .dunlop_list li:first-of-type::before{
            top: 26px;
        }

        #suntory_contents .content03 li img{
            width: 138px;
            margin-right: 30px;
        }

        #suntory_contents .content03 .dunlop_list li:not(:nth-of-type(3)):before{
            top: 20px;
        }

        #suntory_contents .content03 .dunlop_list li:nth-of-type(3)::before{
            top: 18px;
        }
    }
    /* /////////PC sec_dunlop */

/*=======================================
　sec_map
=======================================*/
#suntory_contents .sec_map{
    margin-bottom: 3.357rem;
}

#suntory_contents .sec_map .topic{
    width: 43.8%;
    margin-bottom: 1.215rem;
}

#suntory_contents .sec_map .inner{
    width: 93.1%;
}

#suntory_contents .sec_map .btn_map{
    width: 50%;
    max-width: 360px;
    margin: 0 auto 0.75rem;
}

#suntory_contents .sec_map .map_img{
    margin-bottom: 0.7rem;
}

#suntory_contents .sec_map .btn_map a {
    width: 100%;
    height: 4.85rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    background: #00afd0;
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    color: #fff100;
    border-radius: 10px;
    line-height: 1.5;
}

@media screen and (min-width: 769px){
    #suntory_contents .sec_map .btn_map a{
        border-radius: 21px;
    }
}

#suntory_contents .sec_map .caption{
    font-size: 0.71rem;
    margin-left: 2rem;
}


/* ////////////////
special event
/////////////// */
#suntory_contents .title{
    text-align: center;
    font-size: 44px;
}

#suntory_contents .title .en{
    color: #01608c;
    font-size: 22px;
}