@charset "utf-8";

/* common
------------------------------------------------------*/
h2#pttl + h2.ttl {
	margin-bottom: 30px;
	background-color: #4182c3;
}


/* header
------------------------------------------------------*/
h1.ttl_site{
	width:100%;
	max-width:660px;
	margin:30px auto;
}
h1.ttl_site a{
	display:block;
	padding-top:calc(660px/988*92);
	background:url(../../event/img/ttl_site.webp) no-repeat center top / 100% auto ;
}
h1.ttl_site a:after{
	width:240px;
	content:"";
	position:absolute;
	top:30px;
	right:30px;
	display:block;
	padding-top:calc(240px/320*237);
	background:url(../../event/img/outline.webp) no-repeat center center / 100% auto ;
}
@media screen and (max-width:1380px){
	h1.ttl_site{
		position:relative;
		display:block;
		margin-bottom:0;
		padding-bottom:calc(240px/320*237 + 5px);
		background:url(../../event/img/outline.webp) no-repeat center bottom / 240px auto ;
	}
	h1.ttl_site a:after{
		display:none;
	}
}
@media screen and (max-width:calc(720px/0.9)){
	h1.ttl_site{
		width:calc(100% - 120px);
		max-width:none;
		margin:0 60px;
	}
}
@media screen and (max-width: 540px) {
	div#header {
		padding-top: 30px;
	}
	h1.ttl_site {
		width: calc(100% - 60px);
		margin: 0 auto;
	}
	h1.ttl_site a {
		margin-bottom:15px;
		padding-top: calc(100%/988*92 - 60px/988*92);
	}
}
@media screen and (max-width: 510px) {
	div#header {
		padding-top: 30px;
	}
}
@media screen and (max-width: 420px) {
	h1.ttl_site {
		width: calc(100% - 30px);
	}
	h1.ttl_site a {
		padding-top: calc(100%/988*92 - 30px/988*92);
	}
}

/* index
------------------------------------------------------*/
#event_index p.outline strong{
	color:#c80000;
	font-weight:bold;
}
ul#event_list{
	width:100%;
	max-width:1024px;
	margin:0 auto;
}
ul#event_list li{
	clear:both;
	width:100%;
	padding:30px 0;
	border-top:10px #e6e6e6 solid;
}
div.info{
	width:calc(100% - 280px - 30px);
	float:right;
}
div.photo{
	width:280px;
	max-height;280px;
	float:left;
	border:1px #ccc solid;
	overflow:hidden;
}
div.info h2.ttl{
	margin-bottom:15px;
	padding:0;
	font-size:24px;
	text-align:left;
}
li.c1 h2.ttl{color:#ed7980;} /*momo*/
li.c2 h2.ttl{color:#62c0b4;} /*kusa*/
li.c3 h2.ttl{color:#51a7dd;} /*mizu*/

div.info h2.ttl + p{
	margin-bottom:15px;
}

table.spec{
	width:100%;
	margin-bottom:5px;
	border-left:1px #ccc solid;
	border-top:1px #ccc solid;
}
table.spec th,
table.spec td{
	padding:5px 10px;
	font-size:14px;
	border-bottom:1px #ccc solid;
}
li.c1 table.spec th{background-color:#fcebec;} /*momo*/
li.c2 table.spec th{background-color:#e9f6f5;} /*kusa*/
li.c3 table.spec th{background-color:#dbeeff;} /*mizu*/
table.spec td{
	border-right:1px #ccc solid;
}
ul.btns{
	margin-top:15px;
}
ul#event_list li ul.btns li{
	width:280px;
	max-width:calc(50% - 7.5px);
	margin-right:15px;
	padding:0;
	border-top:none;
}
ul#event_list li ul.btns li:nth-child(2){
	margin-right:0;
}
ul.btns li a.btn {
	width:100%;
	color:#fff;
	border:none;
}
li.c1 a.btn {background-color:#ed7980;} /*momo*/
li.c2 a.btn {background-color:#62c0b4;} /*kusa*/
li.c3 a.btn {background-color:#51a7dd;} /*mizu*/

ul.btns li a.btn:hover{background-color:orange;}

@media screen and (max-width:960px){
	div.photo{
		width:280px;
		margin:0 auto 15px;
		float:none;
	}
	div.info{
		width:100%;
		float:none;
	}
}



/* form
------------------------------------------------------*/
.form div#contents h2#pttl +  h2.ttl + p.outline {
	margin-bottom: calc(5.11% + 45px);
	padding-bottom: calc(5.11% + 45px);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-image: url(../../inquiry/img/flow1.png);
	background-size: 100% auto;
}
.confirm.form div#contents h2#pttl +  h2.ttl + p.outline {
	background-image:url(../../inquiry/img/flow2.png);
}
.thanks.form div#contents h2#pttl +  h2.ttl + p.outline {
	background-image:url(../../inquiry/img/flow3.png);
}
@media screen and (max-width:660px){
	.form div#contents h2#pttl +  h2.ttl + p.outline {
		padding-bottom:calc(12.438% + 30px);
		background-image: url(../../inquiry/img/flow_sp1.png);
	}
	.confirm.form div#contents h2#pttl +  h2.ttl + p.outline{
		background-image:url(../../inquiry/img/flow_sp2.png);
	}
	.thanks.form div#contents h2#pttl +  h2.ttl + p.outline{
		background-image:url(../../inquiry/img/flow_sp3.png);
	}
}
.form dl dt:nth-child(2),
.form dl dd:nth-child(3) {
	padding-top:30px;
	border-top: 10px #e6e6e6 solid;
}
.form div#contents dt:nth-child(2)::before{
	top:30px;
}
.form div#contents dt::before          {background-color: #1968b7;}
.form div#contents dt.optionary::before{background-color: #aaaaaa;}
p.thanks{
	margin-bottom:90px;
	color:red;
	font-size:20px;
	font-weight:bold;
	text-align:center;
}
@media screen and (max-width:720px){
	.form dl dd:nth-child(3) {
		padding-top:0;
		border-top: none;
	}
}
@media screen and (max-width:720px){
	p.thanks{
		margin-bottom:60px;
	}
}


/* footer
------------------------------------------------------*/
div#footer {
  background:none;
}
div#footer h1.logo {
	margin: 0 auto 90px;
}