/*--------------------------------------------------------*/

/*  制作実績 - 詳細　*/

/*--------------------------------------------------------*/

@media print, screen and (min-width: 768px){

.works_detail{
	margin:0 auto;
	max-width:1000px;
	padding:0 50px;
}

.works_detail .works_img{
	margin-bottom:40px;
	text-align:center;
}

.works_detail .youtube{
	margin-bottom:40px;
}

.works_detail .youtube .youtubeBox {
	position: relative;
	padding-bottom: 56.25%; /* アスペクト比16:9の場合 */
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
 
.works_detail .youtube .youtubeBox iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.works_detail .works_outline{
	padding:20px 0;
}

.works_detail .works_outline h1.works_title{
	font-family: var(--font_title);
	font-size:16px;
	color:#333;
	font-weight:500;
	line-height:1.5em;
	letter-spacing:0.15em;
	font-feature-settings : "palt";
	margin-bottom:40px;
}

.works_detail .works_outline .works_txt{
	font-family: var(--font_txt);
	font-size:13px;
	color: var(--text_color);
	font-weight:400;
	line-height:2.2em;
	letter-spacing:0.1em;
	font-feature-settings : "palt";
}

.works_detail .works_outline .works_txt a{
	color: var(--text_color);
}

.works_detail .works_outline .works_txt a:hover{
	color: var(--text_color);
}

.works_detail .works_outline .category_tag{
	margin-top:30px;
	font-family: var(--font_eng);
	font-size:13px;
	color:#A5A5A5;
	font-weight:400;
	line-height:1.5em;
	letter-spacing:0.15em;
	font-feature-settings : "palt";
}

.works_detail .works_outline .category_tag a{
	color:#A5A5A5;
}

.works_detail .works_outline .category_tag a:hover{
}

.works_detail .works_outline .bt_back a{
	display:block;
	width:140px;
	margin:80px auto 0;
	padding:10px 0;
	text-align:center;
	font-family: var(--font_eng);
	font-size:11px;
	font-weight:300;
	color:#666;
	line-height:1.0em;
	letter-spacing:0.2em;
	font-feature-settings : "palt";
	text-decoration:none;
	background:#FFF;
	border:1px solid #DDD;
	transition: all  0.2s ease;
}

.works_detail .works_outline .bt_back a:hover{
	background:#F5F5F5;
	text-decoration:none;
}

}

@media screen and (max-width: 768px){

.works_detail{
	padding:40px 20px 0;
}

.works_detail .works_img{
	margin-bottom:20px;
	text-align:center;
}

.works_detail .youtube{
	margin-bottom:20px;
}

.works_detail .youtube .youtubeBox {
	position: relative;
	padding-bottom: 56.25%; /* アスペクト比16:9の場合 */
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
 
.works_detail .youtube .youtubeBox iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.works_detail .works_outline{
	padding:20px 0 0;
}

.works_detail .works_outline h1.works_title{
	font-family: var(--font_title);
	font-size:14px;
	color:#333;
	font-weight:500;
	line-height:1.5em;
	letter-spacing:0.12em;
	font-feature-settings : "palt";
	margin-bottom:30px;
}

.works_detail .works_outline .works_txt{
	font-family: var(--font_txt);
	font-size:12px;
	color: var(--text_color);
	font-weight:400;
	line-height:2.1em;
	letter-spacing:0.1em;
	font-feature-settings : "palt";
}

.works_detail .works_outline .works_txt a{
	color: var(--text_color);
}

.works_detail .works_outline .works_txt a:hover{
	color: var(--text_color);
}

.works_detail .works_outline .category_tag{
	margin-top:30px;
	font-family: var(--font_eng);
	font-size:12px;
	color:#A5A5A5;
	font-weight:400;
	line-height:1.5em;
	letter-spacing:0.15em;
	font-feature-settings : "palt";
}

.works_detail .works_outline .category_tag a{
	color:#A5A5A5;
}

.works_detail .works_outline .category_tag a:hover{
}

.works_detail .works_outline .bt_back a{
	display:block;
	width:140px;
	margin:80px auto 0;
	padding:10px 0;
	text-align:center;
	font-family: var(--font_eng);
	font-size:11px;
	font-weight:300;
	color:#666;
	line-height:1.0em;
	letter-spacing:0.2em;
	font-feature-settings : "palt";
	text-decoration:none;
	background:#FFF;
	border:1px solid #DDD;
	transition: all  0.2s ease;
}

.works_detail .works_outline .bt_back a:hover{
	background:#F5F5F5;
	text-decoration:none;
}

}