@charset "utf-8";
/* ピタっとペーパー */

.youtubeWrap{
  max-width: 560px;
  margin: 40px auto;
}
.youtubeWrapInner{
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtubeWrapInner iframe {
  width: 100%;
  height: 100%;
}

.freeWrap	h2{ 
  background-color: #152c81; 
  color: #fff; 
  font-size: 22px;
  font-weight: 700;
	line-height: 1.0;
  padding: 12px 20px; 
  margin: 50px auto 40px; 
}

.freeWrap h3.line {
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
    letter-spacing: 0em;
    position: relative;
    margin-bottom: 30px;
    padding-left: 14px;
    color: #152c81;
}
.freeWrap h3.line::before {
    content: "";
    width: 4px;
    height: 4px;
    background: #e6960b;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
}
.freeWrap h3.line::after {
    content: "";
    width: 4px;
    height: 100%;
    background: #152c81;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

.intro{
  display: flex;
  column-gap: 30px;
}
.intro_col_L, .intro_col_R{
    margin-bottom: 40px;
}
.intro_col_L .title{
  font-size: 16px;
  font-weight: 700;
  margin-top: 40px;
  margin-bottom: 30px;
}
.intro .leading{
  font-size: 16px;  
  font-weight: 700;
}
.intro p{
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .intro{
    flex-direction: column;
    align-items: center;
  }
  .intro_col_R img{
    max-width: 345px;
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  .intro{
    justify-content: space-between;
  }
  .intro_col_L .title{
    font-size: 22px;
  }
  .intro_col_L{
    width: calc( (100% - 40px) * 0.6 );
  }
  .intro_col_R{
    width: calc( (100% - 40px) * 0.4 );
  }
  .intro .leading{
    font-size: 22px;
  }
}


.useBox{
	display: flex;
	flex-wrap: wrap;
	column-gap: 10px;
}
.useBox p{
	line-height: 1;
}
.useBox .use{
	background-color: #f2f7fd;
	border-radius: 4px;
}
.useBox .title{
  display: flex;
}
.useBox .num{
	color: #e6960b;
	font-family: Poppins, san-serif;
	font-size: 22px;
	font-weight: 700;	
}
.useBox .text{
  color: #152c81; 
  font-size: 18px;
  font-weight: 700;
  font-feature-settings: "palt";
  margin-left: 10px;
}
.useBox .img,
.useBox .img + p{
  margin-top: 10px;
}
@media screen and (max-width: 599px) {
	.useBox{
    flex-direction: column;
		justify-content: center;
	}
	.useBox .use{
		padding: 20px;
		margin-bottom: 25px;
		width: 100%;
	}
	.useBox .img img{
		width: min( 100% , 305px );
	}
}
@media screen and (min-width: 600px) and (max-width: 767px) {
	.useBox{
		justify-content: space-between;
	}
	.useBox .use{
		padding: 20px;
		margin-bottom: 10px;
    width: calc( (100% - 10px) / 2 );
  }
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
	.useBox{
		justify-content: space-between;
	}
	.useBox .use{
		padding: 30px;
		margin-bottom: 10px;
    width: calc( (100% - 10px) / 2 );
  }
}
@media screen and (min-width: 1280px) {
  .useBox{
		justify-content: space-between;
	}
	.useBox .use{
		padding: 30px;
		margin-bottom: 20px;
	}
	.useBox .use{
		width: calc( (100% - 30px) / 4 );
	}
}
@media screen and (min-width: 768px) {
	.useBox .num{
		font-size: 28px;
	}
  .useBox .text{
    font-size: 22px;
    margin-left: 8px;
  }
}

.pointcheck{
  display: flex;
  flex-wrap: wrap;
  column-gap: 10px;  
}
.pointcheck_inner {
  display: flex;
  background: #f2f7fd;
  border-radius: 4px;
  margin-bottom: 10px;
  padding: 20px;
}
.pointcheck_title {
  color: #152c81;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  padding-left: 22px;
  position: relative;
}
.pointcheck_title::before{
  content: url("../../../assets/images/check-sp.svg");
  position: absolute;
  left: 0px;
  top: -1px;
  margin-right: 10px;
}

@media screen and (max-width: 360px) {
  .pointcheck_title {
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .pointcheck{
    flex-direction: column;
  }
  .pointcheck_inner {
    justify-content: flex-start;
  }
}
@media screen and (min-width: 768px) {
  .pointcheck{
    justify-content: center;
  }
  .pointcheck_inner{
		width: calc( (100% - 20px) / 3 );
    justify-content: center;
    padding: 30px;
  }
  .pointcheck_title {
    font-size: 18px;
    padding-left: 30px;
  }
  .pointcheck_title::before {
    content: url("../../../assets/images/check.svg");
    position: absolute;
    left: 0px;
    top: -2px;
  }
}

.pointbox{
  display: flex;
  column-gap: 30px;
  margin: 40px auto;
}
.pointbox_col.img img{
  max-width: 460px;
  width: 100%;
}
.pointbox h3{
  color: #152c81;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.1;
  padding-left: 1em;
  margin-top: 0;
  margin-bottom: 20px;
  position: relative;
}
.pointbox h3::before {
  position: absolute;
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #e6960b;
  border-radius: 50%;
  top: 8px;
  left: 0;
}
.pointbox .sendsize{
  background-color: #F2F7FD;
  border-radius: 4px;
  padding: 20px;
  margin-top: 20px;
  line-height: 1.6;
}
.fc_2f4c9c{
  color: #2f4c9c;
}

@media screen and (max-width: 419px) {
  .pointbox .sendsize .sp_block{
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .pointbox{
    flex-direction: column;
  } 
  .pointbox_col:first-of-type{
    margin-bottom: 40px;
  }
  .pointbox .sendsize p:not(:last-of-type){
    margin-bottom: 10px;
  }
}
@media screen and (min-width: 768px) {
  .pointbox{
    align-items: center;
  }
  .pointbox_col.img{
		width: calc( (100% - 30px) * 0.4 );
  }
  .pointbox_col.text{
		width: calc( (100% - 30px) * 0.6 );
  }
  .bointbox h3::before{
    width: 10px;
    height: 10px;
  }
  .pointbox.change .pointbox_col.text{
    order: 1;
  }
  .pointbox.change .pointbox_col.img{
    order: 2;
  }
}

.label{
  background-color: #f2f7fd; 
  padding: 20px; 
}
.label a{
  color: #065fd4;
  text-decoration: underline;
}
.osusume{
  color: #152c81;
  font-weight: 700;
  font-size: 18px; 
  margin-bottom: 20px;
}
.labelbox{
  display: flex;
  column-gap: 40px;
}
.label_inner{
  display: flex;
  align-items: center;
  column-gap: 20px;
}
.label_inner img{
  max-width: 120px;
  width: 100%;
}
.label_inner dl{
  display: flex;
  flex-wrap: wrap;
}
.label_inner dl dt{
  font-weight: 400;
  width: 3em;
}
.label_inner dl dd{
  width: calc( 100% - 3em );
}
.label_inner a{
  color: #131b38;
  text-decoration: none;
  opacity: 1;
}
.label_inner a dl dd span{
  color: #065fd4;
  border-bottom: 1px solid #065fd4;
}
.label_inner a:hover dl dd{
  opacity: 0.6;
}
.label_inner a dl dd br{
  display: block;
}

@media screen and (max-width: 767px) {
  .labelbox{
    flex-direction: column;
  }
  .label_inner:first-of-type{
    margin-bottom: 40px;
  }
}
@media screen and (min-width: 768px) {
  .label{
    padding: 30px; 
  }
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
  .label_inner a dl dd br{
    display: none;
  }
}

.nekoposu{
  line-height: 1.4;
  margin-bottom: 30px;
  padding: 10px 20px 20px;
  border:1px solid #c7cad5;
  border-radius: 4px;
}

.lineup{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 40px;
}
.lineup_col{
  margin-bottom: 50px;
}
.lineup_col .img{
  margin-bottom: 20px;
}
.lineup_col a p{
  line-height: 1.5em;
  text-indent: -2em;
  padding-left: 3em;
}
.lineup_col a .textlink{
  color: #065fd4;
  border-bottom: 1px solid #065fd4;
}
.lineup_col a .nodeco{
  display: inline-block;
  color: #131b38;
  margin-left: 1em;
}
.lineup_col a:hover{
  opacity: 1;
}
.lineup_col a:hover .textlink{
  opacity: 0.6;
}
.lineupWrap h3.line:not(:first-of-type){
  margin-top: 0;
}

@media screen and (max-width: 767px) {
  .lineup{
    flex-direction: column;
    align-items: center;
  }
  .lineup_col{
    max-width: 345px;
  }
  .lineup_col .img img{
    max-width: 345px;
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  .lineup_col{
    width: calc( ( 100% - 40px ) / 2)
  }
  .lineup:nth-last-child(-n+1) .lineup_col:nth-last-child(-n+2){
    margin-bottom: 0;
  }
}