@charset "utf-8";

section#studio {
	width: 100%;
	margin: auto;
	padding-top: 120px;
}

/* スタジオ */
.studio-box {
    max-width: 1144px;
    width: 95%;
    margin: 0px auto 0;
    overflow: hidden;
    padding: 60px 0 0 0;
}
.s-line{
	padding:60px 0 0 0;
}
.studio-box .studio-back{
	width: 100%;
    height: 100%;
    background: #f7f7f7;
}
.studio-inner {
    padding: 4%;
	margin-top: 60px;
}
.studio-inner.s01 {
    padding: 4% 4% 15% 4%;
}
.studio-inner.s02 {
    padding: 4% 4% 22% 4%;
}

p.studio-detail {
    padding: 3% 0 1% 0;
	color:#181818;
}

.studio-name img {
    display: block;
    margin: 0 auto;
}

.studio-inner ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.studio-inner ul li,.studio-inner ul li a{
    padding: 0;
    list-style-position: outside;
	color:#181818;
    margin: 0 auto 10px;
}

span.text-middle {
  vertical-align: sub;
}

.s-mark {
    width: 26px;
    height: 26px;
    text-align: center;
    background: #ff0004;
    color: #ffff;
    border-radius: 50%;
    font-size: 16.5px;
    padding: 5px 3px;
    margin: 0 10px 0 2px;
}


.button {
    display: block;
    width: 100%;
    text-align: center;
    margin: 5% auto 0;
    font-size: 100%;
    padding: 3px;
    color: #ff0004;
    border: 1px solid #ff0004;
    box-sizing: border-box;
    background: rgba(255, 0, 4, 0);
    transition: .3s;
    -webkit-transition: .3s;
}

.button:hover {
    background: rgba(255, 0, 4, 1);
	color:#fff;
}

.bg-have{
	background: #e2e0e0;
    margin: 40px 0;
    width: 100%;
    padding: 40px 2.5%;
}

.bg-have .studio-box:nth-child(1) {
    padding: 0;
}

.bg-have .studio-back{
	background: #ff0004;
}

.bg-have h4.studio-name, .bg-have p.studio-detail, .bg-have .studio-inner ul li.location, .bg-have .studio-inner ul li, .bg-have .studio-inner ul li a{
	color: #fff;
}

.bg-have .s-mark {
    background: #fff;
    color: #ff0004;
    font-size: 15px;
}

.bg-have .button {
    color: #fff;
    border: 1px solid #fff;
}
.bg-have .button:hover {
    color: #ff0004;
    background: #fff;
}
@media screen and (max-width: 991px){
section#studio {
	padding-top: 70px;
}
}

@media screen and (max-width: 767px){
.studio-inner {
	margin-top: 0;
}

}


}