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

楽ペン　コンタクトフォームカスタムCSS

******************************/

/*メールフォーム要素のpタグmarginリセット*/
.contact-formBox p, div input[type="number"] {margin-bottom: 0;}

/*入力項目のmargin top*/
.Fflex {margin-top: 25px;}

/*各項目のmarginリセット*/
select.wpcf7-form-control.wpcf7-select, input.wpcf7-form-control.wpcf7-text, textarea.wpcf7-form-control.wpcf7-textarea{margin-bottom: 0;margin-top: 2px;}

/*名前・アドレス入力のplaceholder 設定*/
input.wpcf7-form-control.wpcf7-text.FName::placeholder, 
input.wpcf7-form-control.wpcf7-text.wpcf7-email.wpcf7-validates-as-required.wpcf7-validates-as-email.Fdefa::placeholder,
input.wpcf7-form-control.wpcf7-text.FmiddleW::placeholder,input.wpcf7-form-control.wpcf7-text.FAd::placeholder, 
textarea.wpcf7-form-control.wpcf7-textarea.Fmemo::placeholder,
input.wpcf7-form-control.wpcf7-number.wpcf7-validates-as-number.est-ef.FAd.input4::placeholder,
input#surface::placeholder,
input#stories::placeholder{color: #bbb;}

/*ドロップダウン*/
select.wpcf7-form-control.wpcf7-select.wpcf7-validates-as-required.Fselect {color: #333;width: 300px;}
@media only screen and (max-width:799px){select.wpcf7-form-control.wpcf7-select.wpcf7-validates-as-required.Fselect {width:100%;}}

/*input short width*/
input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required.FshortW {width: 150px;text-align: right;}
input.wpcf7-form-control.wpcf7-text.FshortW {width: 150px;text-align: right;}
input.wpcf7-form-control.wpcf7-text.FAd {width: 150px;}

input.wpcf7-form-control.wpcf7-number.wpcf7-validates-as-required.wpcf7-validates-as-number.est-ef.FshortW.input1,
input.wpcf7-form-control.wpcf7-number.wpcf7-validates-as-number.est-ef.FshortW.input2,
input.wpcf7-form-control.wpcf7-number.wpcf7-validates-as-required.wpcf7-validates-as-number.est-ef.FshortW.input3,
input.wpcf7-form-control.wpcf7-number.wpcf7-validates-as-required.wpcf7-validates-as-number.est-ef.FAd.input4
{width: 150px;}

/*備考欄*/
@media only screen and (max-width:799px){textarea.wpcf7-form-control.wpcf7-textarea.Fmemo {padding: 5px;}}

/* 必須の調整 */
.Frequired { font-size:8pt;padding:5px;background:#ff5b5b;color:#fff;border-radius:3px;margin-right: 3px;}
.Fany { font-size:8pt;padding:5px;background:#6bbf8d;color:#fff;border-radius:3px;margin-right: 3px;}

/*submit button*/
.Fsubmit {text-align: center;margin-top: 15px;}
.Fsubmit input[type="submit"] {    width: 260px;font-size: 2.2rem;font-family: "Rounded Mplus 1c";}

/*sp画面　幅調整*/
@media only screen and (max-width:414px){.contact-formBox {position: relative;left: -10px;width: 106%;}}

/*h3*/
h3.estimateh3 {border: none;margin: 0 0 0 -45px;padding: 20px 0 10px;font-size: 25px;font-weight: 500;}
h3.estimateh3.estorange {background-color: #e6771d;}
h3.estimateh3.estgreen {background-color: #6bbf8d;}
h3.estimateh3.estred{    background-color: #da4127;}

h3.estimateh3.esth {
margin: 0px 0 15px -50px;
padding: 10px 0;
width: calc(100% + 100px);
color: #fff;
font-size: 20px;
padding-left: 40px;
font-family: "Rounded Mplus 1c";
}

@media only screen and (max-width:414px){h3.estimateh3{font-size: 20px;padding-left: 5px;}}

/*font-size*/
span.Fitem {font-weight: 500;font-size: 1.7rem;}

/*table*/
table.Fuser {width: 100%;}
table.Fuser td {text-align: left;border: 1px solid #dbdbdb;border: 1px solid #bfbfbf;padding: 5px;font-weight: 500;}
td.Est-td-l {width:30%;background: #f6f6f6;}
td.Est-td-r {width:70%;}
@media only screen and (max-width:414px){table.Fuser td{padding:3px 10px;font-size: 1.5rem;}}
/*必須・任意text*/
td span.Frequired, td span.Fany {float: right;padding: 0 5px;}
@media only screen and (max-width:414px){td span.Frequired, td span.Fany {float: unset;padding: 0 5px;display: block;text-align: center;}}

/*new contact form*/
/*フォーム内paddingとheightの調整*/
select.wpcf7-form-control.wpcf7-select.wpcf7-validates-as-required.est-ef, input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required.est-ef, input.wpcf7-form-control.wpcf7-text.est-ef, input.wpcf7-form-control.wpcf7-number.wpcf7-validates-as-required.wpcf7-validates-as-number.est-ef, input.wpcf7-form-control.wpcf7-number.wpcf7-validates-as-number.est-ef.FshortW.input2, input.wpcf7-form-control.wpcf7-text.p-region.p-locality.p-street-address.p-extended-address{padding: 0 10px;height: 30px;color: #333;}
textarea.wpcf7-form-control.wpcf7-textarea.est-ef {padding: 0 10px;height: 130px;}

.est-ef.input5, .est-ef.input6, .est-ef.input7, .est-ef.input8{width: 300px;}

/*項目・質問*/
p.entry-q {margin-bottom: 0px;font-size: 17px;font-weight: 500;}
.entry-form-sec .Frequired, .entry-form-sec .Fany {font-size: 11px;padding: 2px 10px;margin-left: 20px;}

/*section*/
.entry-form-sec {padding: 0 50px 0;margin: 0 auto;width: 700px;border: 1px solid #eee;margin-bottom: 30px;background: #fff;}

/*項目section*/
.entry-row {margin-bottom: 30px;}

/*ラジオボタン margin*/
span.wpcf7-list-item.first {margin: 0;}

/*h4*/
h4.estimateh4 {border: none;margin-top: 15px;padding-left: 0;}

/*注意文*/
p.entry-notice {font-size: 13px;color: #ff5b5b;margin-bottom: 10px;}

/*見積依頼ページのリンクを非表示*/
.page-id-2124 footer, .page-id-2124 .est-banner, .page-id-2124 .head_est{display: none;}

.page-id-2124 .copyright a, .page-id-2124 .copyright p a, .page-id-2124 .breadcrumbs a {pointer-events: none;}

/*見積page background*/
.page-id-2124 div.page-wrap, .page-id-2124 div.col-md-12,
body.custom-background.page-id-2124 {background: #f2f2f2;}
.page-id-2124 header div.col-md-12{background: #fff;}
.page-id-2124 .bottom div.col-md-12{background: #1b1b1b;}
.page-id-2124 div.section {padding: 0;padding-bottom: 150px;}

/*mobile*/
@media only screen and (max-width:414px){
.entry-form-sec {padding: 0 10px;width: 100%;}
h3.estimateh3.esth{margin-left: -10px;width: calc(100% + 20px);font-size: 16px;text-align: center;padding-left: 0;}
.page-id-2124 .head-banner{display: none;}
}

/**/
/* エラー個所をわかりやすく表示 */
.wpcf7 .wpcf7-not-valid { background: #f15a5b36; }
.wpcf7 span.wpcf7-not-valid-tip {font-size: 80%;}
.wpcf7 .wpcf7-response-output {margin: 10px 0 0; padding: 8px 35px 8px 14px; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.wpcf7 .wpcf7-validation-errors {color: #B94A48; background-color: #F2DEDE; border: 1px solid #EED3D7;}
.wpcf7 .wpcf7-mail-sent-ok {color: #3A87AD; background-color: #D9EDF7; border: 1px solid #BCE8F1;}
span.wpcf7-not-valid-tip:before {content: "\f071";font-family: "fontawesome";}

/*モバイルnav 非表示*/
@media only screen and (max-width:414px){.page-id-2124 .nav-wrap{pointer-events: none;}.page-id-2124 .nav-wrap .btn-menu span, .page-id-2124 .nav-wrap .btn-menu:before, .page-id-2124 .nav-wrap .btn-menu:after{background:#fff;}}

/*注意書き*/
span.notice-small {font-size: 13px;}

/*sticky header 非表示*/
.page-id-2124 .header.header-sticky{display: none;}

/*first section*/
.entry-form-sec.first-entry-sec {margin-top: 15px;}

/*margin*/
input.wpcf7-form-control.wpcf7-text.est-ef.FName.input8,
input.wpcf7-form-control.wpcf7-text.est-ef.FName.input9,
input.wpcf7-form-control.wpcf7-text.est-ef.FName.input10 {margin: 5px 0;width: 150px;}

/*copyright 差し替え*/

.page-id-2124 .copyright p {display: none;}
.page-id-2124 .copyright:before {content: "©2018 Rakuraku Paint";display: block;width: 100%;color: #fff;}

/*est box display*/
.page-id-2124 .estimation--fixed{display: none;}

.estimation.estimation--fixed input {padding: 0 0 0 10px;height: 30px;margin: 0;border: 1px solid #d7d7d7;border-radius: 3px;width: 99%;}

div#output-container.estpo {width: 185px;height: 175px;border: 2px solid #0dac67;position:fixed;top: 300px;right: 350px;padding: 5px;background: #fff;text-align: center;padding: 25px 10px;position: fixed;}
.estimation__label.estpl {color: #0dac67;font-size: 25px;font-weight: 600;margin-bottom: 10px;font-family: "Rounded Mplus 1c";}
input#total-amount.estpt {font-size: 24px;padding: 0 2px 0 0;margin-top: 30px;}

@media only screen and (max-width:1360px){
	div#output-container.estpo {background:#fff;bottom: 0;left: 0;top: unset;width: 100%;height: 70px;padding: 5px 0 0; z-index: 99999;}
	.estimation__label.estpl {font-size: 17px;text-align: center;}
	input#total-amount.estpt {height: 38px;padding: 0;text-align: center;margin:0;}
}

.page-id-2124 input[type="text"], .page-id-2124 span input, .page-id-2124 textarea {box-shadow: inset 0 1px 3px 0 rgba(0,0,0,.07);border-radius: 3px;}