@charset "UTF-8";
/* introduction-of-steam */
h2 {
    font-size: 190%;
    text-align: center;
    font-weight: 500;
    color: #333;
}
h2::after {
    content: "";
    display: block;
    width: 40px;
    height: 1px;
    border-bottom: 2px solid #808080;
    margin: 0.25em auto 1em;
}
.btn-onimage.intro-of-steam{
	height: 20em;
    width: calc(100% - 40px);
	border-radius: 20px;
	padding: 0;
    margin: 0 20px 5em;
}
.btn-onimage.intro-of-steam .background{
	background-image: url(../img/introduction-of-steam_img/intro-to-steam_bg.jpg);
	background-position: center bottom -120px;
}
.btn-onimage.intro-of-steam .contents{
	border: none;
    width: 100%;
    height: 100%;
    padding: 1em
}
.btn-onimage.intro-of-steam .contents a::after{
	content: url(../img/arrow_w.svg);
	display: block;
    width: 12px;
    position: absolute;
    right: 3em;
	top: 50%;
}
.btn-onimage .contents a {
    padding: 0 10%;
}
.s_basic_index{
	display: flex;
	justify-content: space-between;
}
.index_title{
	border-left: 6px solid #3ca062;
    margin-bottom: 20px;
    padding-left: 1em;
    height: 60px;
    display: flex;
    align-items: center;
}
.s_basic_index ul{
	width: 290px;
	margin-bottom: 4em
}
.s_basic_index ul + ul {
	margin-left: 1em;
}
.s_basic_index ul li{
	border-bottom: 1px dotted #707070;
	padding-bottom: 0.8em;
    margin-bottom: 0.8em;
}
.s_basic_index ul li:last-child{
	border-bottom: none;
}
.s_basic_index ul li a{
	position: relative;
	display: block;
	cursor: pointer;
}
.s_basic_index ul li a::after{
    content: url(../img/arrow.svg);
    display: inline-block;
    width: 6px;
    margin: 0 0.5em 0.25em 0;
	position: absolute;
	right: 0;
}


@media screen and (min-width: 1040px) {
    .btn-onimage.intro-of-steam{
        margin: 0 auto 5em;
    }
}
@media screen and (max-width: 767px) {
	.btn-onimage.intro-of-steam {
		height: 10em;
	}
	.btn-onimage .contents a h2 {
		margin: auto;
        font-size: 170%;
	}
	.btn-onimage.intro-of-steam .contents a::after {
		top: 45%;
		right: 2%;
	}
	.s_basic_index {
    display: block;
    justify-content: center;
	}
	.s_basic_index ul {
		width: 100%;
	}
    .s_basic_index ul + ul {
        margin-left: 0;
    }
}