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


/*!Style
-------------------------------------*/
*{box-sizing:border-box}
html{font-size: 16px;color:#333;scroll-behavior: smooth;height:100%;}
body{margin:0;padding:0;font-family: "Kosugi Maru", sans-serif;font-weight: 400;font-style: normal;height:100%;}
img{vertical-align:bottom;}
ul{list-style: none;}
a{text-decoration:none;color:#1eb981;}
a:hover{text-decoration:none;}
a:hover img{opacity:0.7;filter:alpha(opacity=70);-ms-filter:"alpha(opacity=70)"}
h1,h2{margin: 0;padding:0;}

.scroll-in,.scroll-in2,.zoom-in,.fade-in{opacity: 0;}
.scroll_start{animation: slideinTop 0.5s forwards 0.1s;}
.scroll_start2{animation: slideinBottom 0.5s forwards 0.1s;}
.zoom_start{animation: zoomIn 0.5s cubic-bezier(0.25, 1, 0.5, 1) forwards 0.5s;opacity: 0;}
.fade_start{animation: fadeIn 3s cubic-bezier(0.33, 1, 0.68, 1) forwards 1s;opacity: 0;}
.poyopoyo {animation: poyopoyo 2s ease-out infinite;opacity: 1;}
.fuwafuwa {animation: fuwafuwa 1.8s ease-in-out infinite alternate-reverse;}
.important{margin: 2em auto 3em;width: 90%;text-align: left;color: #ff0000;padding: 1em;border: 3px dotted #ff0000;}
.red{color:#ff0000;}

.pc{display: block !important}
.sp{display: none !important}

@media screen and (max-width: 767px) {
.pc{display: none !important}
.sp{display: block !important}
}

/*!stage
-------------------------------------*/
#stage{margin:0 auto;padding:0;width:100%;text-align:center;background:url("img/bg.png")top center no-repeat;background-size: cover;background-attachment: fixed;position: relative;z-index: 2;}
#stage h1{position: fixed;top: 0.5em;left: 0.5em;}

/*!contents
-------------------------------------*/
#contents{margin: 0 auto;position: relative;background: #fff;box-shadow: 0 0 10px #999;width: 100%;max-width: 560px;}

@media screen and (max-width: 767px) {
#contents{max-width: 100%;}
}
	
/*!header
-------------------------------------*/
header{background: #fff;position: relative;}
header img{width:100%;}
header h2{margin: auto;width:80%;position: absolute;bottom:-1.4em;left: 0;right: 0;z-index: 1;}
header #day{margin: auto;width:60%;max-width: 281px;position: absolute;top:1em;left: 1em;}
header #logo_bg{margin: auto;width:100%;max-width: 767px;position: absolute;bottom:-1px;}

/*!nav
-------------------------------------*/
.menu-content {position: fixed;top: 50%;bottom: 50%;margin: auto; right: 15%;border: 3px dashed #1eb981;background-color: #fff;border-radius: 100px;padding: 3em 2em;height: fit-content;z-index: -1;}
nav ul{margin: 0;padding: 0;letter-spacing: 0.1px;}
nav ul li a{margin: 0;padding: 1em 2em 1em 0.5em;text-align: left;display: block;border-bottom:1px dashed #1eb981;position: relative;}
.menu-content ul li a::before {content: "";width: 7px;height: 7px;border-top: solid 2px #1eb981;border-right: solid 2px #1eb981;transform: rotate(45deg);position: absolute;top: 0;bottom: 0;right: 0.5em;margin: auto;}
nav ul li i{margin-right: 5px;color: #ff9100;}

nav ul li:last-child{margin: 0.5em 0 0;}
nav ul li:last-child a{padding: 0.8em 2em 0.8em 0.5em;background: #ff9100;border-radius: 100px;color: #fff;border-bottom:none;}
nav ul li:last-child i{color: #fff;}
nav ul li:last-child a::before {content: "";width: 7px;height: 7px;border-top: solid 2px #fff;border-right: solid 2px #fff;transform: rotate(45deg);position: absolute;top: 0;bottom: 0;right: 0.5em;margin: auto;}
nav ul li:nth-last-child(2) a{border-bottom:none;}

@media screen and (max-width: 767px) {
.menu {width: 100%;height: 100%;position: fixed;top: 0;left: 100%;z-index: 80;background-color: #fff;transition: all 0.5s;}
.menu-btn {position: fixed;top: 10px;right: 10px;display: flex;height: 60px;width: 60px;justify-content: center;align-items: center;z-index: 90;background-color: #1eb981;border-radius: 100%;}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {content: '';display: block;height: 3px;width: 25px;border-radius: 3px;background-color: #ffffff;position: absolute;}
.menu-btn span:before {bottom: 8px;}
.menu-btn span:after {top: 8px;}
#menu-btn-check:checked ~ .menu-btn span {background-color: rgba(255, 255, 255, 0);}
#menu-btn-check:checked ~ .menu-btn span::before {bottom: 0;transform: rotate(45deg);}
#menu-btn-check:checked ~ .menu-btn span::after {top: 0;transform: rotate(-45deg);}
#menu-btn-check {display: none;}
.menu-content ul li {list-style: none;}
.menu-content ul li a {width: 100%;box-sizing: border-box;text-decoration: none;position: relative;z-index: 100;}
.menu-content {position: absolute;right: 0;left: 0;margin: auto;width: fit-content;}
#menu-btn-check:checked ~ .menu {left: 0;}
}
	
	
/*!main
-------------------------------------*/
main{margin: 0;padding: 5em 0;letter-spacing: 1px;font-family: "Noto Sans JP", sans-serif;font-style: normal;}

/*!event
-------------------------------------*/
#event{}
#event h3{color:#1eb981;border: 2px dashed #1eb981;display: inline-block;padding: 0.5em 0.8em;border-radius: 10px;font-size: 0.9em;font-family: "Kosugi Maru", sans-serif;font-weight: 500;font-style: normal;}
#event h3 span{display: block;font-size: 0.6em;margin: 0.2em 0 0;font-weight: bold;letter-spacing: 3px;}
#event section{margin-bottom: 4em;}
#event h4{margin: 1em 0 0;background: #1eb981;display: inline-block;padding: 0.3em 1em;color: #fff;}
#event img{width:80%;max-width: 509px;}
#event .big{font-size: 1.6em;display: block;margin-top: 1.4em;}
#event .bigs{font-size: 1.2em;}
#event a.btn{margin: 0;padding: 1em 0;width: 80%;background: #ff9100;border-radius: 100px;color: #fff;border-bottom: none;display: inline-block;text-align: center;}
#event .btn_img{width: auto;margin: 0;}
#event .sousyoku{font-size: 0.8em;color: #999;}
#event section.text{margin: auto;width: 90%;background: #f6f6f6;padding: 1em 0 2em;border-radius: 30px;}
#event section.text p{margin: auto;width: 90%;text-align: left;line-height: 1.6em;font-size: 0.8em;}

/*!news
-------------------------------------*/
#news{margin: 4em 0 0;padding: 1em 2em 2em;background: #ffecd6;}
#news h3{color: #1eb981;letter-spacing: 10px;}
#news ul{margin: 0;padding: 0;text-align: left;font-size: 0.8em;}
#news ul li{padding: 1em 0.5em;border-bottom: 5px dotted #fff;}
#news ul li:last-child{border-bottom: none;}
#news ul li span{margin-right: 1em;}
#news section{padding: 0;border-radius: 50px;line-height: 1.4em;}

@media screen and (max-width: 767px) {
#news ul li span{margin-right: 0;display: block;}
}

/*!join
-------------------------------------*/
#join{margin: 4em 0 0;padding: 0;}
#join h3{color:#1eb981;border: 2px dashed #1eb981;display: inline-block;padding: 0.5em 0.8em;border-radius: 10px;font-size: 0.9em;font-family: "Kosugi Maru", sans-serif;font-weight: 500;font-style: normal;}
#join h3 span{display: block;font-size: 0.6em;margin: 0.2em 0 0;font-weight: bold;letter-spacing: 3px;}
#join h4{margin: 0;padding: 0.3em 1em;border: 3px solid #b2f6dd;background: #1eb981;display: inline-block;border-radius: 100px;color: #fff;}
#join div{margin: 1em 3em 3em;text-align: left;}
#join div.circle h4{margin: 0;padding: 0.3em 1em;border: 3px solid #ffecd6;background: #ff8a00;display: inline-block;border-radius: 100px;color: #fff;}
#join div.circle p{position: relative;margin: 3em 0;border-bottom: 3px dashed #ffecd6;padding-bottom: 1em;}
#join div.circle p:last-child{border-bottom: none;}
#join div p span{position: absolute;font-size: 5em;color: #ffecd6;z-index: -1;font-weight: bold;top: -0.8em;}
#join strong{color:#ff6600;text-decoration: underline;}
#join div.text{margin: auto;width: 90%;background: #f6f6f6;padding: 2em;border-radius: 30px;font-size: 0.9em;}
#join div.text img{margin-bottom: 1em;width:100%;max-width: 545px;}

#join div.circle_join{margin: 3em 0 0;padding: 0;}
#join div.circle_join img{width:100%;}
#join div.circle_join h4{margin: 0;padding: 0;border: none;background: none;}
#join div.circle_join ul{margin: 0 auto;padding: 0;width:90%;}
#join div.circle_join ul li{margin: 1em 0 1em;padding: 1em;font-size: 0.9em;}
#join div.circle_join h5{font-size: 1.2em;color: #ff9100;margin: 0;border-bottom: 1px solid;padding-bottom: 0.5em;}
#join div.circle_join ul li a.btn{margin: 0;padding: 1em 0;width: 80%;background: #1eb981;border-radius: 100px;color: #fff;border-bottom: none;display: inline-block;text-align: center;}

.shine-button {margin: 1.5em auto !important;text-align: center !important;display: block;position: relative;overflow:hidden;}
.shine-button::before {content: "";position: absolute;display: block;background: linear-gradient(to right,rgba(255,255,255,0), rgba(255,255,255,0.9));width: 50px;height: 50px;top: -60px;left: -60px;animation-name:shine-run;animation-delay:0s;animation-duration: 3s;animation-timing-function: ease-in;animation-iteration-count: infinite;}

#join div.text2{margin: auto;width: 100%;background: #f6f6f6;padding: 2em;font-size: 0.9em;}

#join div.circle_join ul li.arrow{margin: 0;padding: 0;text-align: center;font-size: 3em;}
#join div.circle_join ul li .off-button{margin: 0 auto;padding: 1em 0;width: 80%;background: #ccc;border-radius: 100px;color: #fff;border-bottom: none;text-align: center;}

#join .circle_sample{width: 50%;max-width: 400px;margin: auto;display: block;}

#join .fukidasi{position: relative;padding: 1rem 1.5rem;color: #1eb981;font-size: 1.2em;margin: 2em auto 0;display: block;text-align: center;width: fit-content;}
#join .fukidasi::before,
#join .fukidasi::after {position: absolute;top: 0.8rem;height: 1.8rem;content: '';}
#join .fukidasi::before {border-left: solid 3px;left: 0;transform: rotate(-30deg);}
#join .fukidasi::after {border-right: solid 3px;right: 0;transform: rotate(30deg);}
#join a.btn_x{margin: auto;padding: 1.4em 0;width: 80%;font-size: 1.2em;background: #1eb981;border-radius: 100px;color: #fff;border-bottom: none;display: block;text-align: center;}
#join .btn_img{width: auto !important;margin: auto;display: block;}

#join a.btn_red{margin: 0;padding: 1em 0;width: 80%;background: #ff0000;border-radius: 100px;color: #fff;border-bottom: none;display: inline-block;text-align: center;}

/*!anthology
-------------------------------------*/
#anthology{margin: 0;padding: 2em 0;background: #fffaeb;}
#anthology h3{color:#1eb981;border: 2px dashed #1eb981;display: inline-block;padding: 0.5em 0.8em;border-radius: 10px;font-size: 0.9em;font-family: "Kosugi Maru", sans-serif;font-weight: 500;font-style: normal;}
#anthology h3 span{display: block;font-size: 0.6em;margin: 0.2em 0 0;font-weight: bold;letter-spacing: 3px;}

#anthology ul{margin: 0 auto;padding: 0;width:90%;}
#anthology ul li{margin: 1em 0 1em;padding: 1em;font-size: 0.9em;text-align: left;}
#anthology h5{font-size: 1.2em;color: #1eb981;margin: 0;border-bottom: 1px solid;padding-bottom: 0.5em;}
#anthology ul li a.btn{margin: 0;padding: 1em 0;width: 80%;background: #1eb981;border-radius: 100px;color: #fff;border-bottom: none;display: inline-block;text-align: center;}
#anthology strong {background: linear-gradient(transparent 60%, #fff 60%);font-size: 1.2em;color: #ff8a00;}
#anthology .waku{margin: 1em 0;padding: 1.4em;background: #fff;}
#anthology a.btn{margin: 0;padding: 1em 0;width: 80%;background: #ff9100;border-radius: 100px;color: #fff;border-bottom: none;display: inline-block;text-align: center;}
#anthology .btn_img{width: auto;margin: -2em auto 0;}

/*!plan
-------------------------------------*/
#plan{margin: 4em 0 0;padding: 1em 0 2em;}
#plan h3{color:#1eb981;border: 2px dashed #1eb981;display: inline-block;padding: 0.5em 0.8em;border-radius: 10px;font-size: 0.9em;font-family: "Kosugi Maru", sans-serif;font-weight: 500;font-style: normal;}
#plan h3 span{display: block;font-size: 0.6em;margin: 0.2em 0 0;font-weight: bold;letter-spacing: 3px;}

/*!circle_list
-------------------------------------*/
#circle_list{margin: 4em 0 0;padding: 1em 0 2em;background: #f6f6f6;}
#circle_list h3{color:#1eb981;border: 2px dashed #1eb981;display: inline-block;padding: 0.5em 0.8em;border-radius: 10px;font-size: 0.9em;font-family: "Kosugi Maru", sans-serif;font-weight: 500;font-style: normal;}
#circle_list h3 span{display: block;font-size: 0.6em;margin: 0.2em 0 0;font-weight: bold;letter-spacing: 3px;}
#circle_list ul{margin: 1em auto 0;padding:0;text-align: center;width:90%;display: flex;justify-content: space-between;}
#circle_list ul li{padding: 0.8em 0.5em;font-size: 0.9em;}
#circle_list ul li:nth-child(1){background: #ff9100;color:#fff;font-weight: bold;flex:2;}
#circle_list ul li:nth-child(2){background: #fff;flex:4.5;text-align: left}
#circle_list ul li:nth-child(3){background: #fff;flex:2;}
#circle_list ul li:nth-child(4){background: #fff;flex:1.5;}
#circle_list i{font-size: 1.4em;}

@media screen and (max-width: 767px) {
#circle_list ul{flex-flow: row wrap}
#circle_list ul li:nth-child(1){width: 25%;flex: none;}
#circle_list ul li:nth-child(2){width: 75%;flex: none;background: #ffecd6;}
#circle_list ul li:nth-child(3){background: #fff;flex:5;}
#circle_list ul li:nth-child(4){background: #fff;flex:5;}
}


/*!contact
-------------------------------------*/
#contact{margin: 2em 0 0;padding: 1em 0 2em;}
#contact h3{color:#1eb981;border: 2px dashed #1eb981;display: inline-block;padding: 0.5em 0.8em;border-radius: 10px;font-size: 0.9em;font-family: "Kosugi Maru", sans-serif;font-weight: 500;font-style: normal;}
#contact h3 span{display: block;font-size: 0.6em;margin: 0.2em 0 0;font-weight: bold;letter-spacing: 3px;}
#contact a.btn{margin: 0;padding: 1em 0;width: 80%;background: #ff9100;border-radius: 100px;color: #fff;border-bottom: none;display: inline-block;text-align: center;}
#contact p.text{font-size: 0.9em;margin: auto;width: 80%;text-align: left;}
#contact strong{color:#ff6600;text-decoration: underline;}


/*!print
-------------------------------------*/
#print{margin: 2em 0 0;padding: 0 2em;}
#print h3{color:#1eb981;border: 2px dashed #1eb981;display: inline-block;padding: 0.5em 0.8em;border-radius: 10px;font-size: 0.9em;font-family: "Kosugi Maru", sans-serif;font-weight: 500;font-style: normal;}
#print h3 span{display: block;font-size: 0.6em;margin: 0.2em 0 0;font-weight: bold;letter-spacing: 3px;}
#print ul{margin:0;padding: 0;display: flex;flex-flow: row wrap;justify-content: space-around;}
#print ul li{margin:1em 0 0;padding: 1em 1em 0.8em;border-radius: 30px;width: 48%;}
#print ul li a.btn{margin: 0.5em 0 0;padding: 0.2em 1em 0.3em;border-radius: 100px;color: #fff;font-size: 0.6em;background: #ff9100;border:3px solid #fff;display: inline-block;}
#print ul li img{width: 100%;max-width: 200px;height: auto;}

@media screen and (max-width: 767px) {
#print ul li{width: 100%;}
}

/*!footer
-------------------------------------*/
footer{margin: 0;padding:0 0 0.2em;background: #1eb981;font-size: 0.8em;color:#fff;line-height: 1.2em;}
footer img{width:80%;}
footer div.text{padding: 1em 2em;background: #2bd195;text-align: left;}
footer p.copy{}

/*!委託参加ページ
-------------------------------------*/
header#itakuh{padding: 1em;}
header#itakuh img{width:60% !important;}
header#itakuh h1{position: static;}

main#itakum{padding: 0;}
main#itakum #join{margin: 1em 0;}


/*!アニメーション
-------------------------------------*/

/*上から下*/
@keyframes slideinTop{
  0% {transform: translateY(-50px);opacity: 0;}
  100% {transform: translateY(0);opacity: 1;}
}

/*下から上*/
@keyframes slideinBottom{
  0% {transform: translateY(50px);opacity: 0;}
  100% {transform: translateY(0);opacity: 1;}
}

/*ズームイン*/
@keyframes zoomIn {
  0% {transform: scale(0.8);opacity: 0;}
  100% {opacity: 1;transform: scale(1);}
}

/*フェードイン*/
@keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

/*ぽよぽよ収縮する*/
@keyframes poyopoyo {
  0%, 40%, 60%, 80% {
    transform: scale(1.0);
  }
  50%, 70% {
    transform: scale(0.95);
  }
}

@keyframes fuwafuwa {
  0% {
    transform: translateY(10%);
  }
  100% {
    transform: translateY(0%);
  }
}

/*光るボタン*/
@keyframes shine-run {
0% {transform: scale(0) rotate(50deg);opacity: 0;}
40% {transform: scale(1) rotate(50deg);opacity: 1;}
100% {transform: scale(250) rotate(50deg);opacity: 0;}
}