@charset "UTF-8";

.mainImg{
	background-image: url(../img/highlight/main_l.jpg);
}

body#highlight h2 {
	margin-bottom: 40px;
	font-size: 3.0rem;
	color: #fff;
	text-align: left;
}
body#highlight h3 {
	font-size: 1.6rem;
	font-weight: normal;
}

.pie {
	float: right;
	width: 554px;
}
.sec01 {
	position: relative;
	width: 980px;
	margin: 19px auto;
}
.sec01 .txt {
	position: absolute;
	top: 37px;
	left: 0;
}
.sec01 .txt h3 {
	margin-bottom: 1em;
}
.txt dl {
	display: table;
	font-size: 1.6rem;
}
.txt dl dt,
.txt dl dd {
	display: table-cell;
	height: 2em;
}
.sec02 {
	background-color: #202631;
}
.sec02 .txt {
	width: 980px;
	margin: 37px auto;
}
.sec02 .txt h3 {
	margin-top: 1em;
	margin-bottom: 0.5em;
}
@media only screen and (min-width:980px) and (max-width:1024px) {
.mainImg {
	height: 50%;
}
}
@media only screen and (max-width:979px) {

.mainImg {
	height: 60%;
}
h1 {
	padding-top: 20%;
	line-height: 1;
}
h1 > span {
	line-height: 2;
}
body#highlight h2 {
	margin-bottom: 20px;
	line-height: 1.2;
}
.sec01 {
	width: 100%;
	/* text-align: center; */
}
.sec01 .txt {
	position: static;
	/*
display: inline-block;
	width: auto;
*/
	padding: 0 16px;
}
.pie {
	float: none;
	box-sizing: border-box;
	padding: 16px;
	width: 100%;
	margin: 0 auto;
	max-width: 554px;
}
.txt dl {
	display: block;
}
.txt dl dt,
.txt dl dd {
	display: inline;
}
.sec02 .txt {
	box-sizing: border-box;
	width: 100%;
	padding: 0 16px;
}

}

@media only screen and (max-width:399px) {
    .mainImg{
        height: 50%;
    }
}

@media only screen and (max-width:767px) and (orientation: landscape) {
.mainImg {
	height: 70%;
}
h1 {
	padding-top: 0;
}

}