@charset "UTF-8";
/*-------------------------------------------
 dマガジンとは？
-------------------------------------------*/
.about-dmag {
	background: url("../img/about-dmag_bg.png") center no-repeat;
	background-size: cover;
	width: 100%;
	max-width: 960px;
	height: auto;
	margin: 0 auto min(8%, 40px);
	padding: 3% 0;
}

.about-dmag__contents {
	position: relative;
	padding: 3% 4%;
}

.about-dmag__contents img {
	display: block;
	width: 90%;
	height: 90%;
	margin: auto;
}

.btn-detail {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #CC0033;
    color: #fff;
    padding: 12px;
    border-radius: 30px;
    font-weight: bold;
    text-align: center;
    font-size: max(14px, min(2.8vw, 20px));
    padding: 0.4em;
    width: min(60%, 440px);
	height: min(9%, 34px);
    bottom: 17%;
    left: 50%;
    transform: translateX(-50%);
    transition: all .3s;
	text-decoration: none !important;
	box-shadow: 0px 4px 0 #990000;
}
.btn-detail:hover {
	text-decoration: none;
	color: #fff;
}
.btn-detail.arrow::before{
	content: "";
	width: 8px;
	height: 8px;
	border-style: solid;
	border-width: 2px 2px 0 0;
	border-color: #fff;
	position: absolute;
	right: 24px;
	top: 50%;
	transform: translateY(-50%) rotate(45deg);
}
@media (min-width: 769px) {
	.about-dmag{
		padding: 25px 3%;
	}
	.about-dmag__contents{
		max-width: 700px;
		margin: 0 auto;
	}
	.btn-detail {
		height: 50px;	
	}

	.btn-detail.arrow::before{
		width: 10px;
		height: 10px;
		right: 20px;
	}
	.btn-detail:hover{
		opacity: .7;
	}
}