@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Imperial+Script&display=swap');

#event_202604 {
    background: #000;
}
#event_202604 .under-header p{
    color:#ab951d;
    font-size:30px;
    margin:20px 0;
}

#event_202604 .ticket {
    background: #ab951d;
}
#event_202604 .ticket .container-inner{
    width:800px;
    padding:10px 0;
}
#event_202604 .ticket h3,
#event_202604 .ticket p a{
    font-size:22px;
    color:#000;
}
#event_202604 section.tc img{
    width:1000px;
    height: auto;
}
#event_202604 .intro{
    background:#414141;
    padding:20px 0;
}
#event_202604 .intro p{
    width:800px;
    font-size:20px;
    text-align: justify;
    margin:0 auto;
}
#event_202604 .main{
    padding:30px 0 60px 0;
    margin:0 auto;
    width:1000px;
}
#event_202604 .main .desc{
    width:920px;
    box-sizing: border-box;
    padding:20px 40px;
    margin:20px auto;
    border:1px solid #FFF;
}
#event_202604 .main .desc p{
    font-size:17px;
    text-align: justify;
}
#event_202604 .main .flow{
    width:800px;
    margin: 80px auto 0 auto;
    padding:50px 50px 20px 50px;
    border: solid 1px #ab951d;    	/* 内側の線になる一本線の枠線をひく*/
	outline: solid 4px #ab951d;    /* 外側の線になる4pxの一本線の枠線をひく*/
	outline-offset: 5px;        /* 内側の線になる一本線の枠線をひく*/
    position:relative;
}
#event_202604 .main .flow h3{
    position:absolute;
    top:-60px;
    left:350px;
    text-align: center;
    background:#ab951d;
    color:#FFF;
    font-size:18px;
    border-radius:50px;
    width:100px;
    height:100px;
    padding-top:24px;
    line-height:1.4;
}
#event_202604 .main .flow li{
    font-size:22px;
    vertical-align: middle;
}
#event_202604 .main .flow li span{
    font-family: "Imperial Script", cursive;
    color:#ab951d;
    font-size:60px;
    display:inline-block;
    width:70px;
    line-height:1;
    vertical-align:middle;
}
#event_202604 .outline{
    background:#414141;
    padding:30px 0;
}
#event_202604 .outline dl{
    width:800px;
    margin:0 auto;
}
#event_202604 .outline dt{
    font-size:17px;
    clear: both;
    float:left;
    width:80px;
    margin:5px 0;
    text-align:justify;
    text-align-last:justify;
}
#event_202604 .outline dd{
    font-size:17px;
    float:right;
    width: calc(800px - 120px);
    margin:5px 0;
}
#event_202604 .outline dd span{
    font-size:14px;
    display:block;
    border:1px solid #FFF;
    padding:3px;
    text-align: center;
    margin-top:20px;
}

/*===============================================
     ●mobile.css  画面の横幅が768pxまで
===============================================*/

@media screen and (max-width: 768px) {
    #event_202604 .under-header p{
        font-size:20px;
        margin:14px 0;
    }
    #event_202604 .ticket .container-inner{
        width:100%;
        padding:10px 18px;
    }
    #event_202604 .ticket h3,
    #event_202604 .ticket p a{
        font-size:16px;
    }
    #event_202604 section.tc img{
        width:100%;
        height: auto;
    }
    #event_202604 .intro{
        padding:20px 18px;
    }
    #event_202604 .intro p{
        width:100%;
        font-size:16px;
    }
    #event_202604 .main{
        padding:30px 0 60px 0;
        margin:0 auto;
        width:100%;
    }
    #event_202604 .main .desc{
        width:90%;
        padding:20px 30px;
    }
    #event_202604 .main .desc p{
        font-size:16px;
    }
    #event_202604 .main .flow{
        width:90%;
        box-sizing:border-box;
        margin: 80px auto 0 auto;
        padding:50px 30px 20px 30px;
    }
    #event_202604 .main .flow h3{
        top:-60px;
        left:40%;
    }
    #event_202604 .main .flow li{
        font-size:17px;
    }
    #event_202604 .main .flow li span{
        font-family: "Imperial Script", cursive;
        color:#ab951d;
        font-size:40px;
        display:inline-block;
        width:50px;
    }
    #event_202604 .outline{
        background:#414141;
        padding:30px 0;
    }
    #event_202604 .outline dl{
        width:90%;
        margin:0 auto;
    }
    #event_202604 .outline dt{
        font-size:16px;
        clear: both;
        float:left;
        width:70px;
        margin:5px 0;
        text-align:justify;
        text-align-last:justify;
    }
    #event_202604 .outline dd{
        font-size:16px;
        float:right;
        width: calc(100% - 100px);
        margin:5px 0;
    }
    #event_202604 .outline a{
        overflow-wrap:break-word;
    }
    #event_202604 .outline dd span{
        font-size:13px;
        display:block;
        border:1px solid #FFF;
        padding:3px 10px 3px 16px;
        text-align: left;
        margin-top:20px;
    }
}