@charset "Shift-JIS";

/*
================================================================================================================
RESET
================================================================================================================
*/
/*
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video{
margin:0;
padding:0;
border:0;
font:inherit;
font-size:100%;
vertical-align:baseline;}
html { scroll-behavior: smooth;}
html{overflow-y:scroll; line-height:1; height:100%;}
ol, ul{list-style:none;}
table{border-collapse:collapse; border-spacing:0;}
caption{
text-align:left;
font-weight:normal;
vertical-align:middle;}
*/
q, blockquote{quotes:none;}
q:before, q:after, blockquote:before, blockquote:after{content:""; content:none;}

a img{border:none;}
a{color:#05117e; text-decoration:none;cursor: pointer;}
a:hover{color:#f00;}
#main_contents a:hover img{opacity: 0.6; transition: .5s opacity;}
article, aside, details, figcaption, figure, hgroup, menu, nav, section, summary{display:block;}

#main_contents img{vertical-align:bottom;}

*, *:before, *:after{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;}

header div a img {max-width:130px!important;}

br.pc{display:block;}
br.sp{display:none;}

@media screen and (max-width:639px){
br.pc{display:none;}
br.sp{display:block;}
}




/*
================================================================================================================
MAIN
================================================================================================================
*/

#wrapper{min-width:300px;margin:0;padding:0;}

#main_contents{
width:100%;
height:100%;
background-image:url(../img/bg.jpg);
background-size:cover;
background-position:center top;
background-repeat:no-repeat;
background-attachment:fixed;}

#main_contents img {width:100%; margin:0; padding:0; }

#main_contents .contents_all {
    width: 96%;
    max-width: 980px;
    min-width: 300px;
    min-height:calc(100vh - 200px);
    margin: 0 auto;
    padding-bottom:1px;
}

#main_contents #type{width:300px;margin:0 auto;}
#main_contents #main_visual{width:100%;margin-bottom:30px;}

#main_contents .frame{
  width:100%;
  position:relative;
  background-image: linear-gradient(#ff4b8f 13%, #ffc549 36%, #a2ff47 58%, #5febff 93%);
  border-radius: 20px;
  margin:0 auto 30px;
  padding: 4px;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 800;
  font-style: normal;
  font-size:22px;
  line-height:1.6;
  color:#05117e;
  text-shadow:3px 3px 0 #FFF, -3px -3px 0 #FFF,
              -3px 3px 0 #FFF, 3px -3px 0 #FFF,
              0px 3px 0 #FFF,  0-3px 0 #FFF,
              -3px 0 0 #FFF, 3px 0 0 #FFF;
}
#main_contents .frame::before,
#main_contents .frame::after{
content: "";
position:absolute;
z-index:2;
width:50px;
height:36px;
background-repeat:no-repeat;
background-size:cover;
}

#main_contents .frame::before{
background-image:url(../img/flame_lt.png);
top:0;
left:0;
}

#main_contents .frame::after{
background-image:url(../img/flame_rb.png);
bottom:0;
right:0;
}
#main_contents .frame .inner{
  width: 100%;
  background:#FFC;
  border:#b686ff 3px solid;
  border-radius: 20px;
  padding: 30px;
  letter-spacing: -0.05em;font-feature-settings: "palt";
  text-align:center;
}
#main_contents .frame .inner section{
  width: 100%;
  background-image:url(../img/line.png);
  background-size:auto 40px;
  background-position:center bottom;
  background-repeat: no-repeat;
  padding:20px 0 60px;
}

#main_contents .frame img.open_text{height:40px;width:auto;}
#main_contents .frame .event_title{width:300px;position:absolute;z-index:2;top: -20px;left: 50%;transform: translateX(-50%);}
#main_contents .frame .inner .sub_title{width: 100%;max-width:800px;margin:0 auto 20px;}
#main_contents .frame .inner .bnr_img{width: 100%;max-width:750px;margin:0 auto;}
#main_contents .frame .inner .check{color:#fd0000;}
#main_contents .frame .inner .link_bnr{max-width:750px;margin:0 auto;cursor:pointer;text-align:center;}
#main_contents .frame .inner #event_1_visual{max-width:770px;margin:0 auto;padding:15px 0;}
#main_contents .frame .inner #anima_senkyo{max-width:750px;margin:0 auto;padding:20px 0 15px;}
a.quest{color:#00baff;text-decoration: underline;text-decoration-color:#00baff;}

#main_contents .frame .inner .regular_bnr{text-shadow: none;}


@media screen and (max-width:900px){
#main_contents .frame{font-size:18px;}
#main_contents .frame img.open_text{height:36px;width:auto;}

#main_contents .frame .inner .regular_bnr .period ul li{justify-content: start;}
#main_contents .frame .inner .regular_bnr .period ul.no_camp li{justify-content: center;}
#main_contents .frame .inner .regular_bnr .period ul li .title_img {margin-right:0;}
}
@media screen and (max-width:767px){
#main_contents .frame{font-size:16px;}
#main_contents .frame .inner{padding: 20px 10px;}
#main_contents .frame img.open_text{height:28px;width:auto;}
}
@media screen and (max-width:639px){
#main_contents #type{width:240px;}
#main_contents .frame{font-size:14px;}
#main_contents .frame::before,
#main_contents .frame::after{width:40px;height:29px;}
#main_contents .frame .event_title{width:300px;}
#main_contents .frame img.open_text{height:24px;width:auto;}
#main_contents .frame .inner section{background-size:100% auto; padding:20px 0 30px;}

#main_contents .frame .inner .regular_bnr .period ul li .title_img{display: flex;}
#main_contents .frame .inner .regular_bnr .period ul li .text {width: 56%;}
}


@media screen and (max-width:480px){
#main_contents .contents_all {width: 98%;}
#main_contents .frame {border-radius: 16px;padding: 3px;}
#main_contents .frame .inner{border-radius: 16px;padding: 20px 4px;}
}
@media screen and (max-width:320px){
#main_contents .frame{font-size:11px;}
#main_contents .frame .inner{padding: 16px 6px;}
#main_contents .frame .event_title{width:240px;}
#main_contents .frame img.open_text{height:20px;width:auto;}
}

/*
================================================================================================================
コナステメダル
================================================================================================================
*/
#main_contents .frame .inner .notice{font-family: "M PLUS 1p", sans-serif;font-weight: 700;font-style: normal;font-size:16px;}

dl#knst_record{
width:98%;max-width:750px;max-height:100px;overflow-y: scroll;border: 1px solid#DDD;
margin:10px auto 20px;padding:10px;
font-size:14px;font-weight:nomal;text-shadow: none;color:#4c39bb;background-color:#FFF;
overflow-y: scroll;}

dl#knst_record::-webkit-scrollbar {
  width: 10px;
}

dl#knst_record::-webkit-scrollbar-track {
  background-color: #fff;
}

dl#knst_record::-webkit-scrollbar-thumb {
  background-color: #4c39bb;
  border-radius: 8px;
}
dl#knst_record .news-item {display: flex;justify-content: start;padding: 2px 0;}
dl#knst_record .news-item dt,
dl#knst_record .news-item dd{text-align:left;}
dl#knst_record .news-item dt{width:110px;padding-right:10px;}
dl#knst_record .news-item dd{width:calc(100% - 110px);margin:0;}

@media screen and (max-width:639px){
dl#knst_record{padding:5px;}
dl#knst_record .news-item dt,
dl#knst_record .news-item dd{font-size:87.5%;}
dl#knst_record .news-item dt{width:90px;padding-right:5px;}
dl#knst_record .news-item dd{width:calc(100% - 95px);}

dl#knst_record::-webkit-scrollbar {width: 8px;}

#main_contents .frame .inner .notice{font-size:10px;}
}

@media screen and (max-width:320px){
#main_contents .frame .inner .notice{font-size:9px;}
}

/*
================================================================================================================
アプリビューワー
================================================================================================================
*/
body#app_view{margin:0;}
body#app_view #main_contents {height:auto;}
body#app_view #main_contents .contents_all {min-height: initial;}
body#app_view #main_contents .frame .inner .anima_senkyo2{max-width:640px;margin:0 auto;padding:20px 0 15px;}
/*
================================================================================================================
トップへ戻る
================================================================================================================
*/
#page-top {
position: fixed;
bottom: 50px;
right: 10px;
font-size: 10px;
z-index:9999;
}
#page-top span {
font-size: 22px;
}
#page-top a {
background-color: rgba(255,180,40,0.8);
text-decoration: none;
color: #fff;
width: 50px;
padding: 10px 5px 6px 5px;
text-align: center;
line-height: 10px;
display: block;
border-radius: 26px;
-webkit-border-radius: 26px;
-moz-border-radius: 26px;
}
#page-top a:hover {
text-decoration: none;
background-color: rgba(255,240,140,1.0);
color: #fa0;
}

@media screen and (max-width:799px) {
#page-top {
bottom: 10px;
right: 10px;
font-size: 10px;
}
#page-top a {
width: 50px;
padding: 10px 2px 6px 2px;
text-align: center;
line-height: 10px;
display: block;
border-radius: 26px;
-webkit-border-radius: 26px;
-moz-border-radius: 26px;
}
}