@media screen and (max-width: 768px) {
.key-visual {
	position:relative;
}
.key-visual p.catch {
	position:absolute;
	top:18%;
	left:50%;
	margin-left:-5.5em;
	color:#FFF;
	font-size:26px;
	font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .5);
}
.key-visual p.text {
	padding:15px;
	font-size:14px;
	text-align:center;
	font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
}
.key-visual a {
	display:none;
}
.main-banner {
	padding:20px 15px;
	background:#f0f0f0 url(../img/bg_halftone.png);
}
.main-banner a {
	text-decoration:none;
	color:#333;
}
.main-banner .main-banner-header h2 {
	font-size:24px;
	font-weight:bold;
	text-align:center;
	margin-bottom:15px;
}
.main-banner .main-banner-header h2 span {
	border-bottom:#F60 1px solid;
}
.main-banner .main-banner-header p {
	text-align:center;
	margin-bottom:20px;
}
.main-banner ul li {
	position:relative;
	background:#FFF;
	margin-bottom:20px;
	box-shadow:0 0 5px #fff, 0 0 5px #ccc, 0 0 1px #aaa;
	-webkit-box-shadow:0 0 5px #fff, 0 0 5px #ccc, 0 0 1px #aaa;
	-moz-box-shadow:0 0 5px #fff, 0 0 5px #ccc, 0 0 1px #aaa;
}
.main-banner ul li a:hover {
	color:#666;
}
.main-banner ul li a:hover img {
	opacity:0.8;
}
.main-banner ul li .tag {
	position:absolute;
	left:-10px;
	top:10px;
	background:#F60;
	color:#FFF;
	font-size:12px;
	padding:5px;
	z-index:1000;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
}
.main-banner ul li dl {
	padding:15px;
}
.main-banner ul li dl dt {
	margin-bottom:5px;
	font-weight:bold;
	font-size:16px;
}
.main-banner ul li dl dt:before {
	content: "\f0da";
	font-family:FontAwesome;
	margin-right:4px;
	font-weight:normal;
	color:#fb6400;
}
.main .contents {
	padding:25px 0;
}
.main .contents h3 {
	padding-bottom:10px;
	border-bottom: solid 2px #cecece;
	position: relative;
	margin-bottom:20px;
	font-weight:bold;
	font-size:18px;
}
.main .contents h3:after {
	position: absolute;
	content: " ";
	display: block;
	border-bottom: solid 2px #fb6400;
	bottom: -2px;
	width: 10%;
}
.main .contents h3 span a {
	display:block;
	float:right;
	font-size:12px;
	border:#d4d4d3 1px solid;
	padding:5px 12px;
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	text-decoration:none;
	color:#333;
}
.main .contents h3 span a:hover {
	background:#eaeaea;
}
.main .contents h3 span a:before {
	content: "\f0da";
	font-family:FontAwesome;
	margin-right:4px;
	font-weight:normal;
	color:#fb6400;
}
.main .contents ul li {
	margin-bottom:20px;
}
.main .contents ul li a {
	display:flex;
	color:#333;
	text-decoration:none;
}
.main .contents ul li a div {
	width:50%;
}
.main .contents ul li .works-photo {
	position:relative;
	padding-right:10px;
}
.main .contents ul li .works-txt {
	padding-left:10px;
}
.main .contents ul li .works-txt h4 {
	font-size:15px;
	font-weight:bold;
	line-height:1.8;
}
.main .contents ul li .works-txt h4:before {
	content: "\f0da";
	font-family:FontAwesome;
	margin-right:4px;
	font-weight:normal;
	color:#fb6400;
}
.main .contents ul li .works-txt p {
	font-size:13px;
	margin:0;
}
.main .contents ul li .works-txt .date {
	text-align:right;
	color:#999;
	margin-bottom:5px;
	font-size:12px;
}
.main .contents ul li .works-photo p {
	position:absolute;
	background:url(../img/bg_op80.png);
	top:0;
	left:0;
	padding:5px;
	color:#FFF;
	font-size:12px;
}
.main .contents ul li a:hover {
	color:#666;
}
.main .contents ul li a:hover img {
	opacity:0.8;
}
.main .news dt {
}
.main .news dt:before {
	content: "\f0da";
	font-family:FontAwesome;
	margin-right:4px;
	font-weight:normal;
	color:#fb6400;
}
.main .news dd {
	margin-bottom:1em;
	border-bottom:#CCC 1px dotted;
	padding-bottom:5px;
}
}