/********COMMON STYLE*********/
.container{width: 100%; max-width: 960px; margin: 0 auto; padding: 0 0 60px; background: url(/g6/canpaign/image/common/bg_border_yellow.jpg) repeat;}
.column{position: relative; width:100%; max-width: 900px; margin: 0 auto; box-sizing: border-box; background: #fff;}
.boxshadow{box-shadow: 0px 3px 10px 0px #bbb;}

@media only screen and (max-width: 767px){
.container{width: 100%; max-width: 100%; padding: 0 0 30px;}
.column{max-width: 100%;}
}

/********TOP STYLE*********/

.mainvisual{width:100%; margin: 0 auto;}
.mainvisual .pc{text-align: center;}
.mainvisual .pc img:nth-of-type(2){margin: -30px auto 0; box-shadow: 0px 3px 10px 0px #bbb;}

.link_btn{width: 100%; max-width:960px; margin: 30px auto 0; text-align: center;}
.link_btn p{display: inline-block;}
.link_btn p a{display: block;}

.column{padding: 50px 40px;}
.column .pccoltitle{position: absolute; top: -80px; left: 50%; margin: 0 0 0 -450px;}

#oneclick_area{margin-top:100px;}
#campaign_area{margin-top:100px;}

.company_name{width:100%; text-align: center;}
.company_visual{width:auto; margin: 40px auto;}
.company_visual p{float: left;}
.company_visual p.thumbnail:hover{opacity: 0.7;transition: 0.5s ease-in-out;}

@media only screen and (min-width: 768px) and (max-width: 880px) {
.company_visual{width:100%;}
.company_visual p.thumbnail{width:30%;}
.company_visual p.txtpoint{width:70%;}
}

.company_flow_picture{margin: 40px auto;}
.company_flow_picture div{float: left; background: url(/g6/canpaign/image/common/icon_vec_right.png) no-repeat right top 80px; width: 25%; padding-right: 25px; box-sizing: border-box;}
.company_flow_picture div:last-of-type{background: none;}
.company_flow_picture div p{width: 100%; margin: 0 auto; letter-spacing: -1px; font-weight: bold; box-sizing: border-box; padding-left: 20px;}
.company_flow_picture div p b{color:#f6569e; display: block;}
.company_flow_picture div p small{display: block; font-size: 0.9em;}
.notsales{text-align: center; margin-bottom: 40px;}

p.btn{text-align: center; margin: 20px auto;}

.attention_box{width: 80%; border: #cccccc solid 2px; margin: 40px auto;}
.attention_box h2{background:#cccccc; padding: 10px 0; text-align: center;}
.attention_box h2 red{color: #d24c4c;}
.attention_inner{width: 92%; padding-right: 4%; font-size: 12px; margin: 20px auto; height: 200px; overflow-y: scroll;}
.attention_inner h4{font-weight: bold; margin-top: 20px;}
.attention_inner ul li{list-style: disc inside; margin-bottom:5px;}
.attention_inner ul li ul.childlist li{list-style: none; padding-left: 1em;}
.attention_inner span{text-align: right;display: block;}

.please_check{text-align: center;}
.check_box{text-align: center;}
.check_box span{margin-left: 5px; font-size: 18px;}
.check_box input{border: #999 3px solid; border-radius: 4px; padding: 10px; display: inline-block; vertical-align: middle; height:26px; width:26px;}


#campaign_area .column{background: url(/g6/canpaign/image/common/bg_check.jpg) repeat;}
#campaign_area .company_index{
    background-image: url(/g6/canpaign/image/top/bg_campaign.jpg);
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: top center;
    background-size:100% auto;
    padding: 30px 0 20px;
}
#campaign_area .company_visual{width: 96%; margin: 20px auto 0;}
#campaign_area .moresee{text-align: center; margin: 20px 0 0 50px;}
#campaign_area .moresee a{display: block;}


@media only screen and (max-width: 767px){
.mainvisual{margin: 0 auto;}
.mainvisual .sp{text-align: center;}
.mainvisual .sp span{text-align: left; margin: 20px auto; width: 96%; display: block;}
.mainvisual .sp span b{color: #f78e1e;}
.mainvisual .sp img:nth-of-type(2){margin: 0 auto; width: 96%; box-shadow: 0px 3px 10px 0px #bbb;}
    
.link_btn{max-width:100%; margin: 30px auto 0;}
.link_btn p{display: block; margin-bottom: 10px;}

#oneclick_area{margin-top:0;}
#campaign_area{margin-top:0;}

.column{padding: 20px 0; margin:0 auto;}
.column .pccoltitle{display: none;}
.spcoltitle{margin-top: 40px; width: 100%;}
.spcoltitle img{width: 100%; height: auto;}

.company_index{width:96%; margin: 0 auto;}
.company_visual{width:100%; margin: 20px auto;}
.company_visual p{float: left; width: 50%;}
.company_visual p img{width: 100%;}

.company_flow_picture{margin: 20px auto;}
.company_flow_picture div{float: none; background: url(/g6/canpaign/image/common/icon_vec_bottom.png) no-repeat bottom left 15%; width: 100%; padding-bottom: 20px; margin-bottom: 10px; background-size: auto 14px;}
.company_flow_picture div img{width: 30%; float: left; margin-right: 5%;}
.company_flow_picture div p{width: 65%; padding-top: 20px; float: left; padding-left: 0;}
.notsales{text-align: left; margin-bottom: 20px;}

p.btn{text-align: center; margin: 20px auto;}

.attention_box{width: 96%; margin: 20px auto;}
.attention_box h2 red{display:block;}
.attention_inner{height: 100px;}

.check_box span{margin-left: 5px; font-size: 14px;}
.check_box input{border: #999 3px solid; border-radius: 4px; padding: 10px; display: inline-block; vertical-align: middle;}
    
    
#campaign_area .company_index{
    background-image: url(/g6/canpaign/image/top/sp/bg_campaign.jpg);
}
#campaign_area .company_name{width: 96%; margin: 0 auto;}
#campaign_area .company_visual{width: 96%; margin: 20px auto 0;}
#campaign_area .moresee{text-align: center; margin: 0 auto; clear: both; float: none; padding-top: 20px; width: 100%;}
}





/********PAGE STYLE*********/
.landing{max-width: 880px; padding-bottom: 10px;}

.landing .catchtxt{font-size: 30px; font-weight: bold; text-align: center; margin: 40px auto;}
.landing .company_flow_picture{width: 96%;}

.landing .appeal_txt{width:96%; max-width:810px; margin: 0 auto 20px;}
.landing .appeal_txt h2.dotted{background: url(/g6/canpaign/image/common/bg_line_dotted_pink.jpg) repeat-x bottom left; font-size: 32px; padding-bottom: 4px; margin-bottom: 35px; font-weight: bold;}
.landing .appeal_txt div ul{float: left; width:50%; padding-top: 20px;}
.landing .appeal_txt div ul.dotlist li{list-style-image: url(/g6/canpaign/image/common/icon_list_style_circle_pink.jpg); list-style-position: outside; margin-left: 20px; font-weight: bold; margin-bottom: 10px; font-size: 16px;}
.landing .appeal_txt div ul.dotlist li red{color:#f6569e;}
.landing .appeal_txt div img{float: right;}
.landing .appeal_img{text-align: center;}

.privacy_link a{text-decoration: underline; text-align: center; display: block; margin: 40px auto 0;}

.contact{background:#fffddd; padding: 10px 20px; margin: 0 auto 40px; width: 70%;}
.contact p{margin-bottom: 5px;}
.contact p a{text-decoration: underline;}


@media only screen and (max-width: 767px){
.landing{max-width:100%;}

.landing .catchtxt{font-size: 18px; margin: 40px auto;}

.landing .appeal_txt{width:96%; max-width:96%; margin: 0 auto 20px;}
.landing .appeal_txt h2.dotted{font-size: 18px; padding-bottom: 10px; margin-bottom: 20px;}
.landing .appeal_txt div ul{float: none; width:100%; padding-top: 0;}
.landing .appeal_txt div ul.dotlist li{font-size: 14px;}
.landing .appeal_txt div img{float: none;}

.privacy_link a{text-decoration: underline; text-align: center; display: block; margin: 40px auto 0; width: 90%; font-size: 12px;}

.contact{padding: 10px; margin: 0 auto 20px; width: 96%; box-sizing: border-box; font-size: 12px;}
}