@charset "Shift_JIS";

/* util
-----------------------------------------------------------*/
.mb-10{
    margin-bottom: 10px;
}

.mb-20{
    margin-bottom: 20px;
}

.mb-40{
    margin-bottom: 40px;
}

.text-center{
    text-align: center;
}


/* pikmin4
-----------------------------------------------------------*/
.pikmin4 {
    color: #000;
    margin: 0 auto;
    width: 980px;
    background-image: url(./img/bg.png);
    background-repeat: no-repeat;

}

.pikmin4 :is(img, iframe){
    vertical-align: top;
}

.pikmin4 *,
.pikmin4 *:before,
.pikmin4 *:after{
    box-sizing: border-box;
}

.mv{
    margin-bottom: 42px;
}

.release_date{
    text-align: center;
    margin-bottom: 51px;
}

.btn-hover{
    *zoom: 1;
    -ms-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.btn-hover:hover{
    opacity: .8;
}

/* items
-----------------------------------------------------------*/
.items_wrapper{
    width: 935px;
    height: 539px;
    margin-inline: auto;
    color: #333;
    background-image: url(./img/bg_items.png);
    background-repeat: no-repeat;
    margin-bottom: 56.3px;
}

.items h2{
    box-sizing: content-box;
    height: 80px;
    padding-top: 13px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 35px;
    font-weight: bold;
}

.items_content{
    width: 685px;
    margin-inline: auto;
    margin-top: 30px;
    display: flex;
    gap: 0 78px;
}

.items_info{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
}

.items_price{
    color: #FF000C;
    letter-spacing: -0.02em;
}

.items_price_type{
    font-size: 28px;
    font-weight: bold;
    line-height: calc(50/28);
}

.items_price_box{
    display: flex;
    align-items: center;
    gap: 0 10px;
}

.items_price_box_left{
    font-size: 95.5px;
    font-weight: bold;
    line-height: 125px;
}

.tax_inc{
    font-size: 15px;
}

.yen{
    font-size: 46px;
    font-weight: bold;
}

/* video
-----------------------------------------------------------*/
.video_wrapper{
    width: 815px;
    margin-inline: auto;
    color: #FFF;
    text-align: center;
    margin-bottom: 53px;
}

.video_wrapper h2{
    font-size: 50px;
    font-weight: bold;
    letter-spacing: 0.075em;
    height: 75px;
    margin-bottom: 7px;
}

/* introduction
-----------------------------------------------------------*/
.introduction h2{
    font-size: 50px;
    font-weight: bold;
    letter-spacing: 0.075em;
    height: 75px;
    margin-bottom: 44.5px;
}

.introduction_content1{
    color: #FFF;
    width: 815px;
    margin-inline: auto;
    text-align: center;
}

.introduction_catch{
    font-size: 32px;
    font-weight: bold;
    line-height: calc(48/32);
    margin-bottom: 33.3px;
}

.introduction_lead{
    font-size: 18px;
    font-weight: bold;
    line-height: calc(30/18);
    padding-bottom: 62px;
}

.introduction_content2{
    width: 946px;
    margin-inline: auto;
    padding-top: 190px;
}

.introduction h3{
    font-size: 33px;
    font-weight: bold;
    height: 50px;
    margin-bottom: 32.5px;
    color: #826400;
    text-align: center;
}

.introduction_content2 p{
    color: #333;
    font-size: 18px;
    line-height: calc(30/18);
    width: 845px;
    margin-inline: auto;
    margin-bottom: 19.2px;
}

.introduction_img{
    display: flex;
    justify-content: space-between;
    padding-bottom: 77.6px;
}

.introduction_content2 > section:last-child .introduction_img{
    padding-bottom: 0;
}

.introduction_img > div{
    width: 466px;
}

.link{
    padding-top: 113px;
    padding-bottom: 270px;
    box-sizing: content-box;

    background-image: 
        url(./img/bud.png),
        url(./img/leaf.png),
        url(./img/flower.png);
    
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-position: 63px 13px, 168px 50px, 702px 64px;
}

.link_btn{
    width: 319px;
    margin-inline: auto;
}

/* footer
-----------------------------------------------------------*/
.article_footer{
    background-color: #FFA000;
    font-size: 12px;
    color: #333333;
    text-align: center;
    padding: 25px 0;
}

.article_content{
    width: 360px;
    margin-inline: auto;
}

.article_content > p:nth-of-type(1){
    margin-bottom: 30px;
}