@charset "utf-8";


/*---mobile用共通201802---*/
@media screen and (max-width:640px){
    .onlypc{
        display: none !important; 
    }
    .onlysp{
        display: block; 
    }
    
    /*---左上ロゴ---*/
    .sp-logo a img {
    margin: 0;
    margin-left: 5px;
    padding-top: 10px;
    border: none;
    max-width: 155px;
    display: inline-block;
    box-sizing: border-box;
    }
    
    .f-right{
        float: right;
    }
    .f-left{
        float: left;
    }
    
    #drawermenu{
        padding:0px!important;
        width:156px!important;
    }
 /*   h1{
        font-size: 0.5rem;
        border-bottom: 1px solid #ccc;
    }*/
    
    /*---ボタン---*/
    .sp-btn-g{
        background-color: #98cb00;
        width: 50px;
        height: 50px;
        padding: 0;
        display: inline-block;
        margin-top: 10px;
        margin-left: 2px;
		margin-right: 0;
        margin-bottom: 10px;
        box-sizing: border-box;
		text-align: center;
    }
    .sp-btn-g li a{
        color:#fff;
		font-weight: 600;
        line-height: 1;
        font-size: 0.5rem;
        text-align: center;
        text-decoration: none;
    }
    .sp-btn-g li img{
        width: 15px;
        height: auto;
		vertical-align: middle;
		margin-top: 8px;
    }
    .sp-btn-g li img.m-img{
        width: 15px;
        height: auto;
        vertical-align: middle;
        margin-top: 13px;
    }
	
	.sp-btn-w {
		background-color: #fff;
		width: 40px;
		height: 40px;
		padding: 0;
		display: inline-block;
		margin-top: 10px;
		margin-right: 0;
		margin-bottom: 10px;
		box-sizing: border-box;
		color: #fff;
	}
    
    
    /* -- drawer custom -- */
    .drawer-hamburger {
	/*	background-color: #98cb00;*/
		position: absolute;
    }
    .drawer-hamburger{
        width:3.5rem;
        width:22px;
        margin-right:0px;
        top: 1rem;
        top: 0px;
		padding-top: 19px;
		padding-bottom: 31px;        
        right: 0px;
    }
    .drawer-hamburger:hover {
    cursor: pointer;
   /* background-color: #98cb00;*/
    }
    .drawer--right .drawer-nav {
    right: -20.25rem;
    -webkit-transition: right .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
    transition: right .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
    }
    .drawer-hamburger-icon ,
    .drawer-hamburger-icon:after,
    .drawer-hamburger-icon:before {
        background: #fff;
		line-height: 1;
    }
	.drawer-hamburger-icon:before, 
	.drawer-hamburger-icon:after {
		position: absolute;
		top: -6px;
		left: 0;
		content: ' ';
	}
	.drawer-hamburger-icon:after {
    	top: 6px;
	}
    
    .drawer-hamburger-icon:after{
        content:"MENU";
        font-size: 0.5rem;
    	font-weight: 600;
        line-height:2;
		text-align: center;
        color:#fff ;
    }
    .drawer-open .drawer-hamburger-icon:after{
        content:"";
        line-height:0;
    }
    .drawer--right.drawer-open .drawer-hamburger {
        right: 0;
        top: 0;
    }
    .drawer--left .drawer-nav {
        left: -20rem;
    }
    .drawer-nav {
        top: 53px;
		width: 14rem;
		height: 25rem;
		color: #fff;
		background-color: #5e8414;
		z-index: 99;
		right: 0;
    }
    .drawer-overlay {
        background-color: rgba(0,0,0,0);
        z-index:0;
    }
    .drawer-nav a{
        color:#fff;
        display:block;
        height: 20px;
        height: auto;
		width: 100%;
		text-decoration: none;
        line-height:1.3rem;
        padding: 0;
    }
    
 /*   .drawer-nav > li{
        border-bottom:1px solid #ccc;
    }
    .drawer-nav > li:last-child{
        border:none;
    }*/
	.drawer-menu > li{
        border-bottom:1px solid #90949c;
    }
    .drawer-menu > li:last-child{
        border:none;
    }
    
    .drawer--right.drawer-open .drawer-hamburger {
    right: 0;
    }
	.drawer-menu-item {
		font-size: 0.8rem;
		display: block;
		padding: 0.6rem 0 0.6rem 1.5rem;
		text-decoration: none;
		text-align: left;
	}
    .drawer-menu-item:hover{
        background-color: #98cb00;
        text-decoration: none;
    }
	
	
	/*アコーディオン*/

	.accordion {
		min-width: 100%;
		margin: 2px auto 4px;
		padding: 0;
	}
	.accordion .ac-content {
		margin: 0;
		padding: 0;
	}
	.accordion input {
		display: none;
	}
    
/*	.accordion label {
		display: block;
		background: #fff;
		cursor: pointer;
		padding: 5px;
		color: #000;
		border-bottom: 1px solid #ccc;
	}
	.accordion label:hover {
		background: #f5f5f5;
	}
    */
    
	.accordion .ac-cont {
		-webkit-transition: 0.2s;
		transition: 0.2s;
		height: 0;
		overflow: hidden;
		/*background: #fff;*/
		padding: 0 10px;
	}
	.accordion input:checked + .ac-cont {
		height: auto;
		padding: 10px 1.5em;
		box-sizing: border-box;
	}
    
    .accordion .ac-cont ul li{
        padding:5px 0 ;
    }
    
/*-----オレンジボタン-------*/
    .orenge-btn{
        padding: 4px;
        text-decoration: none;
        font-size: 1.1rem;
        vertical-align: middle;
        line-height: 1;
        color: #000;
        background-image: -webkit-linear-gradient(#f9dc2a 0%, #EAAB1C 100%);
        background-image: linear-gradient(#f9dc2a 0%, #EAAB1C 100%);
        -webkit-transition: .4s;
        transition: .4s;
        cursor: pointer;
		margin:2px 0;
		position: relative;
        border: 1px solid #ffffff;
        box-shadow: 0px 0px 0px 2px #fed21f;
        width: 97%;
    }
    .orenge-btn:hover{
        background-image: -webkit-linear-gradient(#FFC60B 0%, #EAAB1C 50%);
        background-image: -webkit-linear-gradient(#FFC60B 0%, #EAAB1C  50%);
        background-image: linear-gradient(#FFC60B 0%, #EAAB1C  50%);
    }
	.orenge-btn a{
		color: #000;
		text-decoration: none;
		display: block;
	}
    .orenge-btn img{
        width: 9%;
        height: auto;
        margin: 1px 5px 1px 1px;
        vertical-align: middle;
    }
    .orenge-btn:after {
        position: absolute;
        content: '\f105';
        color: #fff;
        font-family: fontawesome;
        font-size: 2rem;
        right: 13px;
        top: 2px;
    }
	
/*-----グリーンボタン右矢印-------*/
    .gr-btn02{
        padding: 4px;
        text-decoration: none;
        font-size: 1.1rem;
        vertical-align: middle;
        line-height: 1;
        color: #000;
        background-image: -webkit-linear-gradient(#afed1e 0%, #83b003 100%);
        background-image: linear-gradient(#afed1e 0%, #83b003 100%);
        -webkit-transition: .4s;
        transition: .4s;
        cursor: pointer;
		margin:2px 0;
		position: relative;
        border: 1px solid #ffffff;
        box-shadow: 0px 0px 0px 2px #a9e004;
        width: 97%;
    }
    .gr-btn02:hover{
        background-image: -webkit-linear-gradient(#afed1e 0%, #83b003 50%);
        background-image: -webkit-linear-gradient(#afed1e 0%, #83b003  50%);
        background-image: linear-gradient(#afed1e 0%, #83b003  50%);
    }
	.gr-btn02 a{
		color: #000;
		text-decoration: none;
		display: block;
	}
    .gr-btn02 img{
        width: 8%;
        height: auto;
        margin: 1px 10px 1px 1px;
        vertical-align: middle;
    }
    .gr-btn02:after {
        position: absolute;
        content: '\f105';
        color: #fff;
        font-family: fontawesome;
        font-size: 2rem;
        right: 13px;
        top: 2px;
    }
/*-----イメージボタン-------*/	
	.img-btn a img{
		width: 100%;
		margin: 0;
		margin:2px 0;
		cursor: pointer;
	}
/*-----カテゴリータイトルボタン-------*/
    .gr-btn{
        display: block;
        padding: 4px;
        text-decoration: none;
        font-size: 1.1rem;
        vertical-align: middle;
        line-height: 1;
        color: #000;
        background-image: -webkit-linear-gradient(#afed1e 0%, #83b003 100%);
        background-image: linear-gradient(#afed1e 0%, #83b003 100%);
        -webkit-transition: .4s;
        transition: .4s;
        cursor: pointer;
        border: 1px solid #ffffff;
        box-shadow: 0px 0px 0px 2px #a9e004;
        width: 97%;
    }
    .gr-btn:hover{
        background-image: -webkit-linear-gradient(#afed1e 0%, #83b003 50%);
        background-image: -webkit-linear-gradient(#afed1e 0%, #83b003  50%);
        background-image: linear-gradient(#afed1e 0%, #83b003  50%);
    }
    .gr-btn img{
        width: 8%;
        height: auto;
        margin: 1px 10px 1px 1px;
        vertical-align: middle;
    }
    .gr-btn:after {
        position: absolute;
        content: '\f107';
        color: #fff;
        font-family: fontawesome;
        font-size: 2rem;
        right: 13px;
        top: 2px;
    }
 	
    
    /*---topへ戻るボタン---*/
    #pageTop {
        position: fixed;
        bottom: 20px;
        right: 5%;
        opacity: 0;
        z-index: 99999;
        -webkit-transition: all .3s;
        transition: all .3s;
    }
    #pageTop.active{
        opacity: 1;
    }
    #pageTop a {
        display: block;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        width: 40px;
        height: 40px;
        background-color: #98cb00;
        color: #fff;
        text-decoration: none;
        text-align: center;
        outline: none;
    }
    #pageTop a i{
        font-size: 20px;
        line-height: 37px;
        vertical-align: middle;
        display: inline-block;
    }
    #pageTop a:hover {
    text-decoration: none;
    opacity: 0.7;
    }
    
    /*--sp用facebookボタン--*/
    
    
    i.fa.fa-facebook {
    background-color: #3b5998;
    border-radius: 15px;
    color: #fff;
    padding: 7px 9px 5px;
    display: inline-block;
    position: absolute;
    right: 20px;
    top: 10px;
    }
    
    
    /*----footer1.tpl----*/
    .side_bnr_contents_site.onlysp, 
    .side_bnr_contents_web.onlysp,
    .side_bnr_rateplan.s-bnr.onlysp,
    .side_bnr_sp01.s-bnr.onlysp {
    display: inline-block !important;
    width: 49%;
    }
    /*----buy_web_new_confirm.tpl----*/
    .p-left-0{
        padding-left: 0 !important;
    }

    /* 20180322追記 assess_web_application_new_input 用 */
    .assess{
        padding: 0 10px 10px;
    }
    .assess h4{
        color: #99C927;
        font-size: 1.8em;
        border-bottom: solid 1px #ccc;
        margin-top: 15px;
        line-height: 1;
    }   
    .assess p{
        padding: 5px 0 0 10px;
    }
    .assess p span{
        color: #900;
        font-weight: bold;
    }
    
    /* 20180406追記 sales_web_list.tpl 用　検索のアコーデオン表示 */
    
    /*アコーデオンのボックス全体*/
    .accbox {
        margin: 2em 0;
        padding: 0;
    }

    /*ラベル*/
    .accbox label.onlysp {
        display: block;
        margin: 0;
        padding : 11px 12px;
        color :#ffffff;
        background :#8e8e8e;
        cursor :pointer;
        transition: all 0.5s;
        border-radius: 4px;
    }

    /*ラベルホバー時*/
    .accbox label.onlysp:hover {
        opacity: 0.7;
    }
    
    
    /*チェックは隠す*/
    .accbox input.cssacc {
        display: none;
    }

    /*中身を非表示にしておく*/
    .accbox .accshow {
        height: 0;
        padding: 0;
        overflow: hidden;
        opacity: 0;
        transition: 0.8s;
    }

    /*クリックで中身表示*/
    .cssacc:checked + .accshow {
        height: auto;
        padding: 5px;
        opacity: 1;
    }
    
    
    /*---my_sales_web_application_confirm.tpl
    スマホモーダル用--*/
    
    #confirmBox{
        width: 100% !important;
        height:350px !important;
        text-align: center;
        margin: 0 auto;
    }
    
    #confirmBox > input.btn_sales_web_list_cancel ,
    #confirmBox > a > button.btn_sales_web_application_apply {
    float: none !important;
    display: block;
    width: 200px;
    height: 48px;
    background-size: 100%;
    margin: 0 auto !important;
    }
    
    
    
}