@charset "utf-8";
/* CSS Document */



/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: リセットCSS                                                                                                                                                                ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

dl,dt,dd,pre,form,fieldset,input,textarea,blockquote,th,td { margin: 0; padding: 0; }
fieldset,img{ border: 0; vertical-align : middle; }
abbr,acronym{ border: 0; }
address,caption,cite,code,dfn,em,strong,th,var{ font-style: normal; font-weight: normal; }
input, select { color: #333; border: 1px solid #cccccc; background-color: #FFF; border-radius : 3px; }
input, select { -moz-appearance: menulist-button; -webkit-appearance: menulist-button; appearance: menulist-button; }



/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: 設定                                                                                                                                                                      ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

/*:: sectionの背景 ::*/
section.postmail { }
section.postmail.wrapper { min-height: 900px; background: linear-gradient(-225deg, #CCCCFF 0%, #EEE 56%, #99CCFF 100%); padding: 100px 0;}
section.contact { }
section.contact.wrapper { background: #CCCCFF; padding: 10px 0;}


/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: 各詳細ページ                                                                                                                                                               ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

/*:: ポストメールの左右枠 ::*/
.page-postmail { display: block; padding: 5% 5%; margin-bottom: 50px; background-color: #FFF; overflow: hidden;/* 高さ認識の為 */ }
.page-postmailTrans { display: block; padding: 5% 5%; margin-bottom: 30px; background-color: rgba(255,255,255,0.70); overflow: hidden;/* 高さ認識の為 */}
.page-postmail-FrameNoSetting { display: block; padding: 5% 0; margin-bottom: 30px; overflow: hidden;/* 高さ認識の為 */ }/* 枠フレームなし */
@media only screen and (max-width : 768px ){ .page-postmail { padding: 10% 5%; } }

/*:: ポストメールの左右枠の中のコンテナ ::*/
.postmail-container { display: block; overflow: hidden;/* 高さ認識の為 */}
.postmail-container { font-family: heisei-maru-gothic-std, sans-serif; font-weight: 400; font-style: normal; }


/*:: リスト化の設定 ::*/
form#mail_form ul.listBox { width: 100%; margin-bottom: 10px; padding: 0 0 0 0; position: relative; }
form#mail_form ul.listBox li { width: 100%; margin: 10px auto; display: block; position: relative; }
form#mail_form ul.listBox li:first-of-type { margin-top: 0px; }
form#mail_form ul.listBox li span.none_line { display: block; padding: 0 0 0 22px;}
form#mail_form ul.listBox li span.none_line::before { position: absolute; left: 0%; font-family: FontAwesome; content: "\f00c"; color: #999999; }

form#mail_form ul.listBox li span.none_lineBack { display: block; padding: 5px 5px 5px 28px; background-color: rgba(221,221,221,0.50)}
form#mail_form ul.listBox li span.none_lineBack { font-size:14px; font-size:1.4rem;}
form#mail_form ul.listBox li span.none_lineBack::before { position: absolute; left: 5px; font-family: FontAwesome; content: "\f00c"; color: #999999; }

form#mail_form ul.listBox li span.onlyBack { display: block; padding: 5px 10px; background-color: rgba(221,221,221,0.50); font-size:14px; font-size:1.4rem; }

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: フォーム用CSS 初期定義                                                                                                                                                      ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

/*:: iphoneのズームアップを防ぐための設定 ::*/
input { font-size:16px; font-size:1.6rem;}

/*:: フォーム全体設定 ::*/
input,select,textarea { border-radius : 3px; }
label { cursor: pointer; }

/*:: フォーム全体枠の設定 ::*/
form#mail_form { width : 100%; margin: 0 auto 30px auto; border-radius : 7px; }
form#mail_form { font-size:16px; font-size:1.6rem; }
form#mail_form dl { margin-bottom: 20px; padding: 2.5% 2.5%; overflow: hidden; border: 0px solid #b0b0b0; border-radius: 7px; }
@media only screen and (max-width : 768px ){ form#mail_form dl { padding: 5% 5%; } }

form#mail_form dl.formTransBox { background-color: rgba(255,255,255,0.70); }
form#mail_form dl.formTransBox1px { background-color: rgba(255,252,238,0.70); border: 1px solid #eee; }
form#mail_form dl.formNoTransBox { margin-bottom: 20px }

form#mail_form textarea { padding: 5px 5px; }

/*:::::::::::::::::::::::::::*/
/*:: ラベルと説明部（dt・dd） ::*/
/*:::::::::::::::::::::::::::*/
/*:: フォーム左 ::*/
form#mail_form dl dt { width: 100%; margin-bottom: 10px; padding: 0; clear: both; color: #666; font-weight : bold; text-align: left; border-top: 1px solid #ccc; }
form#mail_form dl dt { font-family: heisei-kaku-gothic-std, sans-serif; font-style: normal; font-weight: 700; }
form#mail_form dl dt { font-size: 17px; font-size: 1.7rem; }
form#mail_form dl dt:first-child, form#mail_form dl dt:first-child+dd { border : none; background : none; }
/*:: 必須ラベル赤 ::*/
form#mail_form dl dt span.essential { margin: 2px 10px 0 0; display: block; float: left; background-color: #FF0004; padding: 0 2%; border-radius: 3px; }
form#mail_form dl dt span.essential { font-size: 13px; font-size: 1.3rem; color: #FFF; font-weight: bold; }
/*:: フォーム右 ::*/
form#mail_form dl dd { width: 100%; margin-bottom: 20px;  padding: 0px; float: left; }
/*:: 入力エラーメッセージがJavaScriptによって出現 ::*/
form#mail_form dd div { color: #ff0000; }
/*:: セレクトクラスの設定::*/
form#mail_form dl select { width: 350px; font-size: 14px; height: 40px; }

@media screen and (max-width : 768px){
form#mail_form dl dt { font-size: 16px!important; font-size: 1,6rem!important; }
}

/*:::::::::::::::::::::::::::*/
/*:: 個別項目               ::*/
/*:::::::::::::::::::::::::::*/

form#mail_form input { height: 40px; padding: 5px 5px; border : 1px solid #ccc; border-radius : 3px; background-color: #FDFDFD; }
/*:: インプットの高さを除外するタイプ別 ::*/
form#mail_form input[type="checkbox"], form#mail_form input[type="radio"] { height: auto;}
/*:: インプットのファイルの幅 ::*/
form#mail_form input[type="file"] { width: 100%; }
/*::フォームが選択されている時::*/
form#mail_form input:focus, form#mail_form textarea:focus{ box-shadow : 0px 0px 5px #55ccff; border : 1px solid #55ccff; background : #ffffff; }

/*:: ラジオボタンの基本設定 ::*/
form#mail_form ul.RadioBtn li { display: inline-flex; align-items: center; white-space: nowrap; min-width: 0; padding: 0px 20px 10px 0px; margin: 0px 0; }
form#mail_form ul.RadioBtn li:last-child { margin-right : 0px;}
form#mail_form ul.RadioBtn li input { height: auto; margin-right: 10px; transform: scale(1.2); }

/*:: 例文字の設定 ::*/
form#mail_form input::placeholder { color: #9A9A9A; letter-spacing: 1px; font-size : 13px;}
form#mail_form input:-webkit-input-placeholder { color: #9A9A9A; letter-spacing: 1px; font-size : 13px;}
form#mail_form input::-moz-placeholder { color: #9A9A9A; letter-spacing: 1px; font-size : 13px;}
form#mail_form input:-ms-input-placeholder { color: #9A9A9A; letter-spacing: 1px; font-size : 13px;}



/*:: 姓と名の入力フォーム設定 ::*/
form#mail_form input#name_1 { margin-bottom: 10px; margin-right: 10px }
form#mail_form input#name_1, form#mail_form input#name_2 { width : 250px; }
@media screen and (max-width : 768px){ form#mail_form input#name_1, form#mail_form input#name_2 { width : 48%; } }
@media screen and (max-width : 568px){ form#mail_form input#name_1, form#mail_form input#name_2{ width : 100%; } form#mail_form input#name_1 { margin-right: 0px } }
/*:: フリガナの入力フォーム設定 ::*/
form#mail_form input#read_1 { margin-bottom: 10px; margin-right: 10px }
form#mail_form input#read_1, form#mail_form input#read_2 { width : 250px; }
@media screen and (max-width : 768px){ form#mail_form input#read_1, form#mail_form input#read_2 { width : 48%; } }
@media screen and (max-width : 568px){ form#mail_form input#read_1, form#mail_form input#read_2{ width : 100%; } form#mail_form input#read_1 { margin-right: 0px } }

/*:: メールアドレスの入力フォーム設定 ::*/
form#mail_form input#mail_address,
form#mail_form input#mail_address_confirm { width : 500px; }
/*:: 郵便枠の入力フォーム設定 ::*/
form#mail_form input#postal { width : 350px; float: left; }
/*:: 住所の入力フォーム設定 ::*/
form#mail_form input#address_1,
form#mail_form input#address_2{ width : 100%; margin-bottom: 7px; display : block; }
/*:: 電話番号入力の入力フォーム設定 ::*/
form#mail_form input#phone { width : 350px; }
form#mail_form input#phoneFax { width : 350px; }
form#mail_form input#phoneMobile{ width : 350px; }
/*:: HP,SNSの入力フォーム設定 ::*/
form#mail_form input#SnsHpUrl01,
form#mail_form input#SnsHpUrl02,
form#mail_form input#SnsHpUrl03 { width : 100%; margin-bottom: 7px; display : block; }

@media screen and (max-width : 768px){
form#mail_form input#mail_address,
form#mail_form input#mail_address_confirm,
form#mail_form input#postal,
form#mail_form input#address_1,
form#mail_form input#address_2,
form#mail_form input#phone,
form#mail_form input#phoneFax,
form#mail_form input#phoneMobile { width : 100%; }
}
/*:: 性別のラジオボタン ::*/
form#mail_form ul.Gender li label:hover{ cursor : pointer;}

/*:: 年齢のドロップダウン設定 ::*/
form#mail_form dl dd select.ageSize { font-size: 1.5rem; width: 350px }
form#mail_form dl dd option.ageChoice { font-size: 1.5rem; }
form#mail_form select#age_select { padding: 5px 0; width : 100px; font-size : 13px;}
@media screen and (max-width : 768px){ form#mail_form dl dd select.ageSize { width: 100% } }
@media screen and (max-width : 568px) { form#mail_form dl dd option.ageChoice { font-size: 1.3rem!important; } }

/*:: 業種の入力フォーム設定 ::*/
form#mail_form input#Industry { width: 350px; }
/*:: 役職の入力フォーム設定 ::*/
form#mail_form input#Managerial { width: 350px; }
/*:: 予算の入力フォーム設定 ::*/
form#mail_form input#Budget { width : 350px; }
/*:: 納品希望日入力のカレンダーフォーム ::*/
form#mail_form input#Delivery { width : 350px; }
/*:: 会社名の入力フォーム設定 ::*/
form#mail_form input#Company { width : 350px; }
/*:: 印刷枚数の入力フォーム設定 ::*/
form#mail_form input#Printing { width : 350px; }
/*:: 希望カラーの入力フォーム設定 ::*/
form#mail_form input#HopeColor { width : 350px; }
/*:: 希望カラーの入力フォーム設定 ::*/
form#mail_form input#StampFrame { width : 350px; }
/*:: イメージテイストの入力フォーム設定 ::*/
form#mail_form input#designTaste { width: 100%; }
/*:: 制作目的の入力フォーム設定 ::*/
form#mail_form input#creationPurpose { width: 100%; }
/*:: 制作目的の入力フォーム設定 ::*/
form#mail_form input#ItemTypeOther { width: 100%; }
/*:: 制作目的の入力フォーム設定 ::*/
form#mail_form input#DesiredItemsOther { width: 100%; }

@media screen and (max-width : 768px){
form#mail_form input#Industry,
form#mail_form input#Managerial,
form#mail_form input#Budget,
form#mail_form input#Delivery,
form#mail_form input#Company,
form#mail_form input#Printing,
form#mail_form input#HopeColor { width : 100%; }
}

/*:: 片面のラジオボタン ::*/
#oneSide01 { }
#oneSide02 { }
/*:: 縦横のラジオボタン ::*/
#crisscrossing01 { }
#crisscrossing02 { }
/*:: 地図作成のラジオボタン ::*/
#mapCreation01 { }
#mapCreation02 { }
/*:: 印刷希望のラジオボタン ::*/
#PrintingRequest01 { }
#PrintingRequest02 { }
/*:: 印刷希望のラジオボタン ::*/
#QrRequest01 { }
#QrRequest02 { }
/*:: ロゴ所持のラジオボタン ::*/
#haveLogo01 { }
#haveLogo02 { }
/*:: ロゴデータのラジオボタン ::*/
#haveLogodata01 { }
#haveLogodata02 { }


/*:: お問合せ項目のフォーム設定 ::*/
form#mail_form dl dd select.categorySize { font-size: 1.5rem; width: 350px;}
form#mail_form dl dd option.categoryChoice { font-size: 1.5rem; }
@media only screen and (max-width: 768px) { form#mail_form dl dd select.categorySize { width : 100%;} }
@media only screen and (max-width: 568px) { form#mail_form dl dd option.categoryChoice { font-size: 1.3rem!important; } }

/*:: お問合せの内容の設定 ::*/
form#mail_form textarea#mail_contents { width : 100%; height : 200px; resize : vertical; border : 1px solid #cccccc; background : #fafafa;}
/*:: ご意見やご要望棒内容の設定 ::*/
form#mail_form textarea#OpinionsAndRequests { width : 100%; height : 200px; resize : vertical; border : 1px solid #cccccc; background : #fafafa;}

/*:: 郵便検索の設定 ::*/
#yuubin-kensaku a, #yuubin-kensaku a:visited { padding: 5px; margin-left: 5px; float: left; display: inline-block; border-radius: 3px; border: 1px solid #B0B0B0; font-size: 13px; }
#yuubin-kensaku a, #yuubin-kensaku a:visited { text-align: center; background-color: #E8E8E8; height: 40px; }
#yuubin-kensaku a:hover, #yuubin-kensaku a:active, #yuubin-kensaku a:focus { background-color: #C9C9C9; }
@media only screen and (max-width : 768px ){ #yuubin-kensaku a, #yuubin-kensaku a:visited { margin: 5px 0 0 0px; } }

/*:: 送信ボタンの設定 ::*/
form#mail_form dt.submit_do { display: none; }
form#mail_form input#mail_submit_button{ width: 100%; height: auto; padding: 10px 5px; vertical-align: middle; background: #eee; border: 1px solid #ccc; }
form#mail_form input#mail_submit_button{ color: #444444; font-weight: bold; }
form#mail_form input#mail_submit_button:hover{ cursor : pointer; color : #106dff; background : #e0e0e0; transition: .3s;}
@media screen and (max-width : 768px){ form#mail_form input#mail_submit_button{ margin-top: 20px; font-size: 18px; } }


/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: ヒアリング用フォームCSS 初期定義                                                                                                                                              ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: 印刷枚数非表示時の空間も消す ::*/
#printing_field_block { display: none; /* 初期で非表示にしてもOK */ }


/*:: 印刷サイズ選択設定 ::*/
form#mail_form dl dd select#PrintingSizeSelect { width: 350px; font-size: 1.5rem!important;}
form#mail_form dl dd select#PrintingSizeSelect label { font-size: 1.5rem!important; }
form#mail_form dl dd select#PrintingSizeSelect option { font-size: 1.3rem!important; }
form#mail_form dl dd select#PrintingSizeSelect option optgroup { color: #B2D0FF }
@media only screen and (max-width: 768px) { form#mail_form dl dd select#PrintingSizeSelect { width: 100%; } }
/*:: 印刷サイズのその他フォーム設定 ::*/
#PrintingSizeOther { width: 100%; height: 40px!important; padding: 5px 5px; }


/*:: 依頼内容のチェックボックスの並び方設定 ::*/
.requestContent { display: flex; flex-wrap: wrap; }
.requestContent label { display: flex; align-items: center; white-space: nowrap; min-width: 0; padding: 10px 0px 10px 0px; margin: 0 10px; }
.requestContent label span { margin-left: 0.5em; }
.requestContent input[type="checkbox"] { transform: scale(1.2); margin: 0; }


/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: 構成案で増えたコード                                                                                                                                                        ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: カードの種類チェックボックスの並び方設定 ::*/
dd.cardType { display: flex; flex-wrap: wrap; }
dd.cardType label { display: inline-flex; align-items: center; white-space: nowrap; min-width: 0; padding: 0px 20px 0px 0px; margin-right: 10px 0; }
dd.cardType label span { margin-left: 0.5em; }
dd.cardType input[type="checkbox"] { transform: scale(1.2); margin: 0; padding: 0!important; }

form#mail_form dl ul.tagKind { margin-bottom: 10px; }
form#mail_form dl ul.tagKind li { display: inline-block; margin-right: 0px; padding: 1px 10px; color: #EEE; font-size:10px; font-size:1.0rem; border-radius: 3px }
form#mail_form dl ul.tagKind li.noTone { background-color: #666; }
form#mail_form dl ul.tagKind li.tBlue { background-color: #4370FF; }
form#mail_form dl ul.tagKind li.tOrange { background-color: #FF9233; }
form#mail_form dl ul.tagKind li.tGreen { background-color: #33AC50; }

/*:: ロゴ所持非表示時の空間も消す ::*/
#haveLogodata_field_block { display: none; /* 初期で非表示にしてもOK */ }
#designTaste_field_block { display: none; /* 初期で非表示にしてもOK */ }
#creationPurpose_field_block { display: none; /* 初期で非表示にしてもOK */ }


/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: サンクス、エラー、conf                                                                                                                                                      ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

.postmail-container li.postmailFormLang { border-bottom: 1px solid #999; margin-bottom: 30px; padding-bottom: 20px }
/*:: thanks ::*/
p.postMsg { display: block; text-align: center; }
p.postMsg { font-family: heisei-maru-gothic-std, sans-serif; font-weight: 400; font-style: normal!important; }
/*:: conf,error,thanksボタン ::*/
p.postBtn { display: block; text-align: center; border-top: 1px solid #999; margin-top: 30px }
.postmail-container p.postBtn input { margin-top: 50px; padding: 10px 10px; }

/*:: confの設定 ::*/
#form-tbl { width: 100%; margin: 0 auto; }
#form { width: 100%; margin: 10px 0; border-collapse: collapse;}
#form tr { }
#form th, #form td { border: 1px solid #666; padding: 2%; border-spacing: 0; }
#form th, #form td { font-family: heisei-maru-gothic-std, sans-serif; font-weight: 400; font-style: normal!important; }
#form th { width: 160px; background: #e8e8e8; color: #666; }
#form td { width: -webkit-calc(100% - 160px); width: calc(100% - 160px); background: #fff; }
p.btn input { width: 160px; height: 32px; }
/* for message */
p.msg { color: #dd0000; margin: 2em; }
span.msg { color: #dd0000; }
/* for back-button */
form.back { margin-top: 2em; }

@media only screen and (max-width: 568px) {
/* 投稿フォーム */
#form-tbl { text-align: center; }
#form { width: 96%; }
#form th, #form td { width: 100%; padding: 10px 5px; display: block; text-align: left; border-top: none; min-height: 50px }
#form tr:first-child th	{ border-top: 1px solid #666; }
p.btn input { width: 10em; }
}