@charset "UTF-8";
/* CSS Document */


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

/* rule
--------------------------------------------*/
#rule{
position:relative;
padding-top: 100px;
box-sizing: border-box;
}

#rule .section_wrap{
width: 90%;
position: relative;
margin: 0 auto 180px;
}

#rule .section_wrap::before{
content: "";
position: absolute;
top:70px;
right: -5%;
width: 58%;
height: 5px;
background: #ea6486;
clip-path: polygon(1% 0, 100% 0, 99% 100%, 0% 100%);
}

#rule .section_wrap::after{
content: "";
position: absolute;
top: -20px;
left: -5%;
width: 58%;
height: 5px;
background: #eb55a5;
clip-path: polygon(1% 0, 100% 0, 99% 100%, 0% 100%);
}

#rule .hed_tit::before{
content: "姫CON 参加規約 ";
position: absolute;
top: 0;
left:50%;
color: #69e6dc;
margin-left:-133px;
z-index: -1;
}

#rule .hed_tit::after{
content: "姫CON 参加規約";
position: absolute;
top: 0;
left:50%;
color: #eb55a5;
margin-left:-129px;
z-index: -2;
}

#rule .section_wrap .date_txt{
width: 84%;
margin: 0 auto 60px;
}

#rule .date_txt{
text-align: right;
margin: 0 0 30px;
font-size: .8rem;
}

#rule .rule_wrap{
width: 90%;
position: relative;
margin: 0 auto 60px;
}

#rule .rule_wrap h3{
border: 1px solid #eb55a5;
padding:10px 15px;
box-sizing: border-box;
margin: 0 0 30px;
line-height: 1;
color:rgba(0,0,0,.6);
background: url("../images/com/bg.png") center center no-repeat;
background-size: cover;
}

#rule .rule_wrap p{
line-height: 1.6;
margin: 0 0 30px;
}

#rule .rule_wrap .list01{
position: relative;
margin:0;
padding:0;
}

#rule .rule_wrap .list01 li{
position: relative;
box-sizing: border-box;
margin: 0 0 15px;
padding: 10px 10px 10px 20px;
}

#rule .rule_wrap .list01 li::before{
content: "●";
position: absolute;
top: 17px;
left: 5px;
font-size:.6rem;
line-height: 1;
color: #121212;
}

#rule .rule_wrap .list01 li.waku{
border:2px solid #eb55a5;
background: #fbf3f7;
}

#rule .rule_wrap .rule_img{
width: 60%;
margin: 60px auto 0;
}

#rule .rule_wrap h4{
font-size: 1.4rem;
font-weight: 900;
line-height: 1;
margin: 30px 0 20px;
}


#rule .rule_wrap h5{
font-size: 1.2rem;
font-weight: 700;
line-height: 1;
color: #eb55a5;
margin: 30px 0 20px;
}

#rule .rule_wrap .list02_1,
#rule .rule_wrap .list02_2{
position: relative;
margin:0;
padding:0;
}

#rule .rule_wrap .list02_1 li,
#rule .rule_wrap .list02_2 li{
position: relative;
padding-left: 20px;
box-sizing: border-box;
margin: 30px 0 30px;
}

#rule .rule_wrap .list02_1 li::before{
content: "○";
position: absolute;
top: 8px;
left: 0;
font-weight: 800;
font-size:.9rem;
line-height: 1;
color: #eb55a5;
}

#rule .rule_wrap .list02_2 li::before{
content: "×";
position: absolute;
top: 7px;
left: 0;
font-weight: 800;
font-size:.9rem;
line-height: 1;
color: #eb55a5;
}

#rule .rule_wrap .list03{
position: relative;
margin:60px 0 0;
padding:0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#rule .rule_wrap .list03 li{
width: 48%;
position: relative;
margin-bottom: 4%;
}

#rule .rule_wrap .list03 li p{
margin-top: 10px;
font-size: .8rem;
}

#rule .bnr_img02{
width: 70%;
margin: 0 auto 60px;
}

}
/*sp*/
@media only screen and (max-width: 767px) {

/* rule
--------------------------------------------*/
#rule{
position:relative;
padding-top: 60px;
box-sizing: border-box;
}

#rule .section_wrap{
width: 90%;
position: relative;
margin: 0 auto 60px;
}

#rule .section_wrap::before{
content: "";
position: absolute;
top:70px;
right: -5%;
width: 58%;
height: 5px;
background: #ea6486;
clip-path: polygon(1% 0, 100% 0, 99% 100%, 0% 100%);
}

#rule .section_wrap::after{
content: "";
position: absolute;
top: -20px;
left: -5%;
width: 58%;
height: 5px;
background: #eb55a5;
clip-path: polygon(1% 0, 100% 0, 99% 100%, 0% 100%);
}

#rule .hed_tit::before{
content: "姫CON 参加規約 ";
position: absolute;
top: 0;
left:50%;
color: #69e6dc;
margin-left:-86px;
z-index: -1;
}

#rule .hed_tit::after{
content: "姫CON 参加規約 ";
position: absolute;
top: 0;
left:50%;
color: #eb55a5;
margin-left:-82px;
z-index: -2;
}

#rule .section_wrap .date_txt{
width: 100%;
margin: 0 auto 60px;
}

#rule .date_txt{
text-align: right;
margin: 0 0 30px;
font-size: .8rem;
}

#rule .rule_wrap{
width: 90%;
position: relative;
margin: 0 auto 60px;
font-size: .9rem;
}

#rule .rule_wrap h3{
border: 1px solid #eb55a5;
padding:10px 15px;
box-sizing: border-box;
margin: 0 0 20px;
line-height: 1;
color:rgba(0,0,0,.6);
background: url("../images/com/bg.png") center center no-repeat;
background-size: cover;
}

#rule .rule_wrap p{

line-height: 1.6;
margin: 0 0 30px;
}

#rule .rule_wrap .list01{
position: relative;
margin:0;
padding:0;
}

#rule .rule_wrap .list01 li{
position: relative;
padding:10px 10px 10px 20px;
box-sizing: border-box;
margin: 0 0 15px;
}

#rule .rule_wrap .list01 li::before{
content: "●";
position: absolute;
top: 17px;
left: 5px;
font-size:.6rem;
line-height: 1;
color: #121212;
}

#rule .rule_wrap .rule_img{
width: 80%;
margin: 40px auto 0;
}

#rule .rule_wrap h4{
font-size: 1.2rem;
font-weight: 900;
line-height: 1;
margin: 20px 0 10px;
}


#rule .rule_wrap h5{
font-size: 1rem;
font-weight: 700;
line-height: 1;
color: #eb55a5;
margin: 20px 0 10px;
}

#rule .rule_wrap .list02_1,
#rule .rule_wrap .list02_2{
position: relative;
margin:0;
padding:0;
}

#rule .rule_wrap .list02_1 li,
#rule .rule_wrap .list02_2 li{
position: relative;
padding-left: 20px;
box-sizing: border-box;
margin: 30px 0 30px;
}

#rule .rule_wrap .list02_1 li::before{
content: "○";
position: absolute;
top: 8px;
left: 0;
font-weight: 800;
font-size:.9rem;
line-height: 1;
color: #eb55a5;
}

#rule .rule_wrap .list02_2 li::before{
content: "×";
position: absolute;
top: 7px;
left: 0;
font-weight: 800;
font-size:.9rem;
line-height: 1;
color: #eb55a5;
}

#rule .rule_wrap .list01 li.waku{
border:2px solid #eb55a5;
background: #fbf3f7;
}

#rule .rule_wrap .list03{
position: relative;
margin:60px 0 0;
padding:0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#rule .rule_wrap .list03 li{
width: 48%;
position: relative;
margin-bottom: 4%;
}

#rule .rule_wrap .list03 li p{
margin-top: 10px;
font-size: .8rem;
}

#rule .bnr_img02{
width: 100%;
margin: 0 auto 30px;
}

}