﻿#problem{
	width: 100%;
	font-size: 0;
	display: block;
   	padding: 80px 0;
    position: relative;
    overflow: hidden;
    	
}

.program-box,
.question-box{
	width: 50%;
	display: inline-block;
	vertical-align: top;
	position: relative;
	z-index: 5;
}
.problem-separated-box{
	width: 100%;
	height: 100%;
	background-color: #FFF;
	display: inline-block;
	vertical-align: top;
	position: absolute;
	z-index: 3;
	top: 0;
	left: 0;
	-webkit-clip-path: polygon(0 0, 45% 0, 55% 100%, 0% 100%);
	clip-path: polygon(0 0, 45% 0, 55% 100%, 0% 100%);
}
.problem-mask{
	width: 100%;
	height: 100%;
 	background-image: url('../img/re-q.png');
    background-position: top;
	display: inline-block;
	vertical-align: top;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	opacity: 1;
}

.problem-bg{
	background-color: #a0a0a0;
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0.4;
}

.program-title-box{
	font-size: 36px;
	display: block;
	font-weight:bold;
	padding-left: 30%;
	box-sizing: border-box;
}

.program-info-box{
	width: 100%;
	padding-left: 30%;
	box-sizing: border-box;
}
.program-box .program-info-box i{
	color: #f30404;
}
.program-info-box li{
	font-size: 18px;
	letter-spacing: 1px;
	display: block;
	padding-bottom: 20px;
}
.program-line-top{
	width: 350px;
	max-width: 100%;
	display: block;
	height: 3px;
	background-color: #ff0000;
	margin-top: 10px;
	margin-bottom: 50px;
}
.program-line-bottom{
	background-color: #a0a0a0;
	width: 600px;
	max-width: 100%;
	height: 1px;
	display: block;
	float: right;
	position: relative;
	margin-top: 30px;
	right: -7.5%;
}
#question{
	position: relative;
	top: -60px;
}
.question-box .program-line-top{
	float: right;
	clear: both;
}


.question-title-box{
	float: right;
	font-size: 36px;
	display: block;
	font-weight:bold;
	padding-right: 30%;
	box-sizing: border-box;
}


.question-list-box{
	width: 700px;
	max-width: 100%;
	display: block;
	margin: 0 auto;
	clear: both;

 }

 .question-list-title{
 	font-size: 18px;
 	display: block;
 	letter-spacing: 1px;
 	width: 100%;
 	border-bottom: 1px solid #a0a0a0;
 }

.question-list-title i,
.program-info-box i{
 	color: #df0000;
 }
.program-box i,
.question-title-box i{
 	color: #888888;
 }

.question-answer{
 	padding: 10px 0;
 	font-size: 16px;
 	padding-left: 22px;
 	box-sizing: border-box;
 	letter-spacing: 2px;
 	display: none;
 }
.problem-box{
	width: 210px;
 	max-width: 100%;
 	display: block;
 	position: absolute;
 	right: 0;
 	bottom: -76px;
 	transition: all .4s linear;

}
.problem-img{
 	width: 100%;
 	display: block;
 }
.question-list-title.open i:nth-child(2){
	display: inline-block;
}
.question-list-title.open i:nth-child(1){
	display: none;
}
.question-list-title i:nth-child(2){
	display: none;
}
.question-list-title i:nth-child(1){
	display: inline-block;
}

.question-list-title{
	cursor: pointer;
}