@charset "UTF-8";

/* プラン */
#plan-btn{
	font-size:0;
	display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}
#plan-btn ul.cap{
	font-size:0;
	line-height:0;
	width:100%;
	text-align:center;
	padding-top:15px;
}
#plan-btn ul.cap li{
	font-size:1.2rem;
	line-height:160%;
}
@media (min-width: 568px) {
	#plan-btn ul.cap{
		padding-top:20px;
	}
	#plan-btn ul.cap li{
		display:inline-block;
		padding:0 10px;
	}
}

.plan-btn{
	margin-top:30px;
}
.plan-btn#one{
	margin-top:0;
}
@media (min-width: 568px) {
	.plan-btn{
		display:inline-block;
		vertical-align:top;
		width:calc(50% - 15px);
		display:-webkit-box;
    	display:-moz-box;
    	display:-ms-box;
    	display:-webkit-flexbox;
    	display:-moz-flexbox;
    	display:-ms-flexbox;
    	display:-webkit-flex;
    	display:-moz-flex;
    	display:-ms-flex;
    	display:flex;
    	-webkit-box-lines:multiple;
    	-moz-box-lines:multiple;
    	-webkit-flex-wrap:wrap;
    	-moz-flex-wrap:wrap;
    	-ms-flex-wrap:wrap;
    	flex-wrap:wrap;
		flex-direction:column;
	}
	.plan-btn#two{
		margin-top:0;
	}
	.plan-btn#one,
	.plan-btn#three{
		margin-right:30px;
	}
}
@media (min-width: 768px) {
	.plan-btn{
		margin-top:;
	}
}
@media (min-width: 1024px) {
	.plan-btn{
		width:calc(33.333% - 20px);
		margin-right:30px;
	}
	.plan-btn#one{
		margin-right:30px;
	}
	.plan-btn#three{
		margin-top:0;
		margin-right:0;
	}
}

.plan-btn dl{
	font-size:0;
}
.plan-btn dl.nobe{
	padding-bottom:15px;
}
.plan-btn dl dt{
	display:inline-block;
	vertical-align:top;
	width:65px;
	font-size:1.3rem;
	line-height:180%;
}
.plan-btn dl dd{
	display:inline-block;
	vertical-align:top;
	width:calc(100% - 65px);
	font-size:1.3rem;
	line-height:180%;
}
.white{
	color:#FFF;
}

.plan-title{
	border-top:2px solid #333;
	border-bottom:2px solid #333;
	padding:13px 0;
	margin-bottom:13px;
}
.plan-title h3{
	font-family:'Open Sans';
	font-weight:600;
	font-size:2.5rem;
	line-height:100%;
	padding-bottom:10px;
}
.plan-title h4{
	font-family:'Open Sans';
	font-weight:600;
	font-size:2.0rem;
	line-height:100%;
}
@media (min-width: 768px) {
	.plan-title h3{
		font-size:2.6rem;
	}
	.plan-title h4{
		font-size:2.1rem;
	}
}
@media (min-width: 1024px) {
	.plan-title h3{
		font-size:2.7rem;
	}
	.plan-title h4{
		font-size:2.2rem;
	}
}

.learnmore{
	position:relative;
}
.learnmore a{
	display:block;
	color:#FFF;
}
.learnmore-moji{
	position:absolute;
	top:5px;
	left:10px;
	font-family:'Open Sans';
	font-weight:300;
	font-size:1.5rem;
}
.learnmore-moji::before{
	content:"";
	display:block;
	position:absolute;
	top:0;
	bottom:0;
	left:100px;
	margin:auto;
	width:80px;
	height:1px;
	background:#FFF;
	transition:.3s;
}
.learnmore-moji::after{
	content:"";
	display:block;
	position:absolute;
	top:0;
	bottom:0;
	left:170px;
	margin:auto;
	width:8px;
	height:8px;
	border-left:1px solid #FFF;
	border-bottom:1px solid #FFF;
	transform:rotate(-135deg);
	transition:.3s;
}
.learnmore a:hover .learnmore-moji::before{
	width:150px;
}
.learnmore a:hover .learnmore-moji::after{
	left:240px;
}
@media (min-width: 568px) {
	.learnmore{
		margin-top:auto;
	}
}

#footer{
	background-color:none;
}