@charset "utf-8";

/* =============================================================================
	作成のポイント
   ========================================================================== */
.point .keyimages {
	background: url(../img/point/bgPoint.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	height: 350px;
}
.point .keyimages h2 {
	font-size: 36px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	padding: 141px 0;
}
.point .keyimages h2 span.box {
	background:rgba(30,30,35,0.6);
	padding: 5px 30px;
}

/*パンフレット制作事例*/

#point01 {
	display: none;
	padding-bottom: 60px;
	background: #ecebf0;
}


@media screen and (max-width: 767px) {
	
	/*.point h2 img {
	height: 25px;
}*/
	.point .keyimages {
		height: 200px;
	}
	.point .keyimages h2 {
		font-size: 21px;
		padding: 81px 0;
	}
	#point01 h2 {
		font-size: 18px;
		text-align: center;
	}

}


/*パンフレットのタイプについて*/
#point02 {
	padding: 40px 0;
}
#point02 h2 small {
	font-size: 28px;
}
#point02 .business01 {
	padding: 30px;
	margin-bottom: 50px;
	border-radius: 5px;
}
#point02 .type-txt{
	font-weight: bold;
}
#point02 .blue .type-txt span{
	color: #0068b7;
}
#point02 .green .type-txt span{
	color: #4caa55;
}
#point02 .blue {
	border: 3px dotted #009cc9;
}
#point02 .blue-gra {
	background: rgb(0,151,201);
background: linear-gradient(124deg, rgba(0,151,201,1) 0%, rgba(0,104,183,1) 100%);
}
#point02 .yellow {
	border: 3px dotted #e3bd26;
}
#point02 .yellow-gra {
	background: rgb(234,223,95);
background: linear-gradient(124deg, rgba(234,223,95,1) 0%, rgba(228,191,45,1) 100%);
}
#point02 .green {
	border: 3px dotted #4caa55;
}
#point02 .green-gra {
	background: rgb(136,215,109);
background: linear-gradient(124deg, rgba(136,215,109,1) 0%, rgba(76,170,85,1) 100%);
}
#point02 .green-gra-under{
	font-size: 22px !important;
	color: #439c4b;
	font-weight: bold;
	margin-top: -45px;
    margin-bottom: 30px;
	padding-left: 8px;
}
#point02 .purple {
	border: 3px dotted #9c24e9;
}
#point02 .business01 h3 {
	color: #fff;
	padding: 20px 0 20px 30px;;
	font-size: 23px;
	font-weight: bold;
	margin-bottom: 30px;
	letter-spacing: 0.1em;
}

#point02 .business01 h4 {
	font-weight: bold;
	font-size: 20px;
	padding-bottom: 10px;
	padding-top: 15px;
	padding-left: 8px;
}
#point02 .business01 p {
	line-height: 1.6em;
	font-size: 15px;
	padding-left: 8px;
}
#point02 .height70 {
	height: 70px;
}
#point02 .flex2 {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
#point02 .flex2 p {
	padding-left: 30px;
}

@media screen and (min-width: 1080px) {

	#point02 .business01 div img{
		max-width: 460px;
	}
}

@media screen and (min-width: 768px) {
	#point02 .flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
}
	#point02 .flex-element {
		width: 45%;
	}
	
	#point02 .flex-element2 {
	width: 48%;
}
}

@media screen and (max-width: 767px) {
	#point02 {
		padding: 30px 0;
	}	
	#point02 .business01 {
		padding: 20px;
		margin-bottom: 30px;
	}
	#point02 h2 small {
		font-size: 20px;
	}
	#point02 .business01 h3 {
		padding: 10px;
		text-align: center;
		margin-bottom: 20px;
		font-size: 20px;
	}
	#point02 .business01 h3 img {
		padding-left: 0;
	}
	#point02 .business01 h4 {
		font-size: 18px;
	}
	#point02 .business01 p {
		padding-bottom: 10px;
		font-size: 13px;
	}
	#point02 .green-gra-under{
		font-size: 18px !important;
		margin-top: -20px;
		margin-bottom: 0;
	}

}

/*パンフレット制作の流れ*/
#point03 {
	padding: 40px 0;
}
#point03 .txt {
	color: #555558;
}
#point03 ul {
	max-width: 950px;
	margin: 0 auto;
}
#point03 ul hr {
	display: block;
  	width: 100%;
  	height: 1px;
  	background-color: #aaaab0;
  	border: 0;
	margin: 20px 0;
}
#point03 ul li {
	font-size: 15px;
    padding-bottom: 30px;
    margin-top: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
    background: url(../img/point/border_img01.jpg) repeat-y 20px 0;
}
#point03 ul li .icon {
    width: 6%;
}
#point03 ul li .icon img {
    background: #fff;
    padding-bottom: 40px;
}
#point03 ul li .txt {
    line-height: 1.8em;
    width: 60%;
}
#point03 ul li .txt h3 {
    font-size: 20px;
    font-weight: bold;
    padding-bottom: 10px;
	padding-top: 42px;
	padding-bottom: 45px;
}
#point03 ul li .txt h3 small{
	font-size: 17px;
}
#point03 ul li .img {
	width: 25%;
	padding-top: 42px;
}
@media screen and (min-width: 768px) {
	
}
@media screen and (max-width: 767px) {
	#point03 {
		padding: 30px 0;
	}
	#point03 h2 {
		padding-bottom: 30px;
	}
	#point03 ul li {
		flex-wrap: wrap;
	}
	#point03 ul li .icon {
    width: 12%;
}
	#point03 ul li .img {
    width: 100%;
    padding-top: 30px;
	text-align: right;
}
	#point03 ul li .txt {
		width: 85%;
		font-size: 13px;
	}
	#point03 ul li .txt h3 {
		font-size: 17px;
		padding-bottom: 28px;
	}
	#point03 ul li .txt h3 small{
	display: block;
	}
}


/*作成のポイント*/
#point04 {
	padding: 40px 0;
}
#point04 ul {
	max-width: 950px;
	margin: 0 auto;
}
#point04 ul li {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
	padding: 50px;
	position: relative;
	border: 3px dotted #aaaab0;
	border-radius: 5px;
	margin-bottom: 50px;
	font-size: 15px;
}
#point04 ul li:first-child:before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 234px;
    height: 87px;
    background: url(../img/point/ttlMake01.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point04 ul li:nth-child(2):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 234px;
    height: 87px;
    background: url(../img/point/ttlMake02.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point04 ul li:nth-child(3):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 234px;
    height: 87px;
    background: url(../img/point/ttlMake03.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point04 ul li .txt {
	width: 65%;
	padding-right: 50px;
	padding-top: 80px;
	border-right: 3px dotted #aaaab0;
}
#point04 ul li h4 {
	font-size: 18px;
	font-weight: bold;
	padding-bottom: 10px;
}
#point04 ul li p span{
	color: #dd0000;
}
#point04 ul li .img {
	width: 28%;
	padding-top: 30px;
}
@media screen and (min-width: 768px) {

	#point04 .flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
}
}
@media screen and (max-width: 767px) {
	#point04 {
		padding: 30px 0;
	}
	#point04 ul {
		padding: 0 15px;
	}
	
	#point04 ul li {
		display: block;
		width: 100%;
		padding: 30px;
		margin-bottom: 30px;
	}
	#point04 ul li .txt {
		width: 100%;
		padding: 0;
		border: none;
		padding-bottom: 10px;
		padding-top: 60px;
		font-size: 13px;
	}
	#point04 ul li .img {
		width: 100%;
		padding: 0;
		border: none;
		text-align: center;
	}
	#point04 ul li:first-child:before {
		width: 50%;
		left: -22px;
		top: -9px;
	}
	#point04 ul li:nth-child(2):before {
		width: 50%;
		left: -22px;
		top: -9px;
	}
	#point04 ul li:nth-child(3):before {
		width: 50%;
		left: -22px;
		top: -9px;
	}

}

/*デザインのポイント*/

#point05 {
	padding: 40px 0;
}
#point05 h2 span {
	display: block;
	font-size: 25px;
	font-weight: normal;
}
#point05 ul {
	max-width: 950px;
	margin: 0 auto;
}
#point05 ul li {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
	padding: 50px;
	position: relative;
	border: 3px dotted #aaaab0;
	border-radius: 5px;
	margin-bottom: 50px;
	font-size: 15px;
}
#point05 ul li:first-child:before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 323px;
    height: 87px;
    background: url(../img/point/ttlDesign01.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point05 ul li:nth-child(2):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 323px;
    height: 87px;
    background: url(../img/point/ttlDesign02.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point05 ul li:nth-child(3):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 323px;
    height: 87px;
    background: url(../img/point/ttlDesign03.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point05 ul li:nth-child(4):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 323px;
    height: 87px;
    background: url(../img/point/ttlDesign04.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point05 ul li .txt {
	width: 65%;
	padding-right: 50px;
	padding-top: 80px;
	border-right: 3px dotted #aaaab0;
}
#point05 ul li h4 {
	font-size: 18px;
	font-weight: bold;
	padding-bottom: 10px;
}
#point05 ul li p span{
	color: #dd0000;
}
#point05 ul li .img {
	width: 28%;
	padding-top: 30px;
}
@media screen and (min-width: 768px) {

	#point05 .flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
}
}
@media screen and (max-width: 767px) {
	#point05 {
		padding: 30px 0;
	}
	#point05 h2 span {
		font-size: 20px;
	}
	#point05 ul {
		padding: 0 15px;
	}
	
	#point05 ul li {
		display: block;
		width: 100%;
		padding: 30px;
		margin-bottom: 30px;
	}
	#point05 ul li .txt {
		width: 100%;
		padding: 0;
		border: none;
		padding-bottom: 10px;
		padding-top: 60px;
		font-size: 13px;
	}
	#point05 ul li .img {
		width: 100%;
		padding: 0;
		border: none;
		text-align: center;
	}
	#point05 ul li:first-child:before {
		width: 71%;
		left: -22px;
		top: -9px;
	}
	#point05 ul li:nth-child(2):before {
		width: 71%;
		left: -22px;
		top: -9px;
	}
	#point05 ul li:nth-child(3):before {
		width: 71%;
		left: -22px;
		top: -9px;
	}
	#point05 ul li:nth-child(4):before {
		width: 71%;
		left: -22px;
		top: -9px;
	}

}

/*デザインのポイント【カタログ】*/

#point05Cat {
	padding: 40px 0;
}
#point05Cat h2 span {
	display: block;
	font-size: 25px;
	font-weight: normal;
}
#point05Cat ul {
	max-width: 950px;
	margin: 0 auto;
}
#point05Cat ul li {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
	padding: 50px;
	position: relative;
	border: 3px dotted #aaaab0;
	border-radius: 5px;
	margin-bottom: 50px;
	font-size: 15px;
}
#point05Cat ul li:first-child:before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 438px;
    height: 87px;
    background: url(../img/point/ttlCatDesign01.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point05Cat ul li:nth-child(2):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 438px;
    height: 87px;
    background: url(../img/point/ttlCatDesign02.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point05Cat ul li:nth-child(3):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 438px;
    height: 87px;
    background: url(../img/point/ttlCatDesign03.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}

#point05Cat ul li .txt {
	width: 65%;
	padding-right: 50px;
	padding-top: 80px;
	border-right: 3px dotted #aaaab0;
}
#point05Cat ul li h4 {
	font-size: 18px;
	font-weight: bold;
	padding-bottom: 10px;
}
#point05Cat ul li p span{
	color: #dd0000;
}
#point05Cat ul li .img {
	width: 28%;
	padding-top: 30px;
}
@media screen and (min-width: 768px) {

	#point05Cat .flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
	}
}
@media screen and (max-width: 767px) {
	#point05Cat {
		padding: 30px 0;
	}
	#point05Cat h2 span {
		font-size: 20px;
	}
	#point05Cat ul {
		padding: 0 15px;
	}
	
	#point05Cat ul li {
		display: block;
		width: 100%;
		padding: 30px;
		margin-bottom: 30px;
	}
	#point05Cat ul li .txt {
		width: 100%;
		padding: 0;
		border: none;
		padding-bottom: 10px;
		padding-top: 60px;
		font-size: 13px;
	}
	#point05Cat ul li .img {
		width: 100%;
		padding: 0;
		border: none;
		text-align: center;
	}
	#point05Cat ul li:first-child:before {
		width: 85%;
		left: -22px;
		top: -9px;
	}
	#point05Cat ul li:nth-child(2):before {
		width: 85%;
		left: -22px;
		top: -9px;
	}
	#point05Cat ul li:nth-child(3):before {
		width: 85%;
		left: -22px;
		top: -9px;
	}

}

/*デザインのポイント【チラシ】*/

#point05Fly {
	padding: 40px 0;
}
#point05Fly h2 span {
	display: block;
	font-size: 25px;
	font-weight: normal;
}
#point05Fly ul {
	max-width: 950px;
	margin: 0 auto;
}
#point05Fly ul li {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
	padding: 50px;
	position: relative;
	border: 3px dotted #aaaab0;
	border-radius: 5px;
	margin-bottom: 50px;
	font-size: 15px;
}
#point05Fly ul li:first-child:before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 468px;
    height: 87px;
    background: url(../img/point/ttlFlyDesign01.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point05Fly ul li:nth-child(2):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 468px;
    height: 87px;
    background: url(../img/point/ttlFlyDesign02.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point05Fly ul li:nth-child(3):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 468px;
    height: 87px;
    background: url(../img/point/ttlFlyDesign03.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}

#point05Fly ul li .txt {
	width: 65%;
	padding-right: 50px;
	padding-top: 80px;
	border-right: 3px dotted #aaaab0;
}
#point05Fly ul li h4 {
	font-size: 18px;
	font-weight: bold;
	padding-bottom: 10px;
}
#point05Fly ul li p span{
	color: #dd0000;
}
#point05Fly ul li .img {
	width: 28%;
	padding-top: 30px;
}
@media screen and (min-width: 768px) {

	#point05Fly .flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
	}
}
@media screen and (max-width: 767px) {
	#point05Fly {
		padding: 30px 0;
	}
	#point05Fly h2 span {
		font-size: 20px;
	}
	#point05Fly ul {
		padding: 0 15px;
	}
	
	#point05Fly ul li {
		display: block;
		width: 100%;
		padding: 30px;
		margin-bottom: 30px;
	}
	#point05Fly ul li .txt {
		width: 100%;
		padding: 0;
		border: none;
		padding-bottom: 10px;
		padding-top: 60px;
		font-size: 13px;
	}
	#point05Fly ul li .img {
		width: 100%;
		padding: 0;
		border: none;
		text-align: center;
	}
	#point05Fly ul li:first-child:before {
		width: 85%;
		left: -22px;
		top: -9px;
	}
	#point05Fly ul li:nth-child(2):before {
		width: 85%;
		left: -22px;
		top: -9px;
	}
	#point05Fly ul li:nth-child(3):before {
		width: 85%;
		left: -22px;
		top: -9px;
	}

}

/*デザインのポイント【DM】*/

#point05DM {
	padding: 40px 0;
}
#point05DM h2 span {
	display: block;
	font-size: 25px;
	font-weight: normal;
}
#point05DM ul {
	max-width: 950px;
	margin: 0 auto;
}
#point05DM ul li {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
	padding: 50px;
	position: relative;
	border: 3px dotted #aaaab0;
	border-radius: 5px;
	margin-bottom: 50px;
	font-size: 15px;
}
#point05DM ul li:first-child:before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 468px;
    height: 87px;
    background: url(../img/point/ttlDmDesign01.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point05DM ul li:nth-child(2):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 468px;
    height: 87px;
    background: url(../img/point/ttlDmDesign02.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}
#point05DM ul li:nth-child(3):before {
	position: absolute;
    top: 30px;
    left: -30px;
    content: "";
    width: 468px;
    height: 87px;
    background: url(../img/point/ttlFlyDesign03.png) no-repeat 0 100%;
    background-size: contain;
    z-index: 1;	
}

#point05DM ul li .txt {
	width: 65%;
	padding-right: 50px;
	padding-top: 80px;
	border-right: 3px dotted #aaaab0;
}
#point05DM ul li h4 {
	font-size: 18px;
	font-weight: bold;
	padding-bottom: 10px;
}
#point05DM ul li p span{
	color: #dd0000;
}
#point05DM ul li .img {
	width: 28%;
	padding-top: 30px;
}
@media screen and (min-width: 768px) {

	#point05DM .flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
	}
}
@media screen and (max-width: 767px) {
	#point05DM {
		padding: 30px 0;
	}
	#point05DM h2 span {
		font-size: 20px;
	}
	#point05DM ul {
		padding: 0 15px;
	}
	
	#point05DM ul li {
		display: block;
		width: 100%;
		padding: 30px;
		margin-bottom: 30px;
	}
	#point05DM ul li .txt {
		width: 100%;
		padding: 0;
		border: none;
		padding-bottom: 10px;
		padding-top: 60px;
		font-size: 13px;
	}
	#point05DM ul li .img {
		width: 100%;
		padding: 0;
		border: none;
		text-align: center;
	}
	#point05DM ul li:first-child:before {
		width: 85%;
		left: -22px;
		top: -9px;
	}
	#point05DM ul li:nth-child(2):before {
		width: 85%;
		left: -22px;
		top: -9px;
	}
	#point05DM ul li:nth-child(3):before {
		width: 85%;
		left: -22px;
		top: -9px;
	}

}

/*費用について*/
#point06 {
	padding: 40px 0;
}
#point06 .cost-p {
	max-width: 610px;
	margin: 0 auto;
	padding-bottom: 50px;
}
#point06 h3 {
    color: #fff;
    padding: 20px 0 20px 30px;
    font-size: 23px;
    font-weight: bold;
    margin-bottom: 30px;
    letter-spacing: 0.1em;
	width: 390px;
}
#point06 .nakatoji {
	padding-bottom: 80px;
}
#point06 .ori {
	padding-bottom: 80px;
}
#point06 .ori2 {
	padding-bottom: 0;
}
/*#point06 .pocket {
	padding-bottom: 40px;
}*/
#point06 .nakatoji .blue-gra {
	    background: rgb(0,151,201);
    background: linear-gradient(
124deg, rgba(0,151,201,1) 0%, rgba(0,104,183,1) 100%);
}
#point06 .ori .green-gra {
background: rgb(136,215,109);
background: linear-gradient(124deg, rgba(136,215,109,1) 0%, rgba(76,170,85,1) 100%);
}
#point06 .ori2 .green-gra {
background: rgb(136,215,109);
background: linear-gradient(124deg, rgba(136,215,109,1) 0%, rgba(76,170,85,1) 100%);
}
#point06 .pocket .yellow-gra {
background: rgb(246,209,4);
background: linear-gradient(124deg, rgba(253,227,3,1) 0%, rgba(251,181,7,1) 100%);
}
#point06 .cost-wrap {
	max-width: 1020px;
	margin: 0 auto;
}
#point06 .cost-wrap h4 {
	font-size: 23px;
	font-weight: bold;
	padding-bottom: 15px;
	padding-top: 30px;
}
#point06 .cost-wrap h4 span {
	font-size: 20px;
}
#point06 .cost-wrap h4 img {
	vertical-align: middle;
	padding-right: 20px;
}
#point06 .cost-wrap .cost-li {
	padding: 10px;
	border-radius: 5px;
}
#point06 .cost-wrap .blue {
	border: 3px dotted #009cc9;
}
#point06 .cost-wrap .cost-li .img {
	width: 15%;
}
#point06 .cost-wrap .cost-li .cost dl dt {
	font-weight: bold;
}
/*#point06 .cost-wrap .cost-li .cost dl dd .price {
	color: #555557;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.2em;
	padding-right: 10px;
}*/
#point06 .cost-wrap .cost-li .cost dl dd .price {
color: #555557;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.4em;
    padding-right: 10px;
	padding-bottom: 10px;
}
#point06 .cost-wrap .cost-li .cost dl dd .price span {
	font-size: 15px;
	display: block;
}
#point06 .cost-wrap .cost-li .cost dl dd .red {
	color: #dd0000;
	text-align: right;
}
#point06 .cost-wrap .blue .cost dl dd .plus {
	color: #139ec5;
	font-weight: bold;
	font-size: 25px;
}
#point06 .cost-wrap .green .cost dl dd .plus {
	color: #4faa55;
	font-weight: bold;
	font-size: 25px;
}
#point06 .cost-wrap .yellow .cost dl dd .plus {
	color: #e4c02d;
	font-weight: bold;
	font-size: 25px;
}
#point06 .blue-line {
	border: 1px solid #00a8d3;	
	}
#point06 .green-line {
	border: 1px solid #4caa55;	
	}
#point06 .yellow-line {
	border: 1px solid #c29c07;	
	}
#point06 .blue-line th span {
	color: #ffffff;
	font-size: 23px;
	padding-right: 5px;
	}

#point06 .green-line th span {
	color: #ffffff;
	font-size: 23px;
	padding-right: 5px;
	}
#point06 .yellow-line th span {
	color: #bf8200;
	font-size: 23px;
	padding-right: 5px;
	}
#point06 .cost-wrap .green {
    border: 3px dotted #4caa55;
}
#point06 .cost-wrap .yellow {
    border: 3px dotted #e4c02d;
}
#point06 .cost-wrap .blue .cost dl dt{
	background: #139ec5;	
	}
#point06 .cost-wrap .green .cost dl dt{
	background: #4caa55;	
	}
#point06 .cost-wrap .yellow .cost dl dt{
	background: #e4c02d;
	}
#point06 .cost-wrap p{
	text-align: right;
	padding-top: 10px;
}
@media screen and (min-width: 768px) {
#point06 .list {
    width: 100%;
    margin: 0 auto;
    background: #fff;
    border-collapse: collapse;
    margin-top: 60px;
    margin-bottom: 30px;
}
#point06 .blue-line th {
    border-right: 1px solid #00a8d3;
    border-bottom: 1px solid #ffffff;
	background-color: #00a8d3;
	color: #fff;
    width: 33%;
	text-align: left;
    font-weight: bold;
    vertical-align: middle;
    letter-spacing: 0.03em;
	padding-left: 30px;
	font-size: 18px;
}
#point06 .green-line th {
    border-right: 1px solid #4caa55;
    border-bottom: 1px solid #ffffff;
	background-color: #4caa55;
	color: #fff;
    width: 33%;
	text-align: left;
    font-weight: bold;
    vertical-align: middle;
    letter-spacing: 0.03em;
	padding-left: 30px;
	font-size: 18px;
}
#point06 .yellow-line th {
    border-right: 1px solid #c29c07;
    border-bottom: 1px solid #c29c07;
	background-color: #ffd929;
    width: 33%;
	text-align: left;
    font-weight: bold;
    vertical-align: middle;
    letter-spacing: 0.03em;
	padding-left: 30px;
	font-size: 18px;
}
#point06 .blue-line td {
    vertical-align: middle;
    padding: 20px;
    border-bottom: 1px solid #00a8d3;
	text-align: left;
	padding-left: 30px;
	line-height: 1.8em;
}
#point06 .green-line td {
    vertical-align: middle;
    padding: 20px;
    border-bottom: 1px solid #4caa55;
	text-align: left;
	padding-left: 30px;
	line-height: 1.8em;
}
#point06 .yellow-line td {
    vertical-align: middle;
    padding: 20px;
    border-bottom: 1px solid #c29c07;
	text-align: left;
	padding-left: 30px;
	line-height: 1.8em;
}
#point06 .cost-wrap .cost-li {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-around;
    -ms-flex-pack: space-around;
    justify-content: space-around;
	align-items: center;
}
#point06 .cost-wrap .cost-li .cost {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
	width: 85%;
	max-width: 100%;
	padding-right: 10px;
}
#point06 .cost-wrap .cost-li .cost dl dt {
	display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;
    height: 40px;
    padding: 5px 10px;
    position: relative;
    margin: 0 0 20px;
	width: 258px;
}

#point06 .cost-wrap .cost-li .cost dl .first {
		width: 300px;
	}
	#point06 .cost-wrap .cost-li .cost dl .first-siyou {
		width: 605px;
	}
#point06 .cost-wrap .cost-li .cost dl .total {
		width: 150px;
	}
#point06 .cost-wrap .blue .cost dl .bkallow:before {
    content: "";
    position: absolute;
    top: 50%;
    border: 0 solid #139ec5;
    border-width: 20px 20px;
    width: 0;
    height: 0;
    left: -28px;
    border-left-color: transparent;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
	z-index: -10;
}
#point06 .cost-wrap .green .cost dl .bkallow:before {
    content: "";
    position: absolute;
    top: 50%;
    border: 0 solid #4faa55;
    border-width: 20px 20px;
    width: 0;
    height: 0;
    left: -28px;
    border-left-color: transparent;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
	z-index: -10;
}
#point06 .cost-wrap .yellow .cost dl .bkallow:before {
    content: "";
    position: absolute;
    top: 50%;
    border: 0 solid #e4c02d;
    border-width: 20px 20px;
    width: 0;
    height: 0;
    left: -28px;
    border-left-color: transparent;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
	z-index: -10;
}
#point06 .cost-wrap .cost-li .cost dl .total:before {
	left: -40px;	
	}
#point06 .cost-wrap .cost-li .cost dl .front:after {
    content: " ";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 0 20px 20px;
    position: absolute;
    right: -20px;
    top: 0;
}
#point06 .cost-wrap .blue .cost dl .front:after {
	border-color: transparent transparent transparent #139ec5;	
	}
#point06 .cost-wrap .green .cost dl .front:after {
	border-color: transparent transparent transparent #4faa55;	
	}
#point06 .cost-wrap .yellow .cost dl .front:after {
	border-color: transparent transparent transparent #e4c02d;	
	}

#point06 .cost-wrap .cost-li .cost dl .add {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-around;
    -ms-flex-pack: space-around;
    justify-content: space-around;
	align-items: center;
	}
#point06 .cost-wrap .cost-li .cost dl .lastAllow {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	}
#point06 .cost-wrap .cost-li .cost dl .lastAllow img {
	padding-left: 15px;	
	}
}
@media screen and (max-width: 767px) {
#point06 {
	padding: 30px 0;
	}
#point06 h3 {
	width: 100%;
	padding: 15px;
	text-align: center;
	font-size: 20px;
	}
#point06 .cost-wrap h4 {
	font-size: 17px;
	}
#point06 .cost-wrap .cost-li {
	text-align: center;
	}
#point06 .cost-wrap .cost-li .img {
	width: 100%;
	padding-bottom: 10px;
		
	}
#point06 .cost-wrap .cost-li .cost dl dt {
    color: #fff;
    padding: 5px 10px;
    position: relative;
    margin: 0 0 15px;
}
#point06 .cost-wrap .blue .cost dl dt {
	background: #139ec5;	
	}
#point06 .cost-wrap .green .cost dl dt {
	background: #4faa55;	
	}
#point06 .cost-wrap .yellow .cost dl dt {
	background: #e4c02d;	
	}
#point06 .cost-wrap .cost-li .cost dl dd .equal {
		transform:rotate(90deg);
	}
#point06 .cost-wrap .cost-li .cost dl dd .plus {
		font-size: 20px;
	}
	#point06 .cost-wrap .cost-li .cost dl dd .red {
		text-align: center;
	}
	
#point06 .cost-wrap .blue-line {
    width: 100%;
    margin: 0 auto;
    border-collapse: collapse;
    border: 1px solid #00a8d3;
    margin-top: 30px;
    margin-bottom: 30px;
}
#point06 .cost-wrap .green-line {
    width: 100%;
    margin: 0 auto;
    border-collapse: collapse;
    border: 1px solid #4caa55;
    margin-top: 30px;
    margin-bottom: 30px;
}
#point06 .cost-wrap .yellow-line {
    width: 100%;
    margin: 0 auto;
    border-collapse: collapse;
    border: 1px solid #c29c07;
    margin-top: 30px;
    margin-bottom: 30px;
}
#point06 .list th {
	width: 100%;
    display: block;
	padding: 10px;
	}
#point06 .list td {
    vertical-align: middle;
    padding: 10px;
    text-align: center;
    display: block;
}
#point06 .pocket {
	padding-bottom: 10px;
}
#point06 .blue-line th,#point06 .blue-line td {
	border-bottom: 1px solid #00a8d3;
	font-size: 13px;
	text-align: left;
	}
#point06 .green-line th,#point06 .green-line td {
	border-bottom: 1px solid #4caa55;
	font-size: 13px;
	text-align: left;
	}
#point06 .yellow-line th,#point06 .yellow-line td {
	border-bottom: 1px solid #c29c07;
	font-size: 13px;
	text-align: left;
	}
#point06 .list th span {
	font-size: 20px;
	padding-right: 0;
	color: #fff;
	}

#point06 .blue-line th {
	background: #00a8d3;
	color: #fff;
}
#point06 .green-line th {
	background: #4caa55;
	color: #fff;
}
#point06 .yellow-line th {
	background: #e4bf2d;
	color: #fff;
}
}

/*オプション*/
#point07 { padding: 40px 0 80px; }
#point07 table { width:100%; }
#point07 table td { padding: 25px; border: 1px solid #00a8d3; }
#point07 table th { padding: 25px; border: 1px solid #00a8d3; background-color: #00a8d3; color:#fff; }
#point07 table td:first-child{ font-weight: bold; width:250px; background-color: #caf3ff; }
#point07 table td:nth-child(2){ width:570px; }
#point07 table th:first-child{ border-right: #fff 1px solid; }
#point07 table th:nth-child(2){ border-right: #fff 1px solid; }

@media screen and (max-width: 767px) {
	#point07 { padding: 30px 0; }
	
	.scroll table{
	width:100%;
	}
	.scroll{
	overflow: auto; /*tableをスクロールさせる*/
	white-space: nowrap; /*tableのセル内にある文字の折り返しを禁止*/
	}
	/* 以下、スクロールバーを追加 */
	.scroll::-webkit-scrollbar{　　
	 height: 10px;
	}
	.scroll::-webkit-scrollbar-track{
	 background: #333;
	}
	.scroll::-webkit-scrollbar-thumb {
	 background: #999;
	}
	#point07 table th { text-align: left; }
	#point07 table td:first-child{ font-size: 14px; }
	#point07 table td { font-size: 13px; }
}



/* =============================================================================

   ========================================================================== */

@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
}
/* =============================================================================

   ========================================================================== */
@media screen and (min-width: 1024px) {
}
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
}