@charset "utf-8";
/* カラムの設定 */
article.w1000 {padding: 0 20px;}

@media screen and (max-width:699px){
article.w1000 {padding: 0 15px;}
}

footer {position: fixed; bottom: 0; left: 0; width: 100%}
@media screen and (max-width:699px){
footer {position:static;}
}

#form {max-width: 1000px; font-size: 14px;}

form#mailform {box-sizing: border-box; width:100%; max-width:725px; margin:0 auto 40px; padding:40px 0 0;}

/* 入力項目 */
/**============================================================================================**/
#form .dis-tbl_tab {width:100%;}

/* 項目名 */
#form .dis-tbl_tab > .dis-tblcl01 {width: 145px; padding: 0 15px 0 0; font-weight: bold; text-align: right;}

/* 必須アイコン */
#form .reqmk {
    display: inline-block; margin: 0 0 0 10px; padding: 2px;
    border: #C74A4C solid 1px; background:#fff;
    color: #C74A4C;}

@media screen and (max-width:699px){
#form .dis-tbl_tab,
#form .dis-tbl_tab > .dis-tblcl01,
#form .dis-tbl_tab > .dis-tblcl02 {display: block;}

#form .dis-tbl_tab > .dis-tblcl01 {padding:0 0 5px; text-align:left;}
}
/**============================================================================================**/


/* テキストボックス・テキストエリア */
/**============================================================================================**/
#form input[type="text"],
#form input[type="tel"],
#form input[type="email"],
#form select,
#form textarea {
	box-sizing: border-box; padding: 6px; 
	border: solid #ccc 1px; border-radius:4px; font-size: 16px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);}
	
/* テキストボックス・テキストエリア選択時 */
#form input[type="text"]:active,
#form input[type="tel"]:active,
#form input[type="email"]:active,
#form select:active,
#form textarea:active,
#form input[type="text"]:focus,
#form input[type="tel"]:focus,
#form input[type="email"]:focus,
#form select:focus,
#form textarea:focus  {
	outline:solid #66AFE9 1px;
	-webkit-box-shadow:0 0px 8px rgba(102,175,233,0.7);
    box-shadow:0 0px 8px rgba(102,175,233,0.7);}

/**========================================**/

/* 必須入力項目 */
#form *[required], 
#form .required { background-color: rgba(255, 221, 221, 0.7);}
#form *[required].dealed, 
#form .required.dealed {background-color: rgba(223, 240, 216, 1);}

/**========================================**/

/* 必須未入力のアラート */
#form .alrt { display: block; margin: 5px 0 0; color: #FF0000; font-size: 13px; }
#form .help-block {display:block; margin:5px 0 10px; color:#737373;}

/**========================================**/

/* メールアドレス入力確認用（未入力時は項目を非表示） */
#form .hide {display: none;}
#email_confirm {font-size: 28px; line-height: 1.2em;}
/**============================================================================================**/


#form .w20 {width: 20%;}
#form .w25 {width: 25%;}
#form .w30 {width: 30%;}
#form .w35 {width: 35%;}
#form .w40 {width: 40%;}
#form .w45 {width: 45%;}
#form .w50 {width: 50%;}
#form .w60 {width: 60%;}
#form .w70 {width: 70%;}
#form .w80 {width: 80%;}
#form .w90 {width: 90%;}
#form .w100 {width: 100%;}

@media screen and (max-width:699px){
#form .w20,
#form .w25,
#form .w30,
#form .w35 {width: 200px;}

#form .w40,
#form .w45,
#form .w50,
#form .w60 {width: 75%;}

#form .w70,
#form .w80,
#form .w90 {width: 100%;}
}

/* 入力欄の中の文字（placeholder） */
#form input::-webkit-input-placeholder {color:#999; font-size: 16px;}
#form nput:-moz-placeholder {color:#999; font-size: 16px;}
#form input::-moz-placeholder {color:#999; font-size: 16px;}
#form input:-ms-input-placeholder {color:#999; font-size: 16px;}
#form textarea::-webkit-input-placeholder {color:#999; font-size: 16px;}
#form textarea:-moz-placeholder {color:#999; font-size: 16px;}
#form textarea::-moz-placeholder {color:#999; font-size: 16px;}
#form textarea:-ms-input-placeholder {color:#999; font-size: 16px;}


/* ラジオボタン・チェックボックス */
#form ul.radio,
#form ul.check {font-size: 0;}
#form ul.radio li,
#form ul.check li {display: inline-block; box-sizing: border-box; padding: 5px 20px 5px 0; font-size: 14px;}

#form label {display: inline-block; position: relative; padding: 0 0 0 21px;}
#form input[type="radio"],
#form input[type="checkbox"] {position: absolute; top: 50%; left: 0; width: 16px; height: 16px; margin: -8px 0 0;}

@media screen and (max-width:699px){
#form label {padding: 0 0 0 23px;}
#form input[type="radio"],
#form input[type="checkbox"] {width: 18px; height: 18px; margin: -9px 0 0;}

}

/* 送信ボタン */
#form input[type="submit"] {
	padding:10px; font-size: 14px; cursor: pointer;
	border-radius:3px; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
	background: #ffffff; /* Old browsers */
background: -webkit-linear-gradient(#ffffff 0%, #e5e5e5 100%);
background: -o-linear-gradient(#ffffff 0%, #e5e5e5 100%);
background: linear-gradient(#ffffff 0%, #e5e5e5 100%); /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
}
#form input[type="submit"]:hover {background:#b1b1b1; color: #fff;}

/* LastUp2025.11.13_kimata */