/* CSS Document */

/*- File name [ style.css ] -*/

/*------------------------------------------------------------------------------------------------------------------------------------------

* 変更領域

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/

.m-plus-rounded-1c {
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-style: normal;
}

.noto-sans-jp {
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
}



/* body 
-----------------------*/

body, body * {
    font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
}



/* footer 
-----------------------*/

footer .inner{
    background-color: #efd6a3;
}

footer .inner p {
	color: #23190f;
}



/* main 
-----------------------*/

/* main {
    background-color: #fff2bd;
}

main *{
} */



/* title 
-----------------------*/

/* h3.title span {} */



/* box_center 
-----------------------*/

/* .box_center {} */

/* .box_center > * {} */



/* rule 
-----------------------*/

#rule {
    background-color: #FFFFFF;
}

#rule #rule_inner{
    padding-block: clamp(48px, 7.5vw, 96px);
}

#rule .itemLists dd{
    color: #040000;
}

#rule .itemLists dd:last-child{
    padding-bottom: 0;
}



/* method
-----------------------*/

#method {
    padding: 0 10px;
}

#method #method_img + *{
    margin-top: clamp(20px, 3.75vw, 48px);
}



/* insta_btn
-----------------------*/
.insta_btn{
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: linear-gradient(90deg, #f6416c, #b210ff);
    border-radius: 99px;
    font-weight: 500;
    font-size: clamp(1.2rem, 1.5625vw, 2rem);
    color: #FFFFFF;
    margin-inline: auto;
    max-width: 490px;
    height: clamp(34px, 5vw, 64px);
    width: 74%;
    position: relative;
}

.insta_btn::after{
    content: "";
    display: block;
    background: url(../img/icon_arrow.svg) no-repeat center;
    background-size: contain;
    aspect-ratio: 1 / 1.8;
    width: clamp(5px, 0.78125vw, 10px);
    transform: translateY(-50%);
    position: absolute;
    right: clamp(10px, 1.40625vw, 18px);
    top: 50%;
}

.insta_btn:hover{
    opacity: 0.7;
}






/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print, screen and (min-width: 768px) {}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print, screen and (min-width: 1024px) {}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print, screen and (min-width: 1280px) {}







/*------------------------------------------------------------------------------------------------------------------------------------------

* fv

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/
.fv{
    position: relative;
}

.fv .fv_img_sp{
    background: url(../img/fv_sp_bg.png) no-repeat center;
    background-size: contain;
}

.fv .fv_img_tab{
    display: none;
}

.fv .fv_img_pc{
    display: none;
}

/* anchor_list */
.fv #anchor_list{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 85vw;
    transform: translateX(-50%);
    position: absolute;
    bottom: clamp(56px, 10.9375vw, 140px);
    left: 50%;
}

.fv #anchor_list a{
    display: block;
    margin-inline: auto;
    width: clamp(40px, 10.4166vw, 80px);
}

.fv #anchor_list img{
    aspect-ratio: 1 / 2.2;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {

    .fv .fv_img_sp{
        display: none;
    }

    .fv .fv_img_tab{
        display: block;
    }

    .fv .fv_img_tab img, .fv .fv_img_pc img{
        margin-inline: auto;
        min-height: 960px;
        object-fit: cover;
    }

    /* anchor_list */
    .fv #anchor_list{
        width: 392px;
        bottom: 92px;
    }

    .fv #anchor_list a{
        width: clamp(40px, 38%, 80px);
    }
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){

    .fv .fv_img_tab{
        display: none;
    }

    .fv .fv_img_pc{
        display: block;
    }

    .fv .fv_img_pc #fv_link_pc{
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-template-rows: repeat(3, 1fr);
        aspect-ratio: 1 / 0.946;
        width: clamp(380px, 29.1666vw, 560px);
        transform: translateX(-50%);
        position: absolute;
        bottom: clamp(220px, 17.1875vw, 330px);
        left: 50%;
    }

    .fv .fv_img_pc #fv_link_pc > *:last-child,
    .fv .fv_img_pc #fv_link_pc > *:first-child{
        grid-column: 1 / 5;
    }

    .fv .fv_img_pc #fv_link_pc > *{
        overflow: hidden;
        text-indent: -999px;
    }

    .fv .fv_img_pc #fv_link_pc .cb-window{
        cursor: url(../img/icon_aim_l.png) 64 64, pointer;
        -ms-cursor: url(../img/icon_aim_l.png) 64 64, pointer;
    }

    #cboxNext, #cboxPrevious{
        display: contents !important;
    }

    #cboxContent, #cboxLoadedContent{
        background: none;
    }

    #cboxContent{
        margin: 40px 40px 0 !important;
    }

    #cboxClose{
        background: url(../img/icon_close.svg) no-repeat center !important;
        height: 80px;
        width: 80px;
        top: 0;
        transform: translate(50%, -50%);
        transition: none;
    }
	
    /* anchor_list */
	.fv #anchor_list{
        width: clamp(410px, 32.0833vw, 616px);
        bottom: clamp(96px, 7.5vw, 144px);
    }

	
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* how_to_play

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/
#how_to_play{
    background-color: #4d77aa;
    padding-block: clamp(40px, 6.25vw, 80px) clamp(48px, 7.5vw, 96px);
}

#how_to_play #method_img img{
    margin-inline: auto;
}

#how_to_play #method_img + *{
    margin-top: clamp(36px, 5vw, 64px);
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* color_box

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/
#color_box{
    background-color: #fff5e3;
    padding-block: clamp(48px, 7.5vw, 96px);
}

#color_box > * + *{
    margin-top: clamp(80px, 6.875vw, 88px);
}

/* contents_prizes */
#contents_prizes{
    padding-inline: 10px;
}

#contents_prizes img{
    margin-inline: auto;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* official_site

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/
#official_site{
    background: url(../img/bg_pattern01.png) repeat center;
}

#official_site #official_site_inner{
    padding-block: clamp(48px, 7.5vw, 96px);
}

#official_site #official_site_inner #official_site_title img{
    margin-inline: auto;
    max-width: 480px;
    width: 64%;
}

#official_site #official_site_inner #official_site_title + *{
    margin-top: clamp(5px, 0.78125vw, 10px);
}

#official_site #official_site_inner #official_site_btn{
    text-align: center;
}

#official_site #official_site_inner #official_site_btn a{
    display: inline-block;
}

#official_site #official_site_inner #official_site_btn a:hover{
    opacity: 0.9;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* Add Sample Code

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}