@charset "utf-8";
/*mainVisual-takada*/
.mainVisual{
	background-image: url(../images/mv.jpg);
	background-size: cover;
	height: calc(50vh - 50px);
}
/*メインコピー*/
.catch {
    color: #fff;
    font-size: 1.5em;
    font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ Pro W6', 'Hiragino Kaku Gothic Pro';
    font-weight: bold;
    letter-spacing: 5px;
    }

.catchsub {
    display: block;
    font-size: 0.3em;

}

.main_postion {
    font-size: 2em;
    color: #fff;
    position: relative;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    padding-top: 0px;
}


section .head {
  background-color: #88CBCC;
	padding: 60px 0;
}

.attention-sp {
  display: none;
  font-size: 30px;
}

section article h3{
	width: 900px;
  margin: 0 auto;
  text-align: center;
  font-size: 36px;
	font-weight: bold;
  color: #4D4D4D;
  letter-spacing: 0.08rem;
  line-height: 80px;
}


span.fix {
  display: inline-flex;
}

p.pc {
  margin: 0% 0 1%;
  text-align: center;
  font-size: 1.2em;
  font-weight: bold;
  color: #fff;
  letter-spacing: 0.08rem;
  line-height: 60px;
  position: absolute;
  width: 900px;
  margin-top: -11%;
	margin-left: 210px;
}

span.padding_side{  
    padding: 0 20% 0px 17%;

}
.attention-sp h3{
  margin-bottom: 80px;
  text-align: center;
  font-size: 30px;
  color: #4D4D4D;
  letter-spacing: 0.08rem;
  line-height: 80px;
}

section article#contets h3 span {
  border-bottom: 5px solid #E7FF59;
}
.attention-sp h3 span {
  border-bottom: 5px solid #E7FF59;
}

.attention-sp h4 span {
  border-bottom: 5px solid #E7FF59;
}

section article#form div.registar {
	width: 100%;
	padding-bottom: 100px;
  
}

section article#form div.registar-wrapper {
  width: 900px;
  margin: 0 auto;
}

.tyui-sp {
  display: none;
}

section article#form div.registar p.tyui {
  color: #D63183;
	text-align: right;
	font-size: 14px;
	padding: 50px 0 10px;
}

.registar .registar-content {
  width :100%;
	position: relative;
  background-color: #88cbcc;
  margin-bottom: 10px;
}

.registar .content-sp {
  display: none;
}

.registar .registar-content:first-child {
  margin-top: 50px;
}

.registar .registar-content p {
  display: inline-block;
    font-size: 23px;
    padding: 1%;
    width: 100%;
    padding-left: 3%;
}
::-webkit-input-placeholder {
    color: #BCBCBC; }

.registar .registar-content p span {
  color: #fff;
}

.registar .registar-content input {
  border-color: transparent;
  width: 40%;
}

.registar .login-sp {
  display: none;
}

.registar .registar-content .login-pc {
	position: absolute;
	left: 504px;
  color: #D63183;
  width: 30%;
}
/* registar-content */
.registar .registar-content .auto {
	position: absolute;
	top: 16px;
	left: 444px;
  color: #fff;
  background-color: #848484;
  border-radius: 3px;
  padding: 2px;
  width: auto;
}

.check {
	width: 523px;
  margin: 50px auto 40px;
  display: flex;
}

.registar .checkbox {
  width: 15px;
  height: 15px;
	margin: 6px 10px 0 0;
}

.registar .check-text {
	font-size: 15px;
	color: #4D4D4D;
}
/* check */

.registar .text {
  width: 660px;
  height: 180px;
  padding: 30px;
  border: 2px solid #E2E2E2;
  background-color: #fff;
  margin: 0 auto 50px;
}

.scroll {
	width: 100%;
	height: 125px;
	overflow-y: scroll;
}

.registar .text .main-text {
  text-align: center;
  font-size: 18px;
  margin-bottom: 30px;
}

.registar .text p {
  font-size: 14px;
}

.registar a  {
	width: 320px;
  font-size: 18px;
  color: #fff;
  margin: 0 auto;
  display: block;
}

.registar .send {
  width: 320px;
  font-size: 18px;
	padding: 15px 0 16px;
	margin: 30px 0 50px;
}

.registar .send::after {
  width: 6px;
  height: 6px;
  position: absolute;
  right: 16px;
}

.registar .send2 {
  width: 320px;
  font-size: 18px;
	padding: 15px 0 16px;
	margin: 30px 0 50px;
}
/*SEC2*/
p.tyui {
		width: 900px;
    color: #D63183;
    text-align: right;
    font-size: 1em;
		margin: 0 auto;
		
}
/*SEC3*/
.registar .registar-content p span:first-child{
    color: #ffff82;
    font-size: 48px;
}

span.min_title {
    font-size: 32px;
    padding: 0 0 0 20px;
    vertical-align: super;
}

.text-set {
    padding-left: 4%;
    line-height: 16px;
		line-height: 2;
}
.padding-tb {
    padding-bottom: 5%;
    padding-top: 2%;
}
.padding-set {
    margin: 0 auto;
    display: block;
    text-align: center;
    padding-bottom: 5%;
}
/*sec4*/
.padding_bottom {
    padding-bottom: 7%;
    width:100%;
}
/*簡単style*/
.text-center{
    text-align:center;
}
.br::before {
	content: "\A";
	white-space: pre;
}

.width{
    width: 100%;
}

/*ダウンロード後は*/
.for-contents {
  width: 100%;
  padding: 150px 0px 100px;
  background: url("../images/purchase/bg.png") no-repeat #9dc7ca;
  background-size: 100% auto;
}
.for-contents h4 {
  margin: 0 0 50px;
  text-align: center;
  font-size: 36px;
  font-weight: bold;
  color: #fff;
  line-height: 60px;
}
.for-contents h4 span {
  border-bottom: 5px solid #E7FF59;
  font-size: 48px;
}
.for-contents .icon {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 900px;
  margin: 0 auto;
}
.for-contents .icon li {
  width: 260px;
  padding: 0px 15px;
}
.for-contents .icon li p {
  padding-top: 15px;
  font-size: 24px;
  font-weight: 700;
  text-align: center;
  color: #fff;
}

/* スマートフォン */

@media screen and (max-width:768px){
  .registar .registar-content p span:first-child {
    font-size: 24px;
  }
	span.min_title {
		font-size: 20px;
		vertical-align: baseline;
		padding: 0 0 0 3%;
	}
	
	section .head {
		padding: 9% 0 7%!important;
	}
/*	.padding-set img{
    width: auto!important;
    padding-bottom: 5%;
    padding-top: 5%;
  }
  section .head h2{
    width: 60%;
		padding: 0 0 1%;
  }*/
  article#form {
    margin-top: 0%;
}
  section .head p {
    font-size: 1rem;
  }
  /* head */
  section article#contets .pankuzu {
		width: 98%;
		margin: 2% auto;
  }
  section article#contets .pankuzu li {
    font-size: 0.6rem;
  }
  /* pankuzu */
  .attention-sp h3 {
		width: 90%;
		margin: 35px auto 10px;
		font-size: 16px;
		line-height: 2;
  }
	
	p.tyui {
		font-size: 11px;
		width: 90%;
		margin: 0 auto 30px;
		text-align: center;
	}


  .attention {
    display: none;
  }

  .attention-sp {
    display: block;
  }

  .tyui-sp {
		display: block;
		padding-bottom: 2%;
		font-size: 1rem;
    text-align: right;
    color: #D63183;
  }
	
	section article#contets {
		width: 100%;
	}
  .registar a {
    width: 90%;
  }
  .registar .tyui {
    display: none;
  }
	
	section article#form div.registar {
		padding: 0 0 20px;
	}

  section article#form div.registar-wrapper {
    width: 90%;
  }

  .registar .registar-content p{
    
  }

  .registar .content-sp {
    display: block;
    font-size: 1rem;
		padding-bottom: 2%;
  }

  .registar .content-sp span {
    color: #D63183;
  }

  .registar .registar-content input {
    font-size: 1rem;
    padding: 2%;
    width: 90%;
  }
	
	.postal {padding: 2% 0 10%;}

  .registar .registar-content .auto {
    display: block;
    font-size: 0.8rem;
		text-align:center;
    width: 36%;
		top: 57%;
		left: 28%;
  }

  .registar .login-sp {
		display: block;
    font-size: 1rem;
		margin-bottom: 4%;
    color: #D63283;
    text-align: right;
  }
	.check {
			width: 80%;
			margin: 10% auto;
			display: flex;
	}
  .check .checkbox {
    width: 30px;
    height: 30px;
  }

  .check .check-text {
    font-size: 1rem;
    width: 140%;
  }
	.registar .text {
		width: 80%;
		height: 280px;
	}
  .registar .text .main-text{
    font-size: 1.2rem;
    margin-bottom: 10%;
  }

  .registar .text p{
    font-size: 0.8rem;
  }
	
	.scroll {
		height: 230px;
		line-height: 1.8;
	}

  .registar .send {
		margin: 15px auto 0;
  }

  .registar .send a {
    line-height: 40px;
  }

  .registar .send p {
    font-size: 28px;
  }

  .registar .send p::after {
    width: 9px;
    height: 9px;
    right: 30px;
    top: 38px;
    border-top: solid 3px;
    border-right: solid 3px;
  }
	
	.registar .send2 {
		margin: 15px auto 0;
	}
	
	span.padding_side {
		padding: 0 11% 0px 14%;
	}

  /*ダウンロード後は*/
  .for-contents {
    width: 100%;
    padding: 70px 0px 38px;
    background: url("../images/purchase/bg-sp.png") no-repeat #88cbcc;
    background-size: 100% auto;
  }
  .for-contents h4 {
    margin: 0 0 25px;
    font-size: 18px;
    line-height: 30px;
  }
  .for-contents h4 span {
    border-bottom: 3px solid #E7FF59;
    font-size: 24px;
  }
  .for-contents .icon {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 94%;
    margin: 0 auto;
  }
  .for-contents .icon li {
    box-sizing: border-box;
    width: 33.3%;
    padding: 0px 5px;
  }
  .for-contents .icon li p {
    padding-top: 8px;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 700;
    text-align: center;
    color: #fff;
  }
  
  .padding-set {
    padding-top: 5%;
    width: 20px;
  }

}