@charset "utf-8";

@media screen and (max-width: 768px){
	main{
		padding-bottom: 0;
	}
	.slogan{
		width: 100%;
		position: relative;
	}
	.slogan .inner-content{
		width: 100%;
		position: relative;
	}
	.slogan .inner-content h2{
		width: 100%;
		position: relative;
	}
	.slogan .inner-content img{
		width: 100%;
		vertical-align: bottom;
	}
	.wrap-message{
		width: 100%;
        margin: 16vw 0 0 0;
		position: relative;
	}
	.wrap-message .inner-content{
		width: 100%;
		display: block;
	}
	.wrap-message .inner-content .left{
        width: 100%;
        position: relative;
        text-align: left;
	}
	.wrap-message .inner-content .left .ttl{
        width: 100%;
        position: relative;
        padding: 0 4vw 4vw 4vw;
	}
	.wrap-message .inner-content .left .ttl::before{
        display: block;
        content: "";
        width: 1px;
        height: 17vw;
        background-color: #000;
        position: absolute;
        left: 9.6vw;
        top: 1vw;
	}
	.wrap-message .inner-content .left .ttl::after{
        display: block;
        content: "";
        width: 1px;
        height: 20vw;
        background-color: #000;
        position: absolute;
        left: 8vw;
        top: 3.6vw;
	}
	.wrap-message .inner-content .left .ttl h3{
        display: inline-block;
        font-size: 8vw;
        padding: 0 1vw 0 8.8vw;
        border-bottom: solid 1px #000;
	}
	.wrap-message .inner-content .left .ttl h4{
        font-size: 3.4vw;
        padding: 0 0 0 8.8vw;
        margin: 1vw 0 0 0.2vw;
	}
	.wrap-message .inner-content .left .detail{
		width: 100%;
		padding: 0 0 16vw 0;
        position: relative;
	}
	.wrap-message .inner-content .left .detail p{
        font-size: 3.6vw;
        padding: 0 6vw 0 13vw;
        margin: 0 0 3vw 0;
        text-align: left;
        line-height: 1.6em;
	}
	.wrap-message .inner-content .left .detail img{
		width: 100%;
	}
	.wrap-message .inner-content .left .detail > a{
		display: block;
		width: 70%;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
	}
	.wrap-message .inner-content .left .detail > a > span{
		display: block;
		width: 100%;
		text-align: center;
		font-size: 20px;
		padding: 6px 1.4vw 6px 1.4vw;
		border-radius: 100px;
	}
	.wrap-message .inner-content .left .detail > a.btn-black > span{
		color: #fff;
		background: url(/common/img/btn_ar.png) no-repeat center center;
		background-size: 38px auto;
		background-position: center left;
		background-color: #000;
		border: solid 2px #000;
		transition: background-color 0.2s, color 0.2s;
	}
	.notouch .wrap-message .inner-content .left .detail > a.btn-black:hover > span{
		background: url(/common/img/btn_ar_black_on.png) no-repeat center center;
		background-size: 38px auto;
		background-position: center left;
		color: #000;
		background-color: #fff;
		border: solid 2px #000;
	}
	.wrap-service{
		width: 100%;
        margin: 20vw 0 0 0;
		position: relative;
	}
	.wrap-service .inner-content{
		width: 100%;
		display: block;
	}
	.wrap-service .inner-content .left{
        width: 100%;
        position: relative;
        text-align: left;
	}
	.wrap-service .inner-content .left .ttl{
        width: 100%;
        position: relative;
        padding: 0 4vw 4vw 4vw;
	}
	.wrap-service .inner-content .left .ttl::before{
        display: block;
        content: "";
        width: 1px;
        height: 11vw;
        background-color: #000;
        position: absolute;
        left: 9.6vw;
        top: 1vw;
	}
	.wrap-service .inner-content .left .ttl::after{
        display: block;
        content: "";
        width: 1px;
        height: 20vw;
        background-color: #000;
        position: absolute;
        left: 8vw;
        top: 3.6vw;
	}
	.wrap-service .inner-content .left .ttl h3{
        display: inline-block;
        font-size: 8vw;
        padding: 0 1vw 0 8.8vw;
        border-bottom: solid 1px #000;
	}
	.wrap-service .inner-content .left .ttl h4{
        font-size: 3.4vw;
        padding: 0 0 0 8.8vw;
        margin: 1vw 0 0 0.2vw;
	}
	.wrap-service .inner-content .left .detail{
		width: 100%;
        padding: 0 0 95vw 0;
        position: relative;
	}
	.wrap-service .inner-content .left .detail .frame{
	    width: 100%;
		position: absolute;
		top: 33vw;
		left: 50%;
		transform: translateX(-50%);
	}
	.wrap-service .inner-content .left .detail p{
        font-size: 3.6vw;
        padding: 0 6vw 0 13vw;
        margin: 0 0 10vw 0;
        text-align: left;
        line-height: 1.6em;
	}
	.wrap-service .inner-content .left .detail img{
		width: 100%;
	}
	.wrap-service .inner-content .left .detail > a{
		display: block;
		width: 70%;
		
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
	}
	.wrap-service .inner-content .left .detail > a > span{
		display: block;
		width: 100%;
		text-align: center;
		font-size: 20px;
		padding: 6px 1.4vw 6px 1.4vw;
		border-radius: 100px;
	}
	.wrap-service .inner-content .left .detail > a.btn-black > span{
		color: #fff;
		background: url(/common/img/btn_ar.png) no-repeat center center;
		background-size: 38px auto;
		background-position: center left;
		background-color: #000;
		border: solid 2px #000;
		transition: background-color 0.2s, color 0.2s;
	}
	.notouch .wrap-service .inner-content .left .detail > a.btn-black:hover > span{
		background: url(/common/img/btn_ar_black_on.png) no-repeat center center;
		background-size: 38px auto;
		background-position: center left;
		color: #000;
		background-color: #fff;
		border: solid 2px #000;
	}
	.wrap-works{
		width: 100%;
        margin: 20vw 0 0 0;
		position: relative;
	}
	.wrap-works .inner-content{
		width: 100%;
		display: block;
	}
	.wrap-works .inner-content .left{
        width: 100%;
        position: relative;
        text-align: left;
	}
	.wrap-works .inner-content .left .ttl{
        width: 100%;
        position: relative;
        padding: 0 4vw 4vw 4vw;
	}
	.wrap-works .inner-content .left .ttl::before{
        display: block;
        content: "";
        width: 1px;
        height: 11vw;
        background-color: #000;
        position: absolute;
        left: 9.6vw;
        top: 1vw;
	}
	.wrap-works .inner-content .left .ttl::after{
        display: block;
        content: "";
        width: 1px;
        height: 20vw;
        background-color: #000;
        position: absolute;
        left: 8vw;
        top: 3.6vw;
	}
	.wrap-works .inner-content .left .ttl h3{
        display: inline-block;
        font-size: 8vw;
        padding: 0 1vw 0 8.8vw;
        border-bottom: solid 1px #000;
	}
	.wrap-works .inner-content .left .ttl h4{
        font-size: 3.4vw;
        padding: 0 0 0 8.8vw;
        margin: 1vw 0 0 0.2vw;
	}
	.wrap-works .inner-content .left .detail{
		width: 100%;
        padding: 0 0 22vw 0;
        position: relative;
	}
	.wrap-works .inner-content .left .detail > p{
        font-size: 3.6vw;
        padding: 0 6vw 0 13vw;
        margin: 0 0 7vw 0;
        text-align: left;
        line-height: 1.6em;
	}
	.wrap-works .inner-content .left .detail .detail-list{
		width: 100%;
		margin: 2vw 0 0 0;
		padding: 6vw 5vw 10vw 5vw;
		position: relative;
	}
	.wrap-works .inner-content .left .detail .detail-list::after{
        width: 90%;
        height: 100%;
        display: block;
        content: "";
        background-color: #000;
        position: absolute;
        top: 0;
        left: 50%;
        z-index: 1;
        transform: translateX(-50%);
	}
	.wrap-works .inner-content .left .detail .detail-list > img{
		width: 33vw;
        position: absolute;
        top: -11vw;
        right: 0;
        z-index: 10;
	}
	.wrap-works .inner-content .left .detail .detail-list ul{
        display: block;
        width: 78%;
        list-style: none;
        font-size: 0;
        position: relative;
        margin: 0 auto;
        z-index: 40;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li{
        display: block;
        width: 100%;
        margin: 6vw 0 0 0;
        vertical-align: top;
        position: relative;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li:nth-of-type(1){
		margin-top: 0;	
	}
	.wrap-works .inner-content .left .detail .detail-list ul li > span{
		display: block;
		text-align: center;
		position: relative;
		z-index: 40;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li > span > span{
		font-size: 10vw;
        color: #fff;
		line-height: 1em;
        font-family: "Montserrat", sans-serif;
        font-optical-sizing: auto;
        font-weight: 500;
        font-style: italic;
        background-color: #000;
        position: relative;
        z-index: 40;
        padding: 0 2vw 0 2vw;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li > span::after{
		width: 100%;
		height: 2px;
		display: block;
		background-color: #fff;
		content: "";
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
		z-index: 10;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li h4{
		color: #fff;
		font-size: 4.4vw;
		text-align: center;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li p{
        width: 100%;
        color: #fff;
        font-size: 3.4vw;
        margin: 1vw 0 3vw 0;
        text-align: center;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li img{
		width: 100%;
	}
	.wrap-works .inner-content .left .detail > a{
		display: block;
		width: 70%;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
	}
	.wrap-works .inner-content .left .detail > a > span{
		display: block;
		width: 100%;
		text-align: center;
		font-size: 20px;
		padding: 6px 1.4vw 6px 1.4vw;
		border-radius: 100px;
	}
	.wrap-works .inner-content .left .detail > a.btn-black > span{
		color: #fff;
		background: url(/common/img/btn_ar.png) no-repeat center center;
		background-size: 38px auto;
		background-position: center left;
		background-color: #000;
		border: solid 2px #000;
		transition: background-color 0.2s, color 0.2s;
	}
	.notouch .wrap-works .inner-content .left .detail > a.btn-black:hover > span{
		background: url(/common/img/btn_ar_black_on.png) no-repeat center center;
		background-size: 38px auto;
		background-position: center left;
		color: #000;
		background-color: #fff;
		border: solid 2px #000;
	}
	.wrap-company{
		width: 100%;
		background-color: #000;
        margin: 20vw 0 0 0;
		padding: 8vw 0 16vw 0;
		position: relative;
		background-image: url("../img/wrap-compnay-bg1-sp.png"), url("../img/wrap-compnay-bg2-sp.png");
		background-repeat: no-repeat, no-repeat;
		background-size: 100% auto, 100% auto;
		background-position: left top, left bottom;
	}
	.wrap-company .inner-content{
		width: 100%;
		display: block;
	}
	.wrap-company .inner-content .left{
        width: 100%;
        position: relative;
        text-align: left;
	}
	.wrap-company .inner-content .left .ttl{
        width: 100%;
        position: relative;
        padding: 0 4vw 4vw 4vw;
	}
	.wrap-company .inner-content .left .ttl::before{
        display: block;
        content: "";
        width: 1px;
        height: 11vw;
        background-color: #fff;
        position: absolute;
        left: 9.6vw;
        top: 1vw;
	}
	.wrap-company .inner-content .left .ttl::after{
        display: block;
        content: "";
        width: 1px;
        height: 20vw;
        background-color: #fff;
        position: absolute;
        left: 8vw;
        top: 3.6vw;
	}
	.wrap-company .inner-content .left .ttl h3{
        display: inline-block;
        font-size: 8vw;
		color: #fff;
        padding: 0 1vw 0 8.8vw;
        border-bottom: solid 1px #fff;
	}
	.wrap-company .inner-content .left .ttl h4{
        font-size: 3.4vw;
		color: #fff;
        padding: 0 0 0 8.8vw;
        margin: 1vw 0 0 0.2vw;
	}
	.wrap-company .inner-content .left .detail{
        width: 100%;
        padding: 0 7vw 0 7vw;
        position: relative;
	}
	.wrap-company .inner-content .left .detail dl{
        width: 100%;
        list-style: none;
	}
	.wrap-company .inner-content .left .detail dl dd{
        width: 100%;
        display: block;
        padding: 2.6vw 0 2.6vw 0;
        border-top: solid 1px #d2d2d2;
	}
	.wrap-company .inner-content .left .detail dl dd:nth-of-type(1){
		border: none;
	}
	.wrap-company .inner-content .left .detail dl dd .title{
        display: block;
        font-size: 3.8vw;
        color: #fff;
        width: 100%;
		text-align: center;
	}
	.wrap-company .inner-content .left .detail dl dd .txt{
        display: block;
        font-size: 3.8vw;
		color: #fff;
        width: 100%;
		text-align: center;
	}
	.wrap-company .inner-content .left .detail dl dd .txt a{
		color: #fff;
		text-decoration: underline;
	}
	.wrap-company .inner-content .left .detail dl dd iframe{
		width: 100%;
		height: 50vw;
		-webkit-filter: grayscale(100%);
		-moz-filter: grayscale(100%);
		-ms-filter: grayscale(100%);
		-o-filter: grayscale(100%);
		filter: grayscale(100%);
		vertical-align: bottom;
		margin: 2vw 0 0 0;
	}
	.wrap-recruit{
		width: 100%;
		position: relative;
		background-image: url("../img/wrap-recruit-bg-sp.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center center;
	}
	.wrap-recruit .inner-content{
		width: 100%;
		display: block;
	}
	.wrap-recruit .inner-content .left{
        width: 100%;
        position: relative;
		text-align: center;
		padding: 18vw 0 18vw 0;
	}
	.wrap-recruit .inner-content .left .ttl{
        display: inline-block;
        position: relative;
	}
	.wrap-recruit .inner-content .left .ttl h3{
        display: inline-block;
        font-size: 8vw;
		color: #fff;
	}
	.wrap-recruit .inner-content .left .ttl h4{
        font-size: 3.4vw;
		color: #fff;
        margin: 0 0 3vw 0;
	}
	.wrap-recruit .inner-content .left .ttl .topleft{
		position: absolute;
		top: 0;
		left: 0;
	}
	.wrap-recruit .inner-content .left .ttl .topleft::after{
        width: 27vw;
        height: 1px;
        background-color: #fff;
        display: block;
        content: "";
        position: absolute;
        top: -0vw;
        left: -10vw;
	}
	.wrap-recruit .inner-content .left .ttl .topleft::before{
        width: 1px;
        height: 14vw;
        background-color: #fff;
        display: block;
        content: "";
        position: absolute;
        top: -4vw;
        left: -7vw;
	}
	.wrap-recruit .inner-content .left .ttl .bottomright{
		position: absolute;
		bottom: 0;
		right: 0;
	}
	.wrap-recruit .inner-content .left .ttl .bottomright::after{
        width: 27vw;
        height: 1px;
        background-color: #fff;
        display: block;
        content: "";
        position: absolute;
        bottom: -0vw;
        right: -10vw;
	}
	.wrap-recruit .inner-content .left .ttl .bottomright::before{
        width: 1px;
        height: 14vw;
        background-color: #fff;
        display: block;
        content: "";
        position: absolute;
        bottom: -4vw;
        right: -7vw;
	}
}

@media screen and (min-width: 769px){
	main{
		padding-bottom: 0;
	}
	.slogan{
		width: 100%;
		position: relative;
	}
	.slogan .inner-content{
		width: 100%;
		position: relative;
		overflow: hidden;
	}
	.slogan .inner-content h2{
		width: 100%;
		position: relative;
	}
	.slogan .inner-content h2 img{
		width: 100%;
		vertical-align: bottom;
	}
	.wrap-message{
		width: 100%;
		min-height: 29vw;
		padding: 0 0 0 9vw;
        margin: 10vw 0 0 0;
		position: relative;
	}
	.wrap-message .inner-content{
		width: 100%;
		display: flex;
		position: relative;
	}
	.wrap-message .inner-content .left{
		width: 100%;
		padding: 0 0 3vw 0;
	}
	.wrap-message .inner-content .left .ttl{
        width: 40vw;
        position: relative;
	}
	.wrap-message .inner-content .left .ttl::before{
        display: block;
        content: "";
        width: 1px;
        height: 6vw;
        background-color: #000;
        position: absolute;
        left: 3vw;
        top: 1vw;
	}
	.wrap-message .inner-content .left .ttl::after{
		display: block;
        content: "";
        width: 1px;
        height: 10vw;
        background-color: #000;
        position: absolute;
        left: 2vw;
        top: 3.6vw;
	}
	.wrap-message .inner-content .left .ttl h3{
		display: inline-block;
        font-size: 3vw;
        padding: 0 1vw 0 4.6vw;
        border-bottom: solid 1px #000;
	}
	.wrap-message .inner-content .left .ttl h4{
		font-size: 1.2vw;
        padding: 0 0 0 4.6vw;
		margin: 1vw 0 0 0.2vw;
	}
	.wrap-message .inner-content .left .detail{
		width: 42vw;
        padding: 0 0 0 5.6vw;
		margin: 1vw 0 0 0.2vw;
	}
	.wrap-message .inner-content .left .detail p{
		font-size: max(1vw, 11px);
	}
	.wrap-message .inner-content .left .detail > a.btn-black{
		display: inline-block;
        align-items: center;
        height: 100%;
        margin: 2.2vw 0 0 0;
	}
	.wrap-message .inner-content .left .detail a.btn-black > span{
		font-size: max(1.1vw, 12px);
        padding: 3px 3vw 3px 3vw;
		border-radius: 100px;
		border: solid 1px transparent;
		background-color: #000;
	}
	.wrap-message .inner-content .left .detail > a.btn-black > span{
		display: inline-block;
		color: #fff;
		background: url(/common/img/btn_ar.png) no-repeat center center;
		background-size: 19% auto;
		background-position: center left;
		background-color: #000;
		border: solid 2px #000;
		transition: background-color 0.2s, color 0.2s;
	}
	.wrap-message .inner-content .left .detail > a.btn-black:hover > span{
		background: url(/common/img/btn_ar_black_on.png) no-repeat center center;
		background-size: 19% auto;
		background-position: center left;
		color: #000;
		background-color: #fff;
		border: solid 2px #000;
	}
	.wrap-message > img{
		width: 46%;
		position: absolute;
		top: 1.6vw;
		right: 0;
		z-index: 1;
	}
	.wrap-service{
		width: 100%;
		min-height: 40vw;
		padding: 0 0 0 9vw;
        margin: 8vw 0 0 0;
		position: relative;
	}
	.wrap-service .inner-content{
		width: 100%;
		display: flex;
		position: relative;
		z-index: 20;
	}
	.wrap-service .inner-content .left{
		width: 100%;
		padding: 0 0 3vw 0;
	}
	.wrap-service .inner-content .left .ttl{
        width: 40vw;
        position: relative;
	}
	.wrap-service .inner-content .left .ttl::before{
        display: block;
        content: "";
        width: 1px;
        height: 6vw;
        background-color: #000;
        position: absolute;
        left: 3vw;
        top: 1vw;
	}
	.wrap-service .inner-content .left .ttl::after{
		display: block;
        content: "";
        width: 1px;
        height: 10vw;
        background-color: #000;
        position: absolute;
        left: 2vw;
        top: 3.6vw;
	}
	.wrap-service .inner-content .left .ttl h3{
		display: inline-block;
        font-size: 3vw;
        padding: 0 1vw 0 4.6vw;
        border-bottom: solid 1px #000;
	}
	.wrap-service .inner-content .left .ttl h4{
		font-size: 1.2vw;
        padding: 0 0 0 4.6vw;
		margin: 1vw 0 0 0.2vw;
	}
	.wrap-service .inner-content .left .detail{
		width: 35vw;
        padding: 0 0 0 5.6vw;
		margin: 1vw 0 0 0.2vw;
	}
	.wrap-service .inner-content .left .detail p{
		font-size: max(1vw, 11px);
	}
	.wrap-service .inner-content .left .detail > a.btn-black{
		display: inline-block;
        align-items: center;
        height: 100%;
        margin: 2.2vw 0 0 0;
	}
	.wrap-service .inner-content .left .detail a.btn-black > span{
		font-size: max(1.1vw, 12px);
        padding: 3px 3vw 3px 3vw;
		border-radius: 100px;
		border: solid 1px transparent;
		background-color: #000;
	}
	.wrap-service .inner-content .left .detail > a.btn-black > span{
		display: inline-block;
		color: #fff;
		background: url(/common/img/btn_ar.png) no-repeat center center;
		background-size: 19% auto;
		background-position: center left;
		background-color: #000;
		border: solid 2px #000;
		transition: background-color 0.2s, color 0.2s;
	}
	.wrap-service .inner-content .left .detail > a.btn-black:hover > span{
		background: url(/common/img/btn_ar_black_on.png) no-repeat center center;
		background-size: 19% auto;
		background-position: center left;
		color: #000;
		background-color: #fff;
		border: solid 2px #000;
	}
	.wrap-service > img{
		width: 100%;
		position: absolute;
		top: 1.6vw;
		right: 0;
		z-index: 1;
	}
	.wrap-works{
		width: 100%;
		padding: 0 0 8vw 9vw;
        margin: 3vw 0 0 0;
		position: relative;
	}
	.wrap-works .inner-content{
		width: 100%;
		display: flex;
		position: relative;
	}
	.wrap-works .inner-content .left{
		width: 100%;
	}
	.wrap-works .inner-content .left .ttl{
        width: 100%;
        position: relative;
	}
	.wrap-works .inner-content .left .ttl::before{
        display: block;
        content: "";
        width: 1px;
        height: 6vw;
        background-color: #000;
        position: absolute;
        left: 3vw;
        top: 1vw;
	}
	.wrap-works .inner-content .left .ttl::after{
		display: block;
        content: "";
        width: 1px;
        height: 10vw;
        background-color: #000;
        position: absolute;
        left: 2vw;
        top: 3.6vw;
	}
	.wrap-works .inner-content .left .ttl h3{
		display: inline-block;
        font-size: 3vw;
        padding: 0 1vw 0 4.6vw;
        border-bottom: solid 1px #000;
	}
	.wrap-works .inner-content .left .ttl h4{
		font-size: 1.2vw;
        padding: 0 0 0 4.6vw;
		margin: 1vw 0 0 0.2vw;
	}
	.wrap-works .inner-content .left .detail{
		width: 100%;
		padding: 0 0 0 5.8vw;
        margin: 1vw 0 0 0;
	}
	.wrap-works .inner-content .left .detail p{
		font-size: max(1vw, 11px);
	}
	.wrap-works .inner-content .left .detail .detail-list{
		width: 100%;
		margin: 2vw 0 0 0;
		padding: 4vw 5vw 4vw 5vw;
		position: relative;
	}
	.wrap-works .inner-content .left .detail .detail-list::after{
		width: 90.4%;
		height: 100%;
		display: block;
		content: "";
		background-color: #000;
        position: absolute;
        top: 0;
        left: 0;
		z-index: 1;
	}
	.wrap-works .inner-content .left .detail .detail-list > img{
		width: 19vw;
        position: absolute;
        top: -9vw;
        right: 0;
        z-index: 10;
	}
	.wrap-works .inner-content .left .detail .detail-list ul{
        display: block;
        width: 90%;
        list-style: none;
        font-size: 0;
        position: relative;
        z-index: 40;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li{
		display: inline-block;
        width: 29%;
        margin: 0 0 0 6.5%;
        vertical-align: top;
        position: relative;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li:nth-of-type(1){
		margin-left: 0;	
	}
	.wrap-works .inner-content .left .detail .detail-list ul li > span{
		display: inline-block;
        position: absolute;
        left: -2vw;
        top: -1.8vw;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li > span > span{
        font-size: 3.2vw;
        color: #fff;
        font-family: "Montserrat", sans-serif;
        font-optical-sizing: auto;
        font-weight: 300;
        font-style: italic;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li h4{
		color: #fff;
		font-size: 1.3vw;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li p{
		height: 5em;
		color: #fff;
		font-size: 1.1vw;
        margin: 0.8vw 0 1.4vw 0;
	}
	.wrap-works .inner-content .left .detail .detail-list ul li img{
		width: 100%;
	}
	.wrap-works .inner-content .left .detail > a.btn-black{
		display: inline-block;
        align-items: center;
        height: 100%;
        margin: 2.2vw 0 0 0;
	}
	.wrap-works .inner-content .left .detail a.btn-black > span{
		font-size: max(1.1vw, 12px);
        padding: 3px 3vw 3px 3vw;
		border-radius: 100px;
		border: solid 1px transparent;
		background-color: #000;
	}
	.wrap-works .inner-content .left .detail > a.btn-black > span{
		display: inline-block;
		color: #fff;
		background: url(/common/img/btn_ar.png) no-repeat center center;
		background-size: 19% auto;
		background-position: center left;
		background-color: #000;
		border: solid 2px #000;
		transition: background-color 0.2s, color 0.2s;
	}
	.wrap-works .inner-content .left .detail > a.btn-black:hover > span{
		background: url(/common/img/btn_ar_black_on.png) no-repeat center center;
		background-size: 19% auto;
		background-position: center left;
		color: #000;
		background-color: #fff;
		border: solid 2px #000;
	}
	.wrap-company{
		width: 100%;
		padding: 6vw 0 9vw 9vw;
		background-color: #000;
		position: relative;
		background-image: url("../img/wrap-compnay-bg1.png"), url("../img/wrap-compnay-bg2.png");
		background-repeat: no-repeat, no-repeat;
		background-size: 100% auto, 100% auto;
		background-position: left top, left bottom;
	}
	.wrap-company .inner-content{
		width: 100%;
		display: flex;
		position: relative;
	}
	.wrap-company .inner-content .left{
		width: 100%;
	}
	.wrap-company .inner-content .left .ttl{
        width: 100%;
        position: relative;
	}
	.wrap-company .inner-content .left .ttl::before{
        display: block;
        content: "";
        width: 1px;
        height: 6vw;
        background-color: #fff;
        position: absolute;
        left: 3vw;
        top: 1vw;
	}
	.wrap-company .inner-content .left .ttl::after{
		display: block;
        content: "";
        width: 1px;
        height: 10vw;
        background-color: #fff;
        position: absolute;
        left: 2vw;
        top: 3.6vw;
	}
	.wrap-company .inner-content .left .ttl h3{
		display: inline-block;
        font-size: 3vw;
		color: #fff;
        padding: 0 1vw 0 4.6vw;
        border-bottom: solid 1px #fff;
	}
	.wrap-company .inner-content .left .ttl h4{
		font-size: 1.2vw;
		color: #fff;
        padding: 0 0 0 4.6vw;
		margin: 1vw 0 0 0.2vw;
	}
	.wrap-company .inner-content .left .detail{
		width: 100%;
		padding: 0 0 0 5.8vw;
        margin: 1vw 0 0 0;
	}
	.wrap-company .inner-content .left .detail dl{
        width: 58%;
        list-style: none;
        margin: 0 0 0 29%;
	}
	.wrap-company .inner-content .left .detail dl dd{
        width: 100%;
        display: flex;
        border-top: solid 1px #d2d2d2;
        padding: 0.6vw 0 0.6vw 0;
	}
	.wrap-company .inner-content .left .detail dl dd .title{
        font-size: max(1.2vw, 12px);
        color: #fff;
        width: 24%;
	}
	.wrap-company .inner-content .left .detail dl dd .txt{
        font-size: max(1.2vw, 12px);
		color: #fff;
		width: 76%;
	}
	.wrap-company .inner-content .left .detail dl dd .txt a{
		color: #fff;
		text-decoration: underline;
	}
	.wrap-company .inner-content .left .detail dl dd iframe{
		width: 100%;
		height: 22vw;
		-webkit-filter: grayscale(100%);
		-moz-filter: grayscale(100%);
		-ms-filter: grayscale(100%);
		-o-filter: grayscale(100%);
		filter: grayscale(100%);
		vertical-align: bottom;
	}
	.wrap-recruit{
		width: 100%;
		position: relative;
		background-image: url("../img/wrap-recruit-bg.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center center;
	}
	.wrap-recruit .inner-content{
		width: 100%;
		display: flex;
		position: relative;
	}
	.wrap-recruit .inner-content .left{
		width: 100%;
		padding: 6vw 0 6vw 0;
		text-align: center;
	}
	.wrap-recruit .inner-content .left .ttl{
        display: inline-block;
        position: relative;
	}
	.wrap-recruit .inner-content .left .ttl h3{
		display: inline-block;
        font-size: 3vw;
		color: #fff;
	}
	.wrap-recruit .inner-content .left .ttl h4{
        font-size: 1.2vw;
        color: #fff;
        margin: 0 0 1.4vw 0;
	}
	.wrap-recruit .inner-content .left .ttl .topleft{
		position: absolute;
		top: 0;
		left: 0;
	}
	.wrap-recruit .inner-content .left .ttl .topleft::after{
		width: 10vw;
        height: 1px;
        background-color: #fff;
        display: block;
        content: "";
        position: absolute;
        top: -0vw;
        left: -4vw;
	}
	.wrap-recruit .inner-content .left .ttl .topleft::before{
        width: 1px;
        height: 6vw;
        background-color: #fff;
        display: block;
        content: "";
        position: absolute;
        top: -2vw;
        left: -2vw;
	}
	.wrap-recruit .inner-content .left .ttl .bottomright{
		position: absolute;
		bottom: 0;
		right: 0;
	}
	.wrap-recruit .inner-content .left .ttl .bottomright::after{
		width: 10vw;
        height: 1px;
        background-color: #fff;
        display: block;
        content: "";
        position: absolute;
        bottom: -0vw;
        right: -4vw;
	}
	.wrap-recruit .inner-content .left .ttl .bottomright::before{
        width: 1px;
        height: 6vw;
        background-color: #fff;
        display: block;
        content: "";
        position: absolute;
        bottom: -2vw;
        right: -2vw;
	}
}