section .present {
	margin:40px 0 80px;
	padding:40px;
	background-color:#1ba4da;
}

#topics .img_main {
	max-width:1200px;
}

.red {
  color: #ff0000;
}

.bold {
  font-weight: 900;
}

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

/* STEP BOX */

div.stepbox {
    max-width: 700px;
		width: 80%;
    margin: 0 auto 50px;
    padding: 10px 20px;
    border: solid 1px #0e4eaf;
    border-radius: 5px;
    font-size: 1.4rem;
    line-height: 22px;
    letter-spacing: 0.05em;
}

div.stepbox p.headtxt {
		margin: 15px 0;
    padding: 20px 0;
    text-align: center;
    font-weight: bold;
    font-size: 1.8em;
    line-height: 30px;
}

div.stepbox p {
		font-size: 1.0em;
    margin: 5px 0 30px;
    padding: 5px 10px;
}

div.stepbox p.linehead {
    margin: 5px 0 5px;
    padding: 10px 10px;
    background: #0e4eaf;
    color: #fff;
    font-weight: bold;
		font-size: 1.2em;
		border-radius: 5px;
}

div.stepbox p.info {
    text-align:center;
    margin: 20px auto 0;
    font-weight: bold;
		font-size: 1.2em;
		line-height: 1.8em;
}


/* BUTTON */

.btn {
  max-width: 300px;
  border-radius: 10px;
  margin: 0px auto 63px;
  background: #ffcc33;
  text-align: center;
  padding: 20px;
}
div.btn p {
  padding: 20px auto;
  font-weight: bold;
  font-size: 1em;
}
div.btn img {
    width: 200px;
    margin: 10px auto;
}

.btn2 {
  max-width: 600px;
  margin: 0px auto 63px;
  text-align: center;
  padding: 20px;
}


/* NAGESEN AREA */

div.nagesen {
  max-width: 700px;
  margin: 0 auto 50px;;
  padding: 20px;
  background: #003894;
  color: #fff;
  border-radius: 5px;
  font-size: 1.4rem;
  line-height: 22px;
  letter-spacing: 0.05em;
}

div.nagesen h3 {
  padding: 20px 0 30px;
  font-size: 2em;
  line-height: 1.4em;
  text-align: center;
  font-weight: bold;
}

div.nagesen p {
  max-width: 500px;
  margin: 0 auto;
}

div.nagesen div.btn {
  margin: 30px auto 10px;
}

div.nagesen p.date {
  max-width: 500px;
  margin: 0 auto 10px;
  text-align: right;
}


/* IMPORTANT INFO AREA */

div.imp-info {
	max-width:840px;
  width: 80%;
  margin: 0 auto 50px;
  padding: 20px;
  font-size: 1.4rem;
  line-height: 22px;
  letter-spacing: 0.05em;
	border-top: solid 2px #ea6f72;
	border-bottom: solid 2px #ea6f72;
}

div.imp-info h3 {
  padding: 20px 0 30px;
  font-size: 1.6em;
  line-height: 1.4em;
  text-align: center;
  font-weight: bold;
}

div.imp-info p {
	font-size: 1.2em;
	line-height: 1.6em;
	width:100%;
  margin: 0 auto 10px;
}

div.imp-info p.date {
  max-width: 500px;
  margin: 0 auto 10px;
  text-align: right;
}

.imp-info-sub {
	font-size: 1.2em;
	line-height: 1.6em;
	width:94%;
	max-width:850px;
  margin: 0 auto 40px;
}

.imp-info-sub a{
	padding:20px;
	display:block;
	background-color: #ea6f72;
  border-radius: 5px;
	width: 70%;
	margin: 0 auto 60px;
  box-shadow: 5px 5px 0px 0 rgb(47 43 14);
  color: #fff;
  font-weight: bold;
	letter-spacing: 0.1em;
}



/* MORETICKET AREA */

div.moreticket {
  max-width: 700px;
  margin: 0 auto 50px;;
  padding: 20px;
  background: #eba206;
  color: #fff;
  border-radius: 5px;
  font-size: 1.4rem;
  line-height: 22px;
  letter-spacing: 0.05em;
}

div.moreticket h3 {
  padding: 20px 0 30px;
  font-size: 2em;
  line-height: 1.4em;
  text-align: center;
  font-weight: bold;
}

div.moreticket p {
  max-width: 500px;
  margin: 0 auto;
}

div.moreticket div.btn {
  margin: 30px auto 10px;
}

div.moreticket p.date {
  max-width: 500px;
  margin: 0 auto 10px;
  text-align: right;
}




/*--------------------------------------------------------------
## COMMON
--------------------------------------------------------------*/
.present__header {
  background-color: #fff;
  padding: 0.5em;
  text-align: center;
}
.present__header .title {
  margin: 0;
  padding: 0;
  font-size: 1em;
  line-height: 1;
}
.present__header .title img {
  width: auto;
  height: 3.5em;
}
.present__header p {
  margin: 0;
  padding: 0.5em 0 0;
  line-height: 1.5;
}
.present__body {
  padding: 3.75em 20px;
}
.present.p-message .present__header .title {
  margin-top: -2em;
}
.present.p-message .present__header .title img {
  width: auto;
  height: 8em;
}
.present.p-message .present__header p img {
  width: auto;
  height: 3em;
}
.present.p-message .present__body {
  padding: 3.75em 0;
}
@media (max-width: 40em) {
  .present__header .title img {
    height: 2.5em;
  }
  .present__body {
    padding: 1.25em;
  }
  .present.p-message .present__header {
    margin-top: 2em;
  }
  .present.p-message .present__header p {
    padding: 0.5em 1.25em 0;
  }
  .present.p-message .present__header p img {
    width: 100%;
    height: auto;
  }
  .present.p-message .present__body {
    padding: 0 0 1.875em;
  }
}

.present-list {
  max-width: 830px;
  margin: 0 auto;
  padding: 0;
}
.present-list_left ul {
  justify-content: flex-start !important;
}
.present-list ul {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  margin-bottom: -20px;
  margin-left: -20px;
  justify-content: center;
  margin-bottom: -2em !important;
  padding: 0;
}
.present-list ul > * {
  margin: 0 0 20px 40px;
  width: calc((100% / 3) - 40px);
  flex: 0 0 calc((100% / 3) - 40px);
}
.present-list li {
  padding-bottom: 1em;
}
.present-list li figure {
  margin: 0;
  padding: 0;
}
.present-list li .photobox {
  border-radius: 50%;
  width: 100%;
  height: 0;
  padding-top: 100%;
	box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .3);
}
.present-list li figcaption {
  padding: 1em 0 0;
  line-height: 1.5;
  text-align: center;
}
.present-list li figcaption p {
  margin: 1em 0 0;
  padding: 0;
	font-size: 1.2em;
	font-weight: bold;
}
.present-list li figcaption .group {
  display: inline-block;
  margin-top: 0.5em;
  font-size: 0.8em;
}
.present-list li figcaption .catch {
  background: #f5df45;
  border-radius: 10px;
  position: relative;
  margin: 0;
  height: 2.5em;
  display: flex;
  align-items: center;
  justify-content: center;
	font-size: 1.6em;
	font-weight: bold;
	box-shadow: 5px 5px 0px 0 rgb(47 43 14);
}
.present-list li figcaption .catch::before {
  border-color: transparent transparent #f5df45 transparent;
  border-style: solid;
  border-width: 0 8px 8px 8px;
  height: 0;
  width: 0;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -8px);
  display: block;
  content: "";
}
.present-list_single {
  max-width: 38.75em;
}
.present-list_single ul {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  margin-bottom: -20px;
  margin-left: -20px;
  padding: 0;
}
.present-list_single ul > * {
  margin: 0 0 20px 20px;
  width: calc((100% / 1) - 20px);
  flex: 0 0 calc((100% / 1) - 20px);
}
.present-list_single li .photobox {
  padding-top: 67%;
}
@media (max-width: 40em) {
  .present-list {
    padding: 0;
  }
  .present-list ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    margin-bottom: -20px;
    margin-left: -20px;
  }
  .present-list ul > * {
    margin: 0 0 20px 20px;
    width: calc((100% / 1) - 100px);
    flex: 0 0 calc((100% / 1) - 100px);
  }
  .present-list li figcaption .group {
    font-size: 0.65em;
  }
  .present-list li figcaption .catch {
    font-size: 1.25em;
  }
  .present-list_single ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    margin-bottom: -20px;
    margin-left: -20px;
  }
  .present-list_single ul > * {
    margin: 0 0 20px 20px;
    width: calc((100% / 1) - 20px);
    flex: 0 0 calc((100% / 1) - 20px);
  }
}


.form_content {
	width: 100%;
	margin: 20px auto 40px;
	border: solid 2px #0e4eaf;
	border-radius: 5px;
	text-align: center;
}

#topics .ttl_h3 h3 {
	font-size: 1.6rem;
	background:none;
}


#listenersStatus .ttl_h3{
	width:100%;
	margin:0 auto 20px;
	padding:10px 0;
	background-color:#0e4eaf;
	border-bottom: 2px solid #0e4eaf;
	text-align:center;
}

#topics .ttl_h3 h3 span {
    color: #000;
    line-height: 24px;
    font-weight: bold;
    padding: 0;
}

#topics .form_content .ttl_h3 h3 span {
    color: #fdff53;
    line-height: 24px;
    font-weight: bold;
    padding: 0;
    font-size: 2.0rem;
}


#listenersStatus h3{
	width:100% !important;
	height:auto !important;
	font-size: 2.0rem;
	font-weight:bold;
	color:#fff;
}

#listenersStatus h3{
	width:100% !important;
	height:auto !important;
	font-size: 2.0rem;
	font-weight:bold;
	color:#fff;
	text-indent: initial !important;
}


#listenersStatus dl{
	margin:40px auto 10px;
}

#listenersStatus dt{
	font-size:1.2em;
	font-weight:bold;
	text-align:right;
	display:inline-block;
}

#listenersStatus dt span{
	font-size:1.0em;
	color:#ff0000;
}

#listenersStatus dd{
	display:inline-block;
	width: 400px;
	text-align:left;
}

#listenersStatus input[type="text"], input[type="email"] {
    display: inline-block;
		font-size:1.2em;
    width: 100%;
    padding: 3px;
    background-color: #f8f8f8;
    border-radius: 6px;
}

#listenersStatus input[type="submit"] {
	color: #333;
	padding: 0;
	display: block;
	background-color: #ea6f72;
	border-radius: 5px;
	width: 90%;
	margin: 20px auto 40px;
	box-shadow: 5px 5px 0px 0 rgb(47 43 14);
	color: #fff;
	font-weight: bold;
	letter-spacing: 0.1em;
}

#listenersStatus input[type="submit"]:Hover {
  cursor: pointer;
}

#listenersStatus .buyticket {
  margin:60px auto 0;
}




#listenersStatus .block_form .link {
		display: block;
    width: 80%;
    margin: 50px auto 100px;
		position: relative;
}

#listenersStatus .block_form .link a{
		color:#fff;
		background-color: #d41c1c;
		font-size: 2.8rem;
		font-weight: 700;
		padding: 30px 10px;
		display:block;
}

#listenersStatus .block_form .link a::after{
		content: "";
		display: block;
		width: 22px;
		height: 20px;
		background-image: url(../img/common/icon_arrow_fff.svg);
		background-size: contain;
		position: absolute;
		top: calc(50% - 10px);
		right: 30px;
}


#present_box {
	text-align: center;
	width: 100%;
	max-width:1120px;
	margin: 3% auto;
	border-radius: 12px;
	background-color: rgba(255, 255, 255, 0.8);
	box-shadow: 0px 0px 30px 0px rgba(35, 24, 21, 0.1);
	padding: 50px 40px;
}

#present_box .pt_present {
	font-size:2.4em;
	font-weight: bold;
	color:#ff0000;
	margin-bottom: 40px;
	border-radius: 10px;
	border:solid 1px #ff0000;
	padding:20px;
}

#present_box h2 {
	font-size:1.4em;
	font-weight: bold;
	margin-bottom: 40px;
}

#present_box li {
	margin:0 auto 60px;
	padding:30px;
	display:inline-block;
	list-style: none;
}

#present_box li .wall_title {
	font-size:1.4em;
	font-weight: bold;
	margin:20px auto;
}

#present_box li a, #present_box #mail_box .link_txt a, .link_txt2 a{
		width: 100%;
    max-width: 230px;
		margin:0 auto;
    background: #000;
    color: #fff;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 38px;
    font-family: "Ekster-Bold", sans-serif;
    font-weight: normal;
    font-style: normal;
    padding: 0 15px;
    border-radius: 20px;
}

#present_box li a span, #present_box #mail_box .link_txt a span, .link_txt2 a span {
    transform: translateY(1px);
    width: calc(100% - 40px);
    padding-left: 20px;
		font-size: 1.2em;
    color: #fff;
}

#present_box li a::after, #present_box #mail_box .link_txt a::after, .link_txt2 a::after {
    content: "";
    width: 40px;
    height: 11px;
    display: block;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2233%22%20height%3D%229%22%20viewBox%3D%220%200%2033%209%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20fill%3D%22%23fff%22%20d%3D%22M31.907%2C8.999%20L-0.001%2C8.999%20L-0.001%2C6.997%20L27.912%2C6.997%20L18.132%2C1.766%20L19.080%2C0.001%20L32.381%2C7.115%20C32.787%2C7.332%2032.992%2C7.796%2032.880%2C8.242%20C32.768%2C8.687%2032.367%2C8.999%2031.907%2C8.999%20Z%22%2F%3E%3C%2Fsvg%3E);
    transform: translate(0, -2px);
    transition: all 0.4s ease-out 0s;
}




@media screen and (max-width: 760px){   
	#listenersStatus dd {
	    display: inline-block;
	    width: 80%;
	    text-align: left;
	}

	#present_box {
		width:94%;
		padding:50px 0;
	}
}