@charset "utf-8";
/* CSS Document */

.wrapper{
width: 980px;
background-image: url(bg.png);
background-repeat:no-repeat;
padding: 0px 40px 200px 40px;
text-align: center;
position: relative;
}
.ribbon1{
position: absolute;
left: 0px;
top: 0px;
}
.ribbon2{
position: absolute;
right: 0px;
bottom: 0px;
pointer-events: none;
}
#mainContents .img{
padding-top: 100px;
}
.text_area{
background-color: #F58402;
padding: 30px;
margin-top: 30px;
font-size: 14px;
color: #333333;
text-align: left;
line-height: 1.8;
 background-color: rgba(253, 226, 197, 1);
}
.cover{
margin: 30px 0px;
}
.shadow{
box-shadow: 0px 0px 20px 0px rgba(196,196,196, 1);
}

.btn-box{
transform: translate(0%, 0%);
margin: 0 auto;
}

.btn {
margin: 0 auto;
display: block;
width: 370px;
padding: 20px 30px 30px 30px;
border-radius: 20px;
font-size: 18px;
text-decoration: none;
background-color: #F58402;
color: #fff;
text-align: center;
cursor: pointer;
-webkit-transition: 0.5s all;
transition: 0.5s all;
}

.btn:link{
color: #fff;
}
.btn:hover {
background-color: #E6326E;
color: #fff;
}
.btn:visited{
color: #fff;
}
.btn:active{
color: #fff;
}

.btn::before{
content: '';
width: 21px;
height: 22px;
background: url("icon_arrow.png") no-repeat;
margin-right: 10px;
display: inline-block;
transform: translateY(5px); 
}
.btn::after{
content: '';
width: 24px;
height: 30px;
background: url("icon_pdf.png") no-repeat;
margin-left: 10px;
display: inline-block;
transform: translateY(10px); 
}

@media screen and (max-width: 850px){
.wrapper{
width: 100%;
padding: 0px 20px 100px 20px;
}
.ribbon2{
position: absolute;
right: 0px;
bottom: 0px;
}
.img{
padding-top: 50px;
padding-bottom: 10px;
}
.text_area{
padding: 20px;
margin-top: 0px;
}
.btn {
width: 100%;
max-width: 370px;
padding: 15px 20px 20px 20px;
}
.btn-box{
padding-bottom: 10px;
}
}