@charset "utf-8";

.slideSpace{
	width: 90%;
	position: relative:
}

html #wrapper .playImg{
	width: 70px;
	opacity: .6;
  transition-duration: .3s;
}

html #wrapper .playImg:hover{
	opacity: 1;

}
#wrapper .play{
	display: block;
    position: absolute;
    top: 40%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
	right: auto;
}

.sliderTxt{
    font-size: 15px;
    text-align: center;
    font-weight: 600;
    margin-top: 4px;
    color: #454545;
}

html .bx-wrapper{
	border: none;
}

html .bx-wrapper img {
    width: 75%;
    display: block;
    margin: 0 auto;
}

html .bx-wrapper .bx-next {
    right: 10px;
    background: url(../bxslider/images/controlsRight.png) no-repeat -1px -1px;
	  transition-duration: .3s;
  }

html .bx-wrapper .bx-prev {
    right: 10px;
    background: url(../bxslider/images/controlsLeft.png) no-repeat -1px -1px;
	  transition-duration: .3s;
}

html .bx-wrapper .bx-controls-direction a {
    position: absolute;
    top: 50%;
    margin-top: -41px;
    outline: 0;
    width: 23px;
    height: 60px;
    text-indent: -9999px;
    z-index: 998;
}

html .bx-wrapper .bx-pager, html .bx-wrapper .bx-controls-auto {
    position: absolute;
    bottom: 35px;
    width: 100%;
}

html #slide{
    margin-top: 20px;
}

html .bx-wrapper .bx-next:hover,html .bx-wrapper .bx-next:focus {
    background-position: 0 0;
    opacity: .3;
}

html .bx-wrapper .bx-prev:hover,html .bx-wrapper .bx-prev:focus {
    background-position: 0 0;
    opacity: .3;
}
    
.reasonTitle{
	font-size: 27px;
	color: #aa0003;
	margin: 30px auto 19px;
	text-align: center;
    line-height: 34px;
    letter-spacing: -.05em;
    }
    
.reasonAncher{
	color: #fff;
	font-size: 30px;
	position: relative;
	padding: 4px 0 4px 5%;
	border-bottom: 1px solid #fff;
}

.reasonNumber{
	color: #7d0000;
	position: absolute;
	right:5%;
    top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%); 
	font-size: 15px;
}

.reasonAncherWrapper{
	background-color: var(--lightRed);
}

.reasonAncherWrapper:nth-child(even){
	background-color: #bb0000;
}

.reason{
	margin-top: 29px;
}

.detailSub{
	font-size: 15px;
	text-align: center;	
	color: var(--lightRed);
	margin-bottom: 4px;
}

.detailTitle{
	font-size: 30px;
	background-color: var(--lightRed);
	color: #fff;
	padding: 4px 0;
	text-align: center;	
}

.reasonDetail{
    margin: 50px 0;
}

.detail-overTxt{
	font-size: 14px;
	color: #454545;
	width: 90%;
	margin: 0 auto;
    margin: 16px auto 50px;
    }

.detailImg{
	width: 100%;
}

.anchers{
    padding-bottom: 20px;
}

.underTitle{
	font-size: 15px;
    font-weight: 600;
    color: #343434;
    background-color: #f5ce02;
    position: absolute;
    top: -15px;
    padding: 3px 10px;
    left: 5%;
}

.underTxt{
	background-color: #ededed;
	font-size: 14px;
	font-weight: 600;
    padding: 26px 5%;
    color: #454545;
    }

.reasonDetail-under{
	position: relative;
    background-color: #ededed;
}

.underRow{
    padding: 4px 0;
}

#wrapper span.red{
	color: #e70000;
	font-weight: bold;
}

.pcAnchers{
	display: none;
}

@media screen and (max-width: 599px) {
	.reason5{
		width: 90%;
	}
	
	.reason5Txt{
		padding-top: 47px;
	}
}

@media screen and (min-width:600px) and ( max-width:979px) {
	#wrapper .play{
		top: 50%;
	}
	
	.reasonTitle{
		font-size:30px;
	}

	.detail-overTxt{
		width: 100%;
		margin: 0;
	}

	.detail-overTxt{
		width: auto;
		margin: 0;
		display: inline-block;
	}
	
	.reasonDetail {
	    margin: 81px 0;
	}
	
	.detailTitle {
	    font-size: 34px;
    }
    
    .detailImg{
	    max-width: 30%;
	    position: absolute;
	    z-index: 1;
    }
    
    .detailImgWrapper{
	    flex-basis: 33%;
    }
    
    .reasonDetail-over{
        width: 90%;
	    margin: 0 auto;
	    display: flex;
	    justify-content: space-between;
        padding: 30px 0 45px;
	    line-height: 25px;
    }
    
    .detail-overTxt{
	    flex-basis: 64%;
    }
    
    .underTitle{
	    position: absolute;
	    left: 36%;
    }
    
    html .underTitle{
        position: initial;
	    display: inline-block;
	    margin: -13px 0;
    }
    
    .reasonDetail:nth-child(3) h3.underTitle, .reasonDetail:nth-child(5) h3.underTitle, .reasonDetail:nth-child(7) h3.underTitle{
	    margin-left: 36%;
    }
    
    .underTxt{
         padding: 26px 0;
	    width: 64%;
	    margin-left: 36%;

    }
    
    .underTitleWrapper{
	    margin: 0 auto;
	    position: relative;
    }
    
    .reasonDetail-under-inner{
	    width: 90%;
	    margin: 0 auto;
    }

    .reasonDetail:nth-child(even) .detailImgWrapper{
	    order: 2;
    }
    
    .reasonDetail:nth-child(even) .underTitle{
		left: 0;
	}

    .reasonDetail:nth-child(even) .underTxt{
	    margin: 0;
	}
	
}

@media screen and (min-width: 980px) {

	.anchers{
	    display: none;
	}
	
	.pcAnchers{
		display:block;
		background-color: #e70000;
		color: #fff;
		font-size: 30px;
		height: 160px;
	}
	
	.pcAnchers-inner{
		width: 980px;
		display: flex;
	    margin: 0 auto;
	    text-align: center;
	    height: 100%;
	}
	
	.pcReason{
		flex-basis: 20%;
	}

	html .pcReason:first-child{
		border-left: 1px solid #fff;
		border-right: 1px solid #fff;
	}
		
	html .pcReason:not(:first-child){
		border-right: 1px solid #fff;
	}

	.underArrow{
	    width: 43px;
        margin-top: 9px;
		transition-duration: .1s;
	}
	
	.pcAncherSubs{
		position: absolute;
		left: 50%;
	    top: 50%;
		transform: translate(-50%,-50%);
		-webkit-transform: translate(-50%,-50%); 		
		width: 100%;
	}
	
	.pcReasonAncher{
	    display: inline-block;
	    width: 100%;
	    height: 100%;
	    position: relative;
		transition-duration: .1s;
	}
	
	.pcReasonAncher:hover{
	    background-color: #b40000;
    }

	.pcReasonAncher:hover .pcReasonSub{
	    margin-top: 7px;
	}
	
	.pcReasonAncher:hover .underArrow{
	    margin-top: 16px;
	}

	.pcReasonMain{
		color: #fff;
	}
	
	.pcReasonSub{
		color: #7d0000;
		font-size: 15px;
		transition-duration: .1s;
	}	
	
	.reason{
	    margin-top: 54px;
	}
	
	.reasonTitle{
		font-size:36px;
	    margin: 67px auto 27px;
	}
	
	html .reasonTxt{
		text-align: center;
	}

	html .movies{
		display: flex;
		justify-content: space-between;
	    width: 100%;
	    max-width: 100%;
        margin-top: 30px;
    }
	
	.moviesInner{
		flex-basis: 23%;
	}
	
	.movieInner-img{
		width: 100%;
	}
	
	.movieImgZone{
		position: relative;
	}
	
	#wrapper .play{
		top: 50%;
		width: auto;
	}
	
	.detail-overTxt{
		width: auto;
		margin: 0;
		display: inline-block;
	}
	
	.reasonDetail {
	    margin: 81px 0;
	}
	
	.detailTitle {
	    font-size: 34px;
    }
    
    .detailImg{
	    max-width: 320px;
	    position: absolute;
	    z-index: 1;
    }
    
    .detailImgWrapper{
	    flex-basis: 33%;
    }
    
    .reasonDetail-over{
        width: 980px;
	    margin: 0 auto;
	    display: flex;
	    justify-content: space-between;
        padding: 30px 0 45px;
	    line-height: 25px;
    }
    
    .detail-overTxt{
	    flex-basis: 64%;
    }
    
    .underTitle{
		position: absolute;
	    left: 36%;
    }
    
    .underTxt{
         padding: 26px 0;
	    width: 64%;
	    margin-left: 36%;

    }
    
    .reasonDetail-under-inner{
	    width: 980px;
	    margin: 0 auto;
    }
    
    .underTitleWrapper{
	    width: 980px;
	    margin: 0 auto;
	    position: relative;
    }
    
    .reasonDetail:nth-child(even) .detailImgWrapper{
	    order: 2;
    }
    
    .reasonDetail:nth-child(even) .underTitle{
		left: 0;
	}

    .reasonDetail:nth-child(even) .underTxt{
	    margin: 0;
	}
}