@charset "utf-8";
/* CSS Document */
@import 'https://fonts.googleapis.com/css?family=Alfa+Slab+One';
@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url('https://fonts.googleapis.com/css?family=Oswald:600');
@import 'https://fonts.googleapis.com/css?family=Josefin+Sans';
@import url("dis-non_replacementKeyword.css");

main {padding:0 15px;}

/**============================================================================================**/
/* パンくず */
#pankuzu {margin:0 0 40px;}
#pankuzu a {text-decoration: none;}

#pankuzu a {color: #535353; text-decoration: none;}
#pankuzu a:hover {color:#f50; text-decoration: underline;}
    
    @media screen and (max-width:1024px) {
    #pankuzu {
        position: static; top: auto; left:auto;
        margin:20px 0 40px;}
    }

    @media screen and (max-width:699px) {
    #pankuzu {
        overflow-x: scroll; white-space: nowrap;
        margin:20px 0 10px; padding:3px; background: #D8D8D8;}

    #pankuzu div {display: inline-block; padding: 5px 5px 0;}

    /* スクロールバーの装飾 */
    #pankuzu::-webkit-scrollbar {height: 8px;}
    #pankuzu::-webkit-scrollbar-track {background-color: rgba(235, 235, 235, 1.0);}
    #pankuzu::-webkit-scrollbar-thumb {background-color: rgba( 150, 150, 150, 0.8);}
    }


/**============================================================================================**/
#form {max-width: 1020px; margin: 20px auto 50px; font-size: 16px;}

#form section {margin: 0 0 50px;}

#contact li {display: inline-block; margin: 0 20px 0 0;}
#contact li img {width: auto; max-width: 350px;}

/*--タイトル--*/
#form h2 {
	margin: 50px 0 20px; padding: 0 0 5px;
    border-bottom: solid 2px #960002;
    font-size: 1.4em; font-weight: bold; line-height: 1.3em;}

/*--h3--*/
#form h3 {box-sizing: border-box;
	width: 340px; margin: 10px 0 20px; padding: 0 0 0 10px;
    border-left: solid 5px #b60005;
	font-size: 20px; font-weight: bold;
}
/*--h3名--*/
#form .num h3 {position: relative; width: auto; margin: 0 0 20px; padding: 0 0 0 25px; border: none; font-size: 15px;}
/*--h3番号--*/
#form .num h3::before {
	content: ''; display: inline-block;
	position: absolute; top: 0; left: 0;
	width: 20px; height: 20px;}
#sct01 h3::before {background: url(/info/images/icon-no1_w20.gif);}
#sct02 h3::before {background: url(/info/images/icon-no2_w20.gif);}
#sct03 h3::before {background: url(/info/images/icon-no3_w20.gif);}
#sct04 h3::before {background: url(/info/images/icon-no4_w20.gif);}

/*--h4--*/
#form h4 {padding: 5px;
	border-bottom: double 5px #333;
	font-size: 20px; font-weight: bold;
}

/*--画像--*/
#form img {max-width: 100%; height: auto;}


/**============================================================================================**/
#form .dis-tbl_tab {width: 100%; font-size: 14px;}

/* 項目名 */
#form .dis-tblcl01 {
	box-sizing: border-box;
	width: 300px; padding: 4px 30px 0 0;
	color: #333; font-weight: 600; text-align: right;}

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

#form .dis-tblcl01 {padding: 0 0 5px; text-align: left;}
}


/* 必須 */
#form .reqmk {
	display: inline-block;
	margin: 0 0 0 10px; padding: 2px;
	border: solid 1px #C74A4C;
	color: #C74A4C; font-weight: bold;}

/* 入力欄 */
#form input:not([type="file"]),
#form textarea,
#form select {
	box-sizing: border-box; width: 100%; padding: 3px 8px;
	border: solid 1px #CCC; border-radius: 3px;
	color: #000; font-size: 16px;}

#form input::placeholder,
#form textarea::placeholder,
#form select::placeholder { color: #888;}

#form input[type="text"],
input[type="email"],
input[type="tel"],
select {height: 34px;}

select[size="5"] {height: auto; margin: 0 0 10px;}

#form input[type="checkbox"] {max-width: 16px; height: 16px; padding: 0; vertical-align: middle;}

#form input[type="submit"] {max-width: 90px; height: auto; padding:10px; font-weight:bold;}
#form input[type="submit"]:hover,
#form input[type="button"]:hover {
	background: -webkit-gradient(linear, center top, center bottom, from(#FFF), to(#CCC));
	cursor: pointer;}

#form input[type="button"] {max-width: 200px; height: auto; padding: 10px;}
#print input[type="button"] {max-width: 200px; height: auto; padding: 5px;}


#form input[type="radio"],
#form select {width: auto;}

*[required],
.required {background: rgba(255, 221, 221, 0.7);}
*[required].dealed,
.required.dealed/*,
.caution*/ {
	background: rgba(223, 240, 216, 1);}
/*--オートコンプリート用--*/
input:-webkit-autofill {box-shadow: 0 0 0px 1000px rgba(223, 240, 216, 1) inset;}

*[readonly] {
	cursor: not-allowed;
	background-color: #eee;
}

/* 添付ファイルサムネイル用 */
#form div.mfp_attached_thumbnails ul li a img { max-width: 80px;}
#form div.mfp_attached_thumbnails ul:after {display: block; clear:both; content: "";} 

/* 添付ファイルリセット用 */
button.mfp_attached_reset { margin: 10px 0 0;}

#form p.asterisk {position: relative; padding: 0 0 0 18px;}
#form p.asterisk::before {content:'※'; position: absolute; top: 0; left: 0;}


/*--入力欄の幅--*/
#form .w85 {max-width: 85px;}
#form .w350 {max-width: 350px;}
#form .w550 {max-width: 550px;}


@media screen and (max-width:699px){
	#form input,
	#form textarea {max-width: 100%;}

    #form p.asterisk.pc { display: none;}
}


/**============================================================================================**/
/* 入力欄に対する説明文 */
#form p {color: #737373;}
#form p.red {color: #d00;}

#form p.ex {position: relative; padding: 0 0 0 26px;}
#form p.ex:before {
	content:'例'; 
	display: inline-block; position: absolute; top: 1px; left: 0;
	padding: 5px 4px 4px; 
	border-radius: 3px; background: #999;
	color: #fff; font-size: 10px; line-height: 1.0em;}

#form li {padding: 0 0 0 1em; color: #737373; text-indent: -1em;}

/*--説明文 フォーム末尾--*/
#form .comment {margin: 0 0 50px; padding: 15px; border:solid 2px #e00; color: #333; line-height: 1.3em; text-align: left;}
#form .comment li {padding: 0 0 0 2em; color: #333; text-indent: -2em;}

#form hr {margin: 0 0 50px; border-width: 1px 0 0; border-style: dotted;}

#form hr[style="border: none; clear:both;"] {margin: 0;}

@media screen and (max-width:699px){
	#form .comment {margin: 0 0 30px;}
}


/* アラート表示 */
#form .alrt {display: block; margin: 5px 0 0; color: #f00;}


/*--同意ボタン--*/
#form .bg label {padding: 10px 15px; background: rgba(255, 221, 221, 0.7); font-weight: 600; cursor: pointer;}

@media screen and (max-width:699px){
	#form .bg label {display: block;}
}

#form .bg_red {padding: 5px; background: rgba(255, 221, 221, 0.7);}


/**============================================================================================**/
/* テーブル用 */
.cover {width: 680px; margin: 0 auto;}
.ovfscl {margin: 0 0 50px;}
.cover table {width: 100%; font-size:12px; line-height:1.3em; margin-bottom:20px;}
@media screen and (max-width:699px){
	p.dis-non {display: block; font-size:12px; line-height:1.5em;}
	.ovfscl {overflow: scroll;}
}


/**============================================================================================**/
/* オーダーデッキマット用 */
section#color {max-width: 600px; margin: 0 auto 50px;}

#color h3 {
	box-sizing: border-box;
    width: 100%; margin-bottom: 15px; padding: 7px 10px 5px 10px;
    border: none; background: #004885;
    color: #fff; font-size: 1.2em; font-weight: 600;
    text-align: left;
}
#color label {display: inline-block; width: 33%; text-align: center; vertical-align: top;}
#color img {display: block; max-width: 70px; margin: 0 auto 10px;}

/*自動読取り上書き用*/
.form-group { display: table; margin: 0 0 20px;}
label.col-sm-2.control-label {
	display: table-cell;
	box-sizing: border-box;
    width: 300px; padding: 0 30px 0 0;
    text-align: right;    
}

/**============================================================================================**/
/* 23.08.17追加分 */

/* 項目名 */
#form .dis-tbl_tab01 { width: 100%; max-width: 760px; margin: 0 auto; font-size: 14px;}
#form .dis-tbl_tab01 .dis-tblcl01 { width: 60px;}

#form img#item-img {width: 100%; max-width: 700px; height: auto;}

/* タイプとカラーを選択 */
#ordersheet_sel .form-group { display: block;}
#ordersheet_sel .form-group:before, 
#ordersheet_sel .form-group:after { content: " "; display: table;}
#ordersheet_sel .form-group:after { clear: both;}

#ordersheet_sel label.col-sm-2.control-label {
	display: block; float: left;
    width: 30%; padding: 7px 15px 0 0;
    font-size: 14px; font-weight: bold; line-height: 1.5em;}

#ordersheet_sel .reqmk { margin: 0;}
#ordersheet_sel label[for="atype"] .reqmk { margin: 0 0 0 10px;}

#ordersheet_sel .input-group-addon { 
    display: block; position: absolute; top: 0; left: 15px;
    box-sizing: border-box; width: 30px; height: 34px; padding: 9px 0 0; 
    border: solid 1px #ccc; border-radius: 4px 0 0 4px;    
    background: #eee;
    color: #555; font-size: 14px; line-height: 1; text-align: center;}


#ordersheet_sel .input-group.posi-rlt {
    float: left;
    box-sizing: border-box; width: 35%; padding: 0 0 0 45px;}

#form #ordersheet_sel select {width: 100%; border-radius: 0;}

#ordersheet_sel select[disabled] {
    cursor: not-allowed;
    background-color: #eee;}

@media screen and (max-width:768px){
    #ordersheet_sel label.col-sm-2.control-label { width: 100%; padding: 7px 15px; text-align: left;}
    #ordersheet_sel .input-group.posi-rlt {width: 50%;}
}

@media screen and (max-width:699px){
    #ordersheet_sel .input-group.posi-rlt {width: 100%; margin: 0 0 5px;}
}

/**========================================**/
/* ステッチカラーをお選び下さい。 */
#stitch:not(.dis-tbl_tab)::before, 
#stitch:not(.dis-tbl_tab)::after { content: " "; display: table;}
#stitch:not(.dis-tbl_tab)::after { clear: both;}

#stitch:not(.dis-tbl_tab) label {
    position: relative; float: left;
	box-sizing: border-box; width: 30%; padding: 7px 15px 0;
    font-size: 14px; font-weight: bold; line-height: 1.5em; text-align: right;}

#stitch .hissu { 
    float: left;
    box-sizing: border-box; width: 33%; padding: 0 15px;}

#stitch select { width: 100%;}

@media screen and (max-width:768px){
    #stitch label { width: 100%; padding: 7px 15px; text-align: left;}
    #stitch .hissu { width: 50%; padding: 0 0 0 15px;}
}

@media screen and (max-width:699px){
    #stitch .hissu { width: 100%; padding: 0 0 0 15px;}
}

/**========================================**/
/* シート張り替え */
#seat-change .dis-tblcl01 {
    box-sizing: border-box; width: 30%; padding: 0 30px 0 15px;
    font-weight: bold; text-align: right;}

@media screen and (max-width:768px){
    #seat-change .dis-tblcl01 { width: 100%; padding: 7px 15px; text-align: left;}
    #seat-change .dis-tblcl02 { padding: 0 15px;}
}

@media screen and (max-width:699px){
}


/**========================================**/
/* AIチャットボット用 */
#chatbot,
.dis-tbl_tab:has(#chatbot) + .dis-tbl_tab #other { height: 200px;}

/*--LastUp2026.01.15_shinkai--*/