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

/* Clearfix
---------------------------------*/
.clearfix {
  min-height: 1px;
}

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}
.clear { clear:both; }

.clearfix:after {
    visibility: hidden;
    display: block;
    content: " ";
    clear: both;
    height: 0;
    }
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/*-------------------------
    標準フォーマット
--------------------------*/
body {
    margin: 0 auto;
}
.contents_area{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", "Kozuka Gothic Pro R", sans-serif;
	margin:0 auto;
	width:100%;
	max-width:1600px;
}

.pc{
	display:inherit;
}
.sp{
	display:none;
}

.top_area{
	margin:0 auto;
	background-image:url(https://www.roland.com/rolandcomsite/media/jp/proav/promos/v-02hd_ppc_cmp/main_back.jpg);
	background-repeat: no-repeat;
	background-size:cover;
	background-position: center;
	height:750px;
	position:relative;
	margin-bottom: 90px;
}
.top_area .title_image{
	position:absolute;
	left:0;
	right:0;
	margin:auto;
	width:85%;
	max-width: 735px;
	top: 216px;
}
.top_area .attention{
	font-size:12px;
	color: #cccccc;
	line-height: 17px;
	position:absolute;
	bottom:10px;
	margin: 0 auto;
	width: 95%;
	left: 0;
	right: 0;
}
.lead_area{
	margin:0 auto;
	width:90%;
	max-width:800px;
}
.lead_area .lead_text{
	font-size:20px;
	line-height:34px;
	color:#515151;
	margin-top: 70px;
	margin-bottom: 80px;
}
.main_area{
	margin:0 auto;
	width:90%;
	max-width:840px;
}
.main_area .s_wrap{margin-bottom: 70px;}
.main_area .s_wrap .wrap_title{
	margin:0 auto;
	margin-bottom: 60px;
}
.main_area .s_wrap .wrap_title .icon{
	display:inline-block;
	width: 65px;
	margin:0 auto;
	vertical-align: top;
	margin-right: 7px;
	margin-top: -9px;
}
.main_area .s_wrap .wrap_title .l_text{
	font-size:30px;
	font-weight:bold;
	line-height:38px;
	margin:0 auto;
	position:relative;
	padding-left: 78px;
	margin-bottom: 30px;
}
.main_area .s_wrap .wrap_title .l_text.search:before{
	width:65px;
	height:65px;
	background-size:64px;
	background-position:center;
	background-repeat:no-repeat;
	background-image:url(https://www.roland.com/rolandcomsite/media/jp/proav/promos/v-02hd_ppc_cmp/icon_search.png);
	position:absolute;
	content:"";
	left:0;
	top: -15px;
}
.main_area .s_wrap .wrap_title .l_text.craft:before{
	width:65px;
	height:65px;
	background-size:64px;
	background-position:center;
	background-repeat:no-repeat;
	background-image:url(https://www.roland.com/rolandcomsite/media/jp/proav/promos/v-02hd_ppc_cmp/icon_craft.png);
	position:absolute;
	content:"";
	left: 7px;
	top: -15px;
}
.main_area .s_wrap .present_title_box{
	margin:0 auto;
	margin-bottom: 40px;
	margin-top: 100px;
}
.main_area .s_wrap .present_title_box .l_text{
	font-size:30px;
	font-weight:bold;
	line-height:38px;
	margin:0 auto;
	position:relative;
	padding-left: 66px;
	margin-bottom: 24px;
	color: #ff5a00;
	border-bottom: 1px dotted #ccc;
	padding-bottom: 18px;
	letter-spacing: 2px;
}
.main_area .s_wrap .present_title_box .l_text span{
	font-size:14px;
	color:#515151;
	position: absolute;
	bottom: 25px;
}
.main_area .s_wrap .present_title_box .l_text:before{
	width: 65px;
	height:65px;
	background-size: 39px;
	background-position:center;
	background-repeat:no-repeat;
	background-image:url(https://www.roland.com/rolandcomsite/media/jp/proav/promos/v-02hd_ppc_cmp/icon_present.png);
	position:absolute;
	content:"";
	left: 0px;
	top: -19px;
}
.main_area .s_wrap .present_title_box .attention{
	font-size:13px;
	line-height:22px;
	margin-left: 65px;
	margin-top: -15px;
	color: #515151;
}


.main_area .s_wrap .wrap_name{
	font-size:35px;
	font-weight:300;
	line-height:43px;
	color:#515151;
	margin-top: 35px;
	margin-bottom: 35px;
	border-left: 17px solid #ff8100;
	padding-left: 20px;
}
.main_area .s_wrap .wrap_name span.small{
	font-size:20px;
	margin-right: 15px;
}
.main_area .s_wrap .wrap_name span.backline{
	background-image:url(https://www.roland.com/rolandcomsite/media/jp/proav/promos/v-02hd_ppc_cmp/backline.png);
	background-position: center 27px;
	background-repeat: repeat-x;
}
.main_area .s_wrap .image{
	margin:0 auto;
	width:100%;
}
.main_area .s_wrap .comment{
	font-size:15px;
	line-height:28px;
	font-weight:300;
	color:#515151;
	margin-top: 10px;
	margin-bottom: 10px;
}
.main_area .s_wrap .btn_product{
	margin:45px auto;
	width:80%;
	max-width:421px;
}
.main_area .s_wrap .btn_product a{
	padding: 15px 10px 15px 10px;
	display:block;
	background-color:#464646;
	color:#ffffff;
	position:relative;
	text-align: center;
	font-size: 16px;
	line-height: 25px;
	text-decoration: none;
	border-radius: 6px;
	box-shadow: 2px 2px 4px 0px #787878;
}
.main_area .s_wrap .btn_product a:after{
	content:"";
	width:20px;
	height:20px;
	background-position:center;
	background-repeat:no-repeat;
	background-size: 12px;
	background-image:url(https://www.roland.com/rolandcomsite/media/jp/proav/promos/v-02hd_ppc_cmp/icon_nav.png);
	position:absolute;
	right: 14px;
	top: 19px;
}
.main_area .s_wrap .btn_product a:hover{
	transition:0.4s;
	opacity:0.6;
}
.entry_back{
	background-color: #f6f6f6;
	padding-top: 40px;
	padding-bottom: 70px;
}
.entry_area{
	margin:0 auto;
	width:90%;
	max-width:840px;
	margin-bottom: 100px;
}
.entry_area .s_wrap{
	margin-bottom: 50px;
	counter-reset: number 0;
	}
.entry_area .s_wrap .wrap_name{
	font-size:35px;
	font-weight:300;
	line-height:43px;
	color:#515151;
	border-left: 17px solid #008aff;
	padding-left: 20px;
	margin-top: 35px;
	margin-bottom: 35px;
}
.entry_area .s_wrap .wrap_name span{
	font-size:20px;
}
.entry_area .s_wrap .comment{
	font-size:18px;
	line-height:26px;
	font-weight:300;
	color:#515151;
	margin: 0;
	margin-bottom: 10px;
	position:relative;
	
}
.entry_area .s_wrap .numb01{
	padding-left: 61px;
}
.entry_area .s_wrap .numb01:before {
    position: absolute;
    left: 0;
    counter-increment: number 1;
    content: "その" counter(number) ".";
}
.entry_area .s_wrap .numb02{
	padding-left: 25px;
}
.entry_area .s_wrap .numb02:before {
    position: absolute;
    left: 0;
    counter-increment: number 1;
    content: "" counter(number) ".";
}
.entry_area .s_wrap .attention_box{
	margin:0 auto;
	width:95%;
	margin-bottom: 30px;
	margin-top: 30px;
}
.entry_area .s_wrap .attention_box .attention_txt{
	font-size:15px;
	line-height:25px;
	position:relative;
	padding-left:18px;
	color:#515151;
	margin: 0;
	margin-bottom: 5px;
}
.entry_area .s_wrap .attention_box .attention_txt:before{
	content:"※";
	position:absolute;
	left:0;
	top:0;
}
.entry_area .s_wrap .attention_box .attention_txt.red{
	color:#F52F32;
}
.entry_area .s_wrap .btn_entry{
	margin:0 auto;
	width:80%;
	max-width:421px;
}
.entry_area .s_wrap .btn_entry a{
	padding: 15px 10px 15px 10px;
	display:block;
	background-color:#0088CB;
	color:#ffffff;
	position:relative;
	text-align: center;
	font-size: 16px;
	line-height: 25px;
	text-decoration: none;
	border-radius: 6px;
	box-shadow: 2px 2px 4px 0px #787878;
}
.entry_area .s_wrap .btn_entry a:after{
	content:"";
	width:20px;
	height:20px;
	background-position:center;
	background-repeat:no-repeat;
	background-size: 12px;
	background-image:url(https://www.roland.com/rolandcomsite/media/jp/proav/promos/v-02hd_ppc_cmp/icon_nav.png);
	position:absolute;
	right: 14px;
	top: 19px;
}
.entry_area .s_wrap .btn_entry a:hover{
	transition:0.4s;
	opacity:0.6;
	
}
.agreement_title{
	margin:0 auto;
	width:90%;
	text-align:center;
	font-size:25px;
	margin-top: 40px;
	margin-bottom: 30px;
	color: #515151;
}
.agreement_box{
	margin:0 auto;
	width:85%;
	max-width:700px;
	padding:4%;
	background-color: #eee;
	border: 1px solid #d5d2d2;
	height: 310px;
	overflow-y: scroll;
}
.agreement_box .comment{
	font-size:14px;
	line-height:23px;
	color:#515151;
	font-weight:100;
	margin-top: 0;
	margin-bottom: 5px;
}
.agreement_box .sub_name{
	font-size:14px;
	font-weight:bold;
	margin-top: 15px;
	margin-bottom: 10px;
}
.agreement_box .attention{
	font-size:14px;
	line-height:23px;
	color:#515151;
	font-weight:100;
	position:relative;
	padding-left:16px;
	margin: 0;
}
.agreement_box .attention:before{
	content:"※";
	position:absolute;
	left:0;
}
.agreement_box .comment_list{
	font-size:14px;
	line-height:23px;
	color:#515151;
	font-weight:100;
	position:relative;
	padding-left:16px;
	margin: 0;
}
.agreement_box .comment_list:before{
	content:"・";
	position:absolute;
	left:0;
}
.agreement_box .list_box{
	counter-reset: number 0;
}
.agreement_box .comment_numb{
	font-size:14px;
	line-height:23px;
	color:#515151;
	font-weight:100;
	position:relative;
	padding-left: 31px;
	margin: 0;
	margin-bottom: 5px;
}
.agreement_box .comment_numb .sub_comment{
	padding-left: 15px;
	margin-top: 2px;
}
.agreement_box .comment_numb:before {
    position: absolute;
    left: 0;
    counter-increment: number 1;
    content: "(" counter(number) ")";
}

@media only screen and (max-width: 1200px) {
}
@media only screen and (max-width: 768px) {
.top_area {
    height: 400px;
}
.top_area .title_image {
    top: 82px;
    max-width: 550px;
}
.lead_area .lead_text {
    font-size: 16px;
    line-height: 28px;
    margin-top: 40px;
    margin-bottom: 55px;
}
.main_area .s_wrap {
    margin-bottom: 50px;
}
.main_area .s_wrap .wrap_name {
    font-size: 22px;
    line-height: 30px;
    margin-top: 35px;
    margin-bottom: 35px;
    border-left: 9px solid #ff8100;
    padding-left: 9px;
}
.main_area .s_wrap .wrap_name span.backline {
    background-position: center 18px;
    background-repeat: repeat-x;
}
.main_area .s_wrap .comment {
    font-size: 14px;
    line-height: 24px;
    margin-top: 10px;
    margin-bottom: 10px;
}
.main_area .s_wrap .wrap_name span.small {
    font-size: 14px;
    margin-right: 15px;
}
.entry_area .s_wrap .wrap_name {
    font-size: 22px;
    line-height: 30px;
    margin-top: 35px;
    margin-bottom: 15px;
    border-left: 9px solid #008aff;
    padding-left: 9px;
}
.entry_back {
    padding-top: 20px;
    padding-bottom: 55px;
}
.entry_area .s_wrap .comment {
    font-size: 15px;
    line-height: 24px;
    margin-bottom: 10px;
}
.entry_area .s_wrap {
    margin-bottom: 35px;
}
.entry_area .s_wrap .btn_entry {
    margin: 0 auto;
    width: 90%;
}
.entry_area {
    margin-bottom: 50px;
}
.agreement_title {
    font-size: 20px;
    margin-top: 40px;
    margin-bottom: 25px;
}

}

/*------------デバイス別---------------*/

@media screen and (max-device-width: 1024px) {
}
@media screen and (max-device-width: 768px) {

}
@media screen and (max-device-width: 480px) {
.pc{
	display:none;
}
.sp{
	display:inherit;
}
.top_area {
    height: 315px;
    margin-bottom: 36px;
}
.top_area .title_image {
    top: 78px;
}
.main_area .s_wrap .wrap_title .l_text {
    font-size: 23px;
    font-weight: bold;
    line-height: 34px;
    margin: 0 auto;
    position: relative;
    padding-left: 0;
    margin-bottom: 11px;
    padding-top: 55px;
    text-align: center;
}
.main_area .s_wrap .wrap_title .l_text.search:before {
    width: 65px;
    height: 65px;
    background-size: 64px;
    left: 0;
    right: 0;
    margin: auto;
    top: -12px;
}
.main_area .s_wrap .wrap_title .l_text.craft:before {
    width: 65px;
    height: 65px;
    background-size: 64px;
    left: 0;
    right: 0;
    margin: auto;
    top: -5px;
}
.main_area .s_wrap .wrap_title {
    margin: 0 auto;
    margin-bottom: 26px;
}
.main_area .s_wrap .present_title_box {
    margin: 0 auto;
    margin-bottom: 40px;
    margin-top: 65px;
}
.main_area .s_wrap .present_title_box .l_text {
    font-size: 23px;
    line-height: 34px;
    padding-left: 0;
    margin-bottom: 24px;
    padding-bottom: 12px;
    letter-spacing: 2px;
    text-align: center;
    padding-top: 55px;
}
.main_area .s_wrap .present_title_box .l_text:before {
    width: 65px;
    height: 65px;
    background-size: 39px;
    left: 0px;
    right: 0;
    margin: auto;
    top: -19px;
}
.main_area .s_wrap .present_title_box .l_text.pen{
	padding-top:0;
}
.main_area .s_wrap .present_title_box .l_text.pen:before{
	display:none;
}
.main_area .s_wrap .present_title_box .attention {
    margin: 0 auto;
    margin-top: -15px;
}
}