.disp-pc { display: block; }
.disp-sp { display: none; }

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

.content-inner {
	max-width: 1024px;
	margin-left: auto;
	margin-right: auto;
}

#essel-mint-wrpper a.text-link{
	color: #11c8ca;
	text-decoration: underline;
}

@media (any-hover: hover) {
	a:hover {
		opacity: .8;
		transition: all 600ms;
	}
}

.flex-box{
	display: flex;
	flex-flow: row nowrap;
}

#essel-mint-wrpper{
	background: url(../img/step_bg-pc.png) repeat-y;
	background-size: contain;
}

@media screen and (max-width: 768px) {
	#essel-mint-wrpper{
		background: url(../img/step_bg-sp.png) repeat-y;
		background-size: contain;
	}
}

#oubo{
	padding-top: 350px;
	margin-top: -350px;
}

@media screen and (max-width: 768px) {
	#apply{
		padding-top: 100px;
		margin-top: -100px;
	}
}


/* ==============
   teaser
   ============== */
#essel-mint-wrpper.teaser{
	background: none;
}

.teaser .top-mv{
	background: url("../img/mv_bg-pc-t.png") no-repeat center 0 / cover;
	padding: 180px 0 65px 0;
}

.teaser .top-mv .mv{
		max-width: 1526px;
}

@media screen and (max-width: 768px) {
  .teaser .top-mv {
		background: none;
		padding: 70px 0 40px 0;
	}
}


/* ==============
   mv
   ============== */
.top-mv {
	background: url("../img/mv_bg-pc.png") no-repeat center 0 / cover;
	padding: 80px 0 65px 0;
}

.top-mv .mv{
	padding-bottom: 25px;
	max-width: 1021px;
	margin: 0 auto;
}

.top-mv .btn-area{
  gap: 0 20px;
	justify-content: center;
}

.top-mv .btn-area .btn-link{
	max-width: 165px;
}



@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 768px) {
	.top-mv {
		background: url("../img/mv_bg-sp.png") no-repeat center 0 / cover;
		padding: 70px 0 40px 0;
	}
	
	.top-mv .mv{
		padding-bottom: 15px;
		max-width: 100%;
	}
	
	.top-mv .btn-area .btn-link{
		max-width: 105px;
	}
}

/* ==============
   question
   ============== */
.essel-mint-question{
	background: url(../img/question_bg-pc.png) no-repeat center 0 / cover;
	padding-bottom: 350px;
}

.essel-mint-question .title-area{
	max-width: 409px;
	margin: 0 auto 42px auto;
}

.essel-mint-question .title-area img{
	margin-top: -40px;
}

.essel-mint-question [class^="question"]{
	max-width: 730px;
	margin: 0 auto;
}

.essel-mint-question [class^="question"] + [class^="question"]{
	/*! margin-top: 52px; */
}

.essel-mint-question .question1{
	margin-bottom: 80px;
}

.essel-mint-question .question2{
	margin-bottom: 60px;
}

.essel-mint-question .question3{

}

@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 768px) {
	.essel-mint-question{
		background: url(../img/question_bg-sp.png) no-repeat center 0 / cover;
		padding-bottom: 140px;
	}

	.essel-mint-question .title-area{
		max-width: 55%;
		margin: 0 auto 20px auto;
	}

	.essel-mint-question .title-area img{
		margin-top: -25px;
	}

	.essel-mint-question [class^="question"]{
		padding: 0;
	}

	.essel-mint-question [class^="question"] + [class^="question"]{
		margin-top: 30px;
	}
}



/* ==============
   step
   ============== */
.essel-mint-step{
	padding: 0 0 200px 0;
}

.essel-mint-step .step-title-area{
	max-width: 730px;
  margin: -400px auto 20px auto;
}

.essel-mint-step .step-copy-img{
	max-width: 667px;
	margin: 0 auto 70px auto;
}

.essel-mint-step .step-area{
	max-width: 930px;
	margin: 0 auto;
	background: #fff;
	border: 2px solid #bebebe;
	padding: 70px 60px 40px 60px;
	color: #4a1d12;
}

.essel-mint-step .step-area + .step-area{
  margin-top: 80px;
}

.essel-mint-step .step-area .step-num-img{
	max-width: 181px;
	margin: -90px auto 25px auto;
}

.step-container .text-content{
	gap: 0 25px;
}

.step-container .text{
	font-size: 22px;
  font-size: min(2vw, 22px);
	line-height: 1.6;
  font-weight: bold;
}

.step-container .text-content .text-area{
	width: calc(100% - 400px);
}

.step-container .text-content .img-area{
	width: 400px;
}

.step-container .btn-area{
	max-width: 350px;
	margin: 50px auto 0 auto;
}

.step-container .note-list{
	font-size: 16px;
  font-size: min(2vw, 16px);
	line-height: 1.8;
	margin: 20px 0;
  font-weight: bold;
}

.step-container .note-list .list-item{
	padding-left:1em;
  text-indent:-1em;
}

.step-container .line-img{
	padding-top: 10px;
	position: relative;
}

.step-container .btn-b{
  position: absolute;
	bottom: 25px;
	left: 250px;
}


@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 768px) {
	.essel-mint-step{
		padding: 0 0 130px 0;
	}

	.essel-mint-step .step-title-area{
		max-width: 90%;
		margin: -170px auto 10px auto;
	}

	.essel-mint-step .step-copy-img{
		max-width: 80%;
		margin: 0 auto 40px auto;
	}

	.essel-mint-step .step-area{
		max-width: 90%;
		padding: 70px 15px 20px 15px;
	}

	.essel-mint-step .step-area + .step-area{
		margin-top: 80px;
	}

	.essel-mint-step .step-area .step-num-img{
		max-width: 48%;
		margin: -90px auto 15px auto;
	}

	.step-container .text-content{
		gap: 5px 0;
		display: flex;
    flex-flow: column;
	}

	.step-container .text{
		font-size: 3.95vw;
	}

	.step-container .text-content .text-area{
		width: 100%;
	}

	.step-container .text-content .img-area{
		width: 95%;
		margin: 0 auto;
	}

	.step-container .btn-area{
		max-width: 100%;
		margin: 30px auto 0 auto;
	}

	.step-container .note-list{
		font-size: 3.4vw;
		line-height: 1.6;
		margin: 20px 0;
	}

	.step-container .line-img{
		padding-top: 0px;
	}

	.step-container .btn-b{
		width: 95%;
		bottom: 15px;
		left: 0;
		right: 0;
		margin: 0 auto;
	}
	
	.step-container{
		position: relative;
	}
	
	.step2 .img-area,
	.step4 .img-area,
	.step5 .img-area{
		position: absolute;
		top: 15vw;
		left: 0;
		right: 0;
		margin: 0 auto;
	}
	
	.step5 .img-area{
		top: 30vw;
	}
	
	.step2 .note-list{
		margin: 35vw 0 0 0;
	}
	
	.step4 .note-list{
		margin: 32vw 0 0 0;
	}
	
	.step5 .note-list{
		margin: 56vw 0 0 0;
		text-align: right;
	}
}


/* ==============
   essel-mint-apply
   ============== */
.essel-mint-apply{
	background: url("../img/oubo_bg-pc.png") no-repeat center top / cover;
	margin-top: -150px;
	padding: 180px 0 200px 0;
}

.essel-mint-apply .apply-inner{
	max-width: 930px;
	margin: 0 auto;
}

.essel-mint-apply  .apply-title-area{
	background: #4a1e11;
  color: #fff;
	text-align: center;
	padding: 10px;
	border-radius: 30px 30px 0 0;
	font-size: 24px;
  font-size: min(2vw, 24px);
	line-height: 1.8;
}

.essel-mint-apply .apply-text-wrap{
  background: #fff;
	padding: 40px 60px;
	border-radius: 0 0 30px 30px;
	height: 380px;
	overflow-y: scroll;
  overflow-x: hidden;
}

.essel-mint-apply .apply-text-wrap dl{

}

.essel-mint-apply .apply-text-wrap dl + dl{
	margin-top: 70px;
}

.essel-mint-apply .apply-text-wrap dt{
	color: #401f12;
	font-size: 20px;
  font-size: min(2vw, 20px);
	line-height: 1.8;
	font-weight: bold;
	border-bottom: 1px solid #c6bbbf;
	padding-bottom: 10px;
  margin-bottom: 10px;
}

.essel-mint-apply .apply-text-wrap dd{
	font-size: 16px;
  font-size: min(2vw, 16px);
	line-height: 1.8;
	margin: 0;
}

@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 768px) {
	.essel-mint-apply{
		background: url("../img/oubo_bg-sp.png") no-repeat center top / cover;
		margin-top: -90px;
		padding: 80px 0 50px 0;
	}

	.essel-mint-apply .apply-inner{
		max-width: 90%;
		margin: 0 auto;
	}

	.essel-mint-apply  .apply-title-area{
		padding: 20px;
		border-radius: 10px 10px 0 0;
		font-size: 4vw;
	}

	.essel-mint-apply .apply-text-wrap{
		padding: 30px 20px;
		border-radius: 0 0 10px 10px;
		height: 364px;
	}

	.essel-mint-apply .apply-text-wrap dl{

	}

	.essel-mint-apply .apply-text-wrap dl + dl{
		margin-top: 30px;
	}

	.essel-mint-apply .apply-text-wrap dt{
		font-size: 4vw;
		padding-bottom: 10px;
		margin-bottom: 10px;
	}

	.essel-mint-apply .apply-text-wrap dd{
		font-size: 3vw;
		line-height: 1.8;
	}
}






































































