@charset "utf-8";

.system-manual-area-wrap { position: relative; width: 100%; background: #f2f2f2;}
.system-manual-area-wrap .system-manual { width:1200px; margin:0 auto; position: relative;}
@media (max-width: 1200px) {
	.system-manual-area-wrap .system-manual { width: 100%; padding: 30px;}
}

.manual-wrap { padding: 20px 0 20px 540px; width: 100%; display: inline-block; }
.manual-wrap .manual-title { display: block; font-size: 1.5rem; font-weight: 900; position: relative; clear: both; padding-bottom: 15px;}
.manual-wrap .manual-title .material-icons { font-size: 18px; margin-right:5px; position: relative; top: 2px;}

.manual-wrap a.mual-btn { border-radius: 3px; margin-right: 5px; display: inline-block; padding: 0 10px; line-height: 30px; font-size: 1.2rem; font-weight: 500; opacity: 1;; transition: opacity .2s; }
.manual-wrap a.mual-btn:hover { opacity: .85; }
.manual-wrap a.mual-btn:last-child { margin-right: 0; }
.manual-wrap a.mual-btn .material-icons { font-size: 1.5rem; margin-right: 4px; position: relative; top: 3px;}
.manual-wrap a.mual-btn.sty-bg-dark { background:#422c4f; color:#fff; }
.manual-wrap a.mual-btn.sty-bd-dark { background:#fff; color:#422c4f; border: 1px solid #422c4f;}
.manual-wrap a.mual-btn.sty-bg-blue { background:#4b5da9; color:#fff; }
.manual-wrap a.mual-btn.orange-bd {border: 1px solid #fc694b; background-color: #fff; color: #fc694b}
.manual-wrap a.mual-btn.orange-bg {background-color: #f77b38; color: #fff; }

.manual-wrap a.mual-btn.sty-bd { color: #fda313; border: 1px solid #fda313; background-color: #fff;}
.manual-wrap a.mual-btn.sty-bg-premium {
	color:#fff;
    background: #ff7d00;
    background: -moz-linear-gradient(left,  #ff7d00 -1%, #ff7d00 0%, #ffa912 100%);
    background: -webkit-linear-gradient(left,  #ff7d00 -1%,#ff7d00 0%,#ffa912 100%);
    background: linear-gradient(to right,  #ff7d00 -1%,#ff7d00 0%,#ffa912 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7d00', endColorstr='#ffa912',GradientType=1 );
}

.manual-wrap .manual-group { position: relative; display: inline-block; margin: 0 15px 15px 0; }
.manual-wrap .manual-group:last-child { margin-bottom: 0;}
.manual-wrap .manual-group .tit { font-size: 1.4rem; color:#444; padding-bottom: 6px; font-weight: 500;}
.manual-wrap .manual-group .tit i { font-size:13px; margin-right: 5px; }

.report-apply-area { position:absolute; left:0; bottom:0; width:500px; padding: 40px; background: #422c4f; border-top-right-radius: 30px; overflow: hidden; }
.report-apply-area .title { color:#fff; font-size: 1.5rem; line-height: 1.7; padding-bottom: 30px;}
.report-apply-area:after { content:''; position: absolute; top:-130px; right: -50px; width: 340px; height: 340px; border-radius: 50%; 
	background: rgba(255,255,255,0.05);
	background: -moz-linear-gradient(left,  rgba(255,255,255,.05) 0%, rgba(255,255,255,0) 100%); 
	background: -webkit-linear-gradient(left,  rgba(255,255,255,.05) 0%,rgba(255,255,255,0) 100%);
	background: linear-gradient(to right,  rgba(255,255,255,.05) 0%,rgba(255,255,255,0) 100%);
}
.report-apply-area .btn-style-wrap { margin-bottom:20px; position: relative; z-index: 1; }
.report-apply-area .btn-style-wrap .button { font-size: 1.5rem; font-weight: 600; padding: 0 25px; height: 45px; }
.report-apply-area .his-report { position:relative; }
.report-apply-area .his-report .a-his { display: inline-block; position: relative; color: #fff; font-size: 1.4rem; font-weight: 500; padding:0 20px 3px 0; transition: padding-right .2s;}
.report-apply-area .his-report .a-his:hover { padding-right:30px;}
.report-apply-area .his-report .a-his:after { content: ''; position: absolute; bottom:0; left:0; width:100%; height:1px; background:#fff; }
.report-apply-area .his-report .a-his:before { content: ''; position: absolute; bottom:-1px; right:4px; background: #fff; width:1px; height:10px; transform: rotate(-45deg); }
.report-apply-area .his-report .a-his .material-icons { font-size: 16px; position: relative; top:2px;}


@media (max-width: 1200px) {
	.manual-wrap { padding: 0 0 0 430px;}
	.report-apply-area { width: 430px; }
}
@media (max-width: 1024px) {
	.report-apply-area { padding: 30px; width:370px; }
	.report-apply-area .btn-style-wrap .button { padding:0 20px; height: 40px; font-size: 1.4rem;}
	.manual-wrap { padding-left: 370px;}
	.system-manual-area-wrap .system-manual { padding: 20px}
}
@media (max-width: 768px) {
	.manual-wrap { padding: 110px  0 0 0; margin-top: 20px; text-align: center;}
	.report-apply-area { top:-70px; left:20px; width:calc(100% - 40px); bottom:auto; z-index: 2; }
	.report-apply-area .title { font-size: 1.4rem; padding-bottom: 15px;}
	.report-apply-area .btn-style-wrap { margin-bottom:15px;}
	.report-apply-area .btn-style-wrap .button { height:38px; padding: 0 15px;}
}
@media (max-width: 490px) {
	.manual-wrap { width: 100%; }
	.manual-wrap .manual-button a.mual-btn { margin-bottom: 4px; display: block;}
}
@media (max-width: 410px) {
	.manual-wrap .manual-title { text-align: center;}
	.manual-wrap .manual-group { width: 100%; text-align: left; margin-right: 0;}
	.manual-wrap .manual-group .tit { width: 50%; display: inline-block; }
	.manual-wrap a.mual-btn { padding: 0 7px; margin-right: 0;}
	.report-apply-area { padding: 30px 20px; text-align: center; }
	.report-apply-area .his-report .a-his { font-size: 1.3rem; }
}
@media (max-width: 355px) {
	.report-apply-area .title br { display:none;}
	.report-apply-area .title { font-size: 1.3rem; }
	.report-apply-area .btn-style-wrap .button { margin-left: 5px; font-size: 1.3rem; padding: 0 5px;}
	.manual-wrap .manual-group .tit { font-size:1.2rem; }
	.manual-wrap a.mual-btn { font-size: 1.1rem; padding: 0 5px;}
}