@charset "UTF-8";
/* CSS Document */

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

.tac {
	text-align: center !important;
}

.l-container--tiny {
	max-width: 810px;
	margin: 0 auto;
}

/**************** title ****************/
h2 {
	padding: 15px;
	margin: 60px 0 20px;
	text-align: center;
	font-size: 2.8rem;
	font-weight: 300;
	background: #eee;
}
.sub-title {
	padding: 30px 0 50px;
	font-size: 2.8rem;
	text-align: center;
}
.child-title {
	padding: 30px 0 50px;
	font-size: 2.2rem;
	text-align: center;
}
@media screen and (max-width:768px) {
	h2 {
		padding: 8px;
	}
	.sub-title {
		font-size: 2.0rem;
		padding: 30px 0 0;
	}
}

/**************** btn ****************/
ul.btn {
	display: flex;
}
ul.btn li {
	width: 100%;
	margin-right: 10px;
}
ul.btn li:last-child {
	margin-right: 0;
}
@media screen and (max-width:768px) {
	ul.btn {
		flex-wrap: wrap;
	}
	ul.btn li {
		flex: 0 0 47.1%;
		max-width: 47.1%;
	}
}

.btn a {
	position: relative;
	display: block;
	width: 100%;
	max-width: 510px;
	padding: 15px 10px;
	margin: 30px auto 0;
	background: #fff;
	border: 1px solid #bfbfbf;
	text-align: center;
	box-sizing: border-box;
}
.btn a:after {
	content: '';
    display: inline-block;
    position: absolute;
    right: 15px;
    top: 50%;
    width: 6px;
    height: 9px;
    margin-top: -5px;
    background: url(../images/i_arrow.png) center center/100% auto no-repeat;
}
.btn.internal a:after {
	transform: rotate(90deg);
}
.btn a:hover {
	opacity: 0.6;
}
@media screen and (max-width:768px) {
	.btn a {
		max-width: 320px;
		padding: 15px;
		margin: 50px auto 0;
	}
	ul.btn li a {
		margin: 10px auto 0;
	}
}

/**************** description ****************/
.description {
	padding-top: 30px;
	font-size: 1.4rem;
	text-align: center;
}
.description::after {
	content: url("../images/arrow.png");
	display: block;
	margin: 40px;
	text-align: center;
}
.description.last::after {
	content: none;
}
@media screen and (max-width:768px) {
	.description {
		font-size: 1.6rem;
	}
}

/**************** other ****************/
.box {
	padding-bottom: 100px;
}
.box.last {
	padding-bottom: 0;
}
.number {
	display: block;
	padding: 15px;
	margin: 40px auto 0;
	width: 36px;
	border: 1px solid #000;
}
@media screen and (max-width:768px) {
	.box img {
		max-width: 150px;
		margin: 40px auto 0;
	}
}