@charset "utf-8";
/*-------------------------------------
 Interviwe
-------------------------------------*/

#why_UintA #why_container, #why_UintB #why_container{
	background: #f4f4f4;
}
.why_int_visual{
	margin: 0 auto;
	position: relative;
}
.why_int_visual img{
	max-width: 100%;
}
.why_int_visual ul{
	width: 40%;
	position: absolute;
}
.why_int_rightTitle {
	right: 20px;
	bottom: 45px;
}
.why_int_leftTitle {
	left: 20px;
	bottom: 45px;
}
.why_int_visual ul .why_int_title{
	padding: 20px 25px 20px 20px;
	font-size: 1.12rem;
	line-height:1.4;
	color: #FFF;
	box-sizing: border-box;
}
.why_int_visual dl{
	padding: 14px 25px 20px 25px;
	background: url(/content/400027058.png) ;
	box-sizing: border-box;
}
.why_int_visual dt{
	font-size: 1.12rem;
	margin: 0 0 14px 0;
}
.why_int_visual dd{
	line-height:1.2;
}
.why_int_day{
	padding: 5px 20px 5px 0;
	background-color: #0c0c0c;
	text-align: right;
	font-size: .87rem;
	color: #FFF;
}
.why_int_imgR{
	width: 50%;
	float: right;
	margin: -20px -20px 20px 20px;
}
.why_int_imgL{
	width: 50%;
	float: left;
	margin: -20px 20px 20px -20px;
}
.why_int_imgR img{
	width: 100%;
}
.why_int_imgL img{
	width: 100%;
}
h3.why_intTitle {
	margin: 20px 0;
	padding: 6px 10px 6px 0px;
	font-size: 1.12rem;
	font-weight: normal;
	overflow: hidden;
}

#why_UintA p, #why_UintB p{
	overflow: hidden;
}

.why_intColum{
	border: #000 1px solid;
	margin:-1px 0 0 0;
	box-sizing: border-box;
	background: #FFF;
	overflow: hidden;
}
.why_intColum p{
	padding: 0 20px 10px 20px;
}
.why_intColum p em {
	font-style: italic;
}
.why_intColumBoxR{
	width: 50%;
	padding: 10px;
	float: right;
	box-sizing: border-box;
}
.why_intColumBoxL{
	width: 50%;
	padding: 10px;
	float: left;
	box-sizing: border-box;
}
.why_intColumBoxR.image,
.why_intColumBoxL.image{
	text-align: center;
}
.why_intColum h4{
	margin: 0 0 15px 0;
	padding: 6px 10px 6px 20px;
	color: #fff;
	font-size: 1.12rem;
	font-weight: normal;
}
.why_intColum h5 {
	clear: both;
	position: relative;
	margin: 0 0 0 20px;
	padding: 0 0 15px 20px;
	color: #333;
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.8;
}
.why_intColum h5:before {
	content: "";
    position: absolute;
    top: 9px;
    left: 0;
    width: 10px;
    height: 10px;
    background: #333;
}

.why_intColum img{
	width: 100%;
}
.why_intDate {
	margin: -20px 0 0 0;
	padding: 0 0 5px 0;
}

/*-------------------------------------
 Color
-------------------------------------*/
.why_UintA .why_int_title, .why_UintA .why_intColum h4{
	background: #5E5A52;
}
.why_UintB .why_int_title, .why_UintB .why_intColum h4{
	background: #594d4f;
}

.why_UintA h3.why_intTitle, .why_UintA .cap02{
	color: #312F2B;
	border-bottom: #312F2B 1px solid;
}
.why_UintB h3.why_intTitle, .why_UintB .cap02{
	color: #2B181B;
	border-bottom: #2B181B 1px solid;
}

.why_UintA h2.why_hTitle, .why_UintA .cap01 {
	background: #312F2B;
}

.why_UintB h2.why_hTitle, .why_UintB .cap01{
	background: #2B181B;
}

/*-------------------------------------
 media screen
-------------------------------------*/

/* breakpoints
==========================================================================*/
@media screen and (max-width: 1250px) {

.why_int_imgR{
	width: 50%;
	float: right;
	margin: -20px -45px 45px 45px;
}
.why_int_imgL{
	width: 50%;
	float: left;
	margin: -20px 45px 45px -45px;
}
.why_intColum{
	border: #000 1px solid;
	margin:-1px 40px 0 40px;
	padding: 10px;
	box-sizing: border-box;
	background: #FFF;
	overflow: hidden;
}

}

/* 
==========================================================================*/
@media screen and (max-width: 980px) {

.why_int_visual ul{
	width: 40%;
	position: absolute;
}
.why_int_rightTitle {
	right: 20px;
	bottom: 20px;
}
.why_int_leftTitle {
	left: 20px;
	bottom: 20px;
}
.why_int_visual ul .why_int_title{
	padding: 10px 15px 15px 15px;
	font-size: .87rem;
	line-height:1.4;
	color: #FFF;
	box-sizing: border-box;
}
.why_int_visual dl{
	padding: 10px 15px;
	background: url(/content/400027058.png) ;
	box-sizing: border-box;
}
.why_int_visual dt{
	font-size: .87rem;
	margin: 0 0 10px 0;
}
.why_int_visual dd{
	font-size: .75rem;
	line-height:1.2;
}
.why_intColum h4{
	margin: 0 0 15px 0;
	padding: 6px 10px 6px 20px;
	color: #fff;
	font-size: 1rem;
	font-weight: normal;
}
.why_intColum h5 {
	clear: both;
	position: relative;
	margin: 0 0 0 20px;
	padding: 0 0 15px 20px;
	color: #333;
	font-size: .87rem;
	font-weight: normal;
	line-height: 1.8;
}
.why_intColum p{
	padding: 0 0 10px 0;
	line-height: 1.4;
}

}

/* 
==========================================================================*/
@media screen and (max-width: 680px) {
	
.why_int_visual ul{
	width: 100%;
	position: static;
}
.why_int_visual ul .why_int_title{
	padding: 10px 20px 10px 20px;
	font-size: 1rem;
	line-height:1.4;
	color: #FFF;
	box-sizing: border-box;
}
.why_int_visual dl{
	padding: 0px 20px 10px 20px;
	color: #FFF;
	box-sizing: border-box;
}
.why_UintA .why_int_visual dl{
	background: #5E5A52;
}
.why_UintB .why_int_visual dl{
	background: #594d4f;
}
.why_int_day{
	padding: 5px 20px 5px 0;
	background-color: #0c0c0c;
	text-align: right;
	font-size: .75rem;
	color: #FFF;
}
.why_int_visual dt{
	font-size: 1.12rem;
	margin: 0 0 10px 10px;
}
.why_int_visual dd{
	font-size: .75rem;
	line-height:1.2;
}	
.why_int_imgR{
	max-width: 100%;
	width: 100%;
	float: none;
	margin: 0 0 20px 0;
}
.why_int_imgL{
	max-width: 100%;
	width: 100%;
	float: none;
	margin: 0 0 20px 0;
}

.why_intColum{
	border: #000 1px solid;
	margin:-1px 0 0 0;
	padding: 10px;
	box-sizing: border-box;
	background: #FFF;
	overflow: hidden;
}
.why_intColumBoxR{
	width: 100%;
	padding: 10px;
	float: none;
	box-sizing: border-box;
}
.why_intColumBoxL{
	width: 100%;
	padding: 10px;
	float: none;
	box-sizing: border-box;
}
.why_intColum h4{
	margin: -20px 0 15px 0;
	padding: 6px 10px 6px 20px;
	color: #fff;
	font-size: 1.12rem;
	font-weight: normal;
}
.why_intColum h5 {
	clear: both;
	position: relative;
	margin: 0 0 0 20px;
	padding: 0 0 15px 20px;
	color: #333;
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.8;
}

}

/* 
==========================================================================*/
@media screen and (max-width: 350px) {

}