@charset "UTF-8";
@import url('https://fonts.googleapis.com/earlyaccess/sawarabimincho.css');

/* MEMO */
/* #0068B7：コーポレートカラー */
/* #231916：強調色(濃い茶色) */
/* #a86f4c：強調色(クルミ色) */
/* #dbd5c9：強調色(薄い茶色) */

/*================================================
 *  CSSリセット
 ================================================*/
* { margin:0; padding:0; border:0; outline:0; vertical-align:baseline; background:transparent; word-wrap:break-word; }
footer, header, nav, section { display:block; }
div, nav, section, dl, ul { overflow:hidden; }
ul { list-style:none; }
table { border-collapse:collapse; border-spacing:0; table-layout:fixed; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
form, input,select,textarea { vertical-align:middle; box-sizing:border-box; }
input, button, textarea, select { -webkit-appearance:none; -moz-appearance:none; appearance:none; }

/*================================================
 *  タグ定義
 ================================================*/
* { line-height:1.6; }
html { background-color:#231916; }
body { color:#222; background-color:white; margin:0 auto; font-size:14px; -webkit-text-size-adjust:none; }
body, textarea, input { font-family:"Century Gothic", "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif; }
a { background:transparent; text-decoration:none; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); color:#222; }
a:hover, a:focus { text-decoration:none; outline:none; }
a:hover { opacity:0.5; }
.ios a:hover { opacity:1; }
h1, h2, h3, h4 { margin-bottom:1em; }
h1 { font-size:36px; }
h2 { font-size:28px; }
h3 { font-size:20px; }
h4, h5 { font-size:16px; }
p { margin-bottom:0.5em; }
p:last-child { margin-bottom:0; }
ol+p { margin-top:1em; }
li { padding-left:1em; text-indent:-1em; }
th { white-space:nowrap; }
img { max-width:100%; }
nobr { white-space:nowrap; display:inline-block; }
section { min-height:300px; }

/*================================================
 *  ヘッダ・ナビ
 ================================================*/
/* ロゴ */
a.logo { display:block; padding-top:40px; padding-bottom:20px; margin:0 auto; width:185px; }
a.logo img { display:block; }

/*  メニュー */
nav.pc_menu ul.menu { display:flex; justify-content:center; flex-wrap:wrap; overflow:hidden; }
nav.pc_menu ul.menu li { display:block; text-align:center; width:125px; margin:0; text-indent:0; padding-left:0; }
nav.pc_menu ul.menu li, nav.pc_menu ul.menu li a { font-size:14px; font-weight:400; }
nav.pc_menu ul.menu li a { display:block; border:0; height:40px; padding:20px 0; }
nav.pc_menu ul.menu li a div.nav_text_bottom { display:none; font-size:12px; }
nav.pc_menu ul.menu li a:hover { color:white; opacity:1; background-color:#231916; }
nav.pc_menu ul.menu li a:hover div.nav_text_bottom { display:block; }
nav.pc_menu ul.menu.menu_fix { position:fixed; z-index:1000; top:0; left:0; right:0; background-color:#fcfcfc; }
section.menu_fix { margin-top:80px; }
div.side_menu_button { display:none; position:absolute; z-index:2; top:20px; right:20px; width:60px; height:60px; border:1px solid white; background-image:url('images/common_humberger.png'); background-color:#0068b7; background-size:60px 60px; cursor:pointer; }

/*================================================
 *  フッタ
 ================================================*/
footer { text-align:center; padding:100px 0; background:#231916; }
footer, footer * { color:#ccc; font-size:14px; letter-spacing:normal; }
footer div.footer_top { margin:0 auto; }
footer div.footer_top img { float:left; display:block; }
footer div.footer_top ul.footer_menu { float:right; width:900px; height:60px; display:flex; flex-wrap:wrap; justify-content:space-between; }
footer div.footer_top ul.footer_menu li { display:block; width:160px; margin-left:0; line-height:30px; }
footer div.footer_address, footer div.copyright { margin-top:40px; }
footer nobr:after { margin-right:20px; content:' '; }

/*================================================
 *  ページトップへの戻り
 ================================================*/
#page-top { position:fixed; bottom:20px; right:10vw; background-color:#a86f4c; border:1px solid #fff; z-index:2; opacity:0.95; }
#page-top a { display:block; width:60px; height:60px; background:url("images/common_totop.png"); }
#page-top a:hover { text-decoration:none; background-color:#dbd5c9; }

/*================================================
 *  ページ共通
 ================================================*/
/* ブロック構造 */
.inner { width:980px; margin:0 auto; }
.content_block { padding:100px 0; }
.center { text-align:center; margin-left:auto; margin-right:auto; }
img.center { display:block; margin-left:auto; margin-right:auto; }
.right { text-align:right; }
.back_color { background-color:#dbd5c9; }
.page_top { text-align:center; padding:40px 0 30px; }
.page_top h2 { margin-bottom:0; letter-spacing:0.25em; }

/* 文字装飾 */
.serif { font-family:"游明朝", YuMincho, 'Sawarabi Mincho', "ＭＳ Ｐ明朝", serif; }
.indent { text-indent:1em; }
.folding { text-indent:-1.25em; padding-left:1.5em; }
.subtitle { font-size:18px; }
.error { color:red; }
.letter_space { letter-spacing:0.25em; }
a.outlink::after { content:'🔗'; margin-left:10px; }
.visual_text { text-align:center; font-size:32px; font-weight:400; color:black; }
.visual_text { text-shadow:4px 4px 8px white, 4px -4px 8px white, -4px 4px 8px white, -4px -4px 8px white, 8px 8px 16px white, 8px -8px 16px white, -8px 8px 16px white, -8px -8px 16px white, 12px 12px 24px white, 12px -12px 24px white, -12px 12px 24px white, -12px -12px 24px white, 16px 16px 32px white, 16px -16px 32px white, -16px 16px 32px white, -16px -16px 32px white, 20px 20px 40px white, 20px -20px 40px white, -20px 20px 40px white, -20px -20px 40px white; }
.visual_text_bottom { position:absolute; top:auto; bottom:20px; left:0; right:0; margin-top:0; margin-bottom:auto; }
img.map_icon { margin-left:10px; }

/* リストボックス(右写真型の一覧) */
div.listbox img { float:right; margin-left:60px; }

/*================================================
 *  ページ別定義
 ================================================*/
/* TOPページ */
div.top_image { position:relative; height:calc(100vh - 260px); background-image:url('images/01_top/top_cover_1920.jpg'); background-position:center center; background-size:cover; background-repeat:no-repeat; display:flex; justify-content:center; align-items:center; }
div.top_image h2 { margin-bottom:0; }
div.top_news div.top_news_title h2 { display:inline-block; }
div.top_news div.top_news_title span { margin-left:20px; }
div.top_news dl { display:inline-block; }
div.top_news dl dt, div.top_news dl dd { float:left; margin-bottom:15px; font-size:16px; }
div.top_news dl dt:last-of-type, div.top_news dl dd:last-of-type { margin-bottom:0; }
div.top_news dl dt { clear:left; width:100px; margin-right:20px; }
div.top_news dl dd { width:auto; }
div.top_news dl dd a { border-bottom:1px dotted #222; }

/* NEWSページ */
div.news dl { display:inline-block; margin:0 auto 0; }
div.news dl.news_list dt, div.news dl.news_list dd { float:left; margin-bottom:15px; font-size:16px; }
div.news dl.news_list dt:last-of-type, div.news dl.news_list dd:last-of-type { margin-bottom:0; }
div.news dl.news_list dt { clear:left; width:100px; margin-right:20px; text-align:left; }
div.news dl.news_list dd { width:calc(100% - 120px); text-align:left; }
div.news dl.news_list dd a { border-bottom:1px dotted #222; }
div.news div.news_detail { max-width:980px; }
div.news div.news_detail dl { margin-bottom:40px; }
div.news div.news_detail dl dt { text-align:center; margin-bottom:20px; }
div.news div.news_detail dl dt time, div.news div.news_detail dl dt h3 { display:inline; font-size:20px; }
div.news div.news_detail dl dt time { padding-right:20px; }
div.news div.news_detail dl dd { text-align:left; min-height:200px; }
div.news div.news_detail dl dd a { text-decoration:underline; }
div.news div.news_detail div.news_navi { position:relative; height:45px; }
div.news div.news_detail div.news_navi a { display:block; padding:10px 0; text-align:center; position:absolute; width:176px; }
div.news div.news_detail div.news_navi a.news_list { left:0; right:0; margin:auto; }
div.news div.news_detail div.news_navi a.news_next { left:0; }
div.news div.news_detail div.news_navi a.news_prev { right:0; }

/* ABOUTページ */
div.about table tr th, div.about table tr td { padding-top:5px; padding-bottom:5px; }
div.about table tr th { padding-right:40px; text-align:justify; text-align-last:justify; font-weight:normal; width:80px; }
.about dl { display:flex; margin-top:5px; }
.about dt { margin-right:40px; }
div.about div.about_lead div:not(:first-child) { margin-top:50px; }
div.about div.about_lead img { display:block; margin:20px auto 0; }
div.about div.about_greeting div.about_greeting_image { float:right; margin-left:60px; text-align:center; }
div.about div.about_greeting div.about_motto { margin-top:40px; }
div.about div.about_greeting div.about_motto img { background-color:white; }
div.about div.about_data img.about_data_image, div.about div.about_group div img.about_group_image  { float:right; margin-left:60px; }
.about_data ul { list-style-type:disc; padding-left:0; }
.about_data ul li { margin-left:1em; padding-left:0; text-indent:0; }
div.about div.about_history div { position:relative; }
div.about div.about_history div img.about_history_image { position:absolute; bottom:0; right:40px; }
div.about div#about_diamond { margin-top:-50px; padding-top:100px; }

/* SERVICESページ */
div.services a { display:inline-block; margin-top:20px; }

/* CRAFTSMENページ */
div.craftsmen div.craftsmen_image { position:relative; height:calc(100vh - 405px); background-image:url('images/05_craftsmen/craftsmen_cover.jpg'); background-position:center center; background-size:cover; background-repeat:no-repeat; }
div.craftsmen table tr th, div.craftsmen table tr td { padding-top:5px; padding-bottom:5px; }
div.craftsmen table tr th { padding-right:20px; text-align:left; font-weight:normal; width:80px; }
div.craftsmen div.craftsmen_history { position:relative; }
div.craftsmen div.craftsmen_history img { position:absolute; bottom:100px; right:0; }
div.craftsmen div.craftsmen_history p { padding:5px 0; margin:0; }
div.craftsmen div.listbox h4 { margin-top:40px; }
div.craftsmen div.listbox img { margin-bottom:20px; }
div.craftsmen div.craftsmen_photo { float:right; margin-left:60px; margin-bottom:20px; }
div.craftsmen div.craftsmen_photo img { float:none; margin:0 auto 5px; display:block; }
div.craftsmen div.craftsmen_photo p { text-align:center; }
div.craftsmen div.craftsmen_certi div.craftmen_certi_text { float:right; width:calc(100% - 280px); }
div.craftsmen div.craftsmen_certi div.craftmen_certi_image { float:left; margin-right:40px; }
div.craftsmen div.craftsmen_certi div.craftmen_certi_image img { float:none; display:block; margin:0 auto 5px; }
div.craftsmen div.craftsmen_certi div.craftmen_certi_image p { text-align:center; }

/* EQUIPMENTページ */
div.equipment div.equipment_boxes { display:flex; flex-wrap:wrap; justify-content:space-between; }
div.equipment div.equipment_boxes div.equipment_box { width:450px; margin-right:40px; margin-bottom:40px; }
div.equipment div.equipment_boxes div.equipment_box:nth-child(2n) { margin-right:0; }
div.equipment div.equipment_boxes div.equipment_box h2 { font-size:18px; padding:20px 0 20px 20px; margin-bottom:0; }
div.equipment div.equipment_boxes div.equipment_box img { width:450px; height:300px; object-fit:cover; }

/* RECRUITページ */
div.recruit div.recruit_box h3 { margin-bottom:30px; }
div.recruit div.recruit_box h4 { border-left:5px solid #333; padding-left:10px; }
div.recruit div.recruit_box div.recruit_section { margin-left:30px; margin-bottom:30px; }
div.recruit div.recruit_box div.recruit_section:last-of-type { margin-bottom:0; }
div.recruit div.recruit_box div.recruit_section div.recruit_item { background-color:#dbd5c9; padding:10px 20px; margin-bottom:20px; }
div.recruit div.recruit_box div.inner div.recruit_section div.recruit_item { background-color:white; }
div.recruit div.recruit_box div.recruit_section div.recruit_item:last-child { margin-bottom:0; }
div.recruit div.recruit_box div.recruit_section div.recruit_item div.recruit_item_head { padding-right:45px; }
div.recruit div.recruit_box div.recruit_section div.recruit_item div.recruit_item_head:hover { opacity:0.5; cursor:pointer; }
.open_close { background-image:url("images/common_close.png"); background-repeat:no-repeat; background-position:calc(100% - 10px) 50%; }
table.recruit_item_detail, table.recruit_item_detail tr, table.recruit_item_detail th, table.recruit_item_detail td { border:1px solid #666; }
table.recruit_item_detail { width:100%; margin-top:10px; display:none; }
table.recruit_item_detail th, table.recruit_item_detail td { padding:4px 10px; }
table.recruit_item_detail th { width:120px; background-color:#dbd5c9; }
table.recruit_item_detail td { background-color:white; }

/* ACCESSページ */
div.access h3 { margin-top:2em; }
div.access h3:first-of-type { margin-top:0; }
div.access div.access_block { float:left; top:20px; }
div.access div.access_block h4 { margin-top:1em; }
div.access div.access_map { float:right; width:500px; }
div.access img { display:block; margin-top:20px; }

/* CONTACTページ */
div.contact div.contact_boxes { display:flex; justify-content:space-between; }
div.contact div.contact_boxes div.contact_box { width:380px; }
div.contact div.contact_boxes div.contact_box h3 { text-align:center; margin-bottom:40px; }
div.contact div.contact_boxes div.contact_box a { display:block; width:280px; padding:10px 0; text-align:center; margin:20px auto 0; font-size:18px; }
div.contact div.contact_guide { margin-bottom:40px; }
div.contact table { width:100%; border:0; }
div.contact table th { padding:10px; width:200px; text-align:left; background-color:#dbd5c9; border-bottom:1px solid white; vertical-align:middle; }
div.contact table tr th.nes { background-image:url("images/09_contact/form_nes.png"); background-repeat:no-repeat; background-position:top 50% right 10px; }
div.contact table tr th.opt { background-image:url("images/09_contact/form_opt.png"); background-repeat:no-repeat; background-position:top 50% right 10px; }
div.contact table td { border:0; padding:10px 0 10px 10px; }
div.contact table.contact_confirm tr:last-of-type th, div.contact table.contact_confirm td { border:1px solid #dbd5c9; }
div.contact table td input, div.contact table td textarea { border:1px solid #aaa; font-size:16px; padding:5px; margin-right:10px; }
div.contact table td input { width:400px; }
div.contact table td textarea { width:100%; height:200px; margin-right:0; }
div.contact table td div.error { margin-top:0.2em; }
div.contact div.contact_buttons { text-align:center; margin-top:40px; }
div.contact div.contact_buttons input[type="submit"], div.contact div.contact_buttons a { display:inline-block; background-color:#dbd5c9; margin:0 auto; width:250px; padding:20px 0; font-size:16px; }
div.contact div.contact_buttons input[type="submit"]:hover { cursor:pointer; }
div.contact div.contact_buttons input[type="submit"]:nth-of-type(2) { margin-left:50px;  }

/* PRIVACYページ */
div.privacy div.content_block h3 { margin-top:60px; }
div.privacy ol { list-style-type:lower-alpha; list-style-position:inside; }

/*■■■■■■■■■■■■■■■■■■■■■■■■■
 *  タブレット大
 ■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media screen and (max-width:1000px) {

/* 共通 */
* { box-sizing:border-box; }
h1 { font-size:30px; }
h2 { font-size:24px; }
h3 { font-size:20px; }
h4 { font-size:16px; }
.inner { width:100%; }
.content_block { padding:50px 20px; }
.page_top { padding:20px 0 15px; }
.page_top h2 { font-size:26px; letter-spacing:0; }
.subtitle { font-size:16px; }
.visual_text { font-size:24px; }
.letter_space { letter-spacing:0; }
div.listbox img { width:25vw; margin-left:30px; margin-bottom:30px; }
br.pc { display:none; }

/* ヘッダ */
a.logo { padding-top:20px; padding-bottom:20px; }
nav.pc_menu { display:none; background-color:#231916; }
nav.pc_menu ul.menu li { width:25%; color:white; border-bottom:1px solid #333; border-right:1px solid #333; }
nav.pc_menu ul.menu li:nth-child(1), nav.pc_menu ul.menu li:nth-child(5) { border-left:1px solid #333; }
nav.pc_menu ul.menu li a { color:white; height:80px; }
nav.pc_menu ul.menu li a div.nav_text_bottom { display:block; }
div.side_menu_button { display:block; }

/* フッタ */
footer { padding:50px 0 100px; }
footer div.footer_top img { float:none; margin:0 auto 20px; }
footer div.footer_top ul.footer_menu { float:none; width:100%; height:auto; justify-content:center; }
footer div.footer_top ul.footer_menu li { width:165px; line-height:50px; }

/* ページの戻り */
#page-top { right:5vw; } 
#page-top a:hover { opacity:1; background-color:#a86f4c; }

/* TOPページ */
div.top_image { height:260px; }
div.top_image h2 { font-weight:400; }

/* NEWSページ */
div.news div.news_detail { max-width:100%; }
div.news div.news_detail dl dd { min-height:100px; }
div.news div.news_detail div.news_navi a { width:150px; }

/* ABOUTページ */
div.about div.about_lead img { width:30vw; }
div.about div.about_greeting div.about_greeting_image { width:30vw; margin-left:30px; }
div.about div.about_data img.about_data_image, div.about div.about_group div img.about_group_image { width:30vw; margin-left:30px; }
div.about div.about_history div img.about_history_image { position:static; display:block; margin:10px auto 0; }

/* CRAFTSMENページ */
div.craftsmen div.craftsmen_image { height:260px; }
div.craftsmen div.craftsmen_history img { position:static; display:block; margin:10px auto 0; }
div.craftsmen div.craftsmen_certi div.craftmen_certi_text { float:none; width:100%; }
div.craftsmen div.craftsmen_certi div.craftmen_certi_image { float:none; margin-right:0; margin-top:20px; width:25vw; }
div.craftsmen div.craftsmen_certi div.craftmen_certi_image img { width:25vw; }

/* EQUIPMENTページ */
div.equipment div.equipment_boxes div.equipment_box { width:calc((100% - 40px) /2); }
div.equipment div.equipment_boxes div.equipment_box h2 { padding:10px 0 10px 10px; }
div.equipment div.equipment_boxes div.equipment_box img { height:30vw; }

/* CONTACTページ */
div.contact div.contact_boxes { display:block; }
div.contact div.contact_boxes div.contact_box { width:100%; display:inline-block; text-align:center; }
div.contact div.contact_boxes div.contact_box h3 { display:inline-block; width:240px; font-size:18px; }
div.contact div.contact_boxes div.contact_box a { display:inline-block; width:280px; margin-left:20px; margin-top:0; }
div.contact table td input { max-width:100%; }
div.contact table td label { display:block; }
div.contact table td div.error { margin-top:0; }

/* ACCESSページ */
div.access img { width:30vw; }

/* PRIVACYページ */
div.privacy div.content_block.inner p.center { text-align:left; }
div.privacy div.content_block h3 { margin-top:30px; }
}


/*■■■■■■■■■■■■■■■■■■■■■■■■■
 *  タブレット小・iPhone横
 ■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media screen and (max-width:667px) {

/* ABOUTページ */
div.about div.about_data img.about_data_image { float:none; margin:0 auto 20px; display:block; }
div.about table tr th { padding-right:15px; }

/* CRAFTSMENページ */
div.craftsmen div.craftsmen_image h2 { font-size:22px; }

/* ACCESSページ */
div.access div.access_block { float:none; }
div.access div.access_map { float:none; width:100%; height:300px; margin-top:20px; }

/* CONTACTページ */
div.contact div.contact_boxes div.contact_box { margin-bottom:40px; }
div.contact div.contact_boxes div.contact_box:last-child { margin-bottom:0; }
div.contact div.contact_boxes div.contact_box h3 { margin-bottom:10px; }
div.contact table, div.contact table tbody, div.contact table tr, div.contact table th, div.contact table td { display:block; width:100%; }
div.contact table td { padding-left:0; }
div.contact table td input { display:block; width:100%; }
div.contact table td textarea { height:100px; }
div.contact table.contact_confirm tr th, div.contact table.contact_confirm td { border:0; }
div.contact div.contact_buttons input[type="submit"], div.contact div.contact_buttons a { padding:10px 0; width:180px; }
}

/*■■■■■■■■■■■■■■■■■■■■■■■■■
 *  スマホ
 ■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media screen and (max-width:480px) {

/* 共通 */
.page_top h2 { font-size:22px; }
.visual_text { font-weight:bold; padding:0 40px; }
.open_close { background-position:100% 50%; }
div.listbox img { float:none; margin:0 auto 20px; width:50vw; display:block; }

/* ヘッダ */
nav.pc_menu ul.menu li { width:50%; }
nav.pc_menu ul.menu li:nth-child(2n+1) { border-left:1px solid #333; }
nav.pc_menu ul.menu li a { color:white; height:62px; padding:12px 0 0; }

/* TOPページ */
div.top_news dl { display:block; text-align:left; }
div.top_news dl dt { margin-right:0; float:none; margin-bottom:5px; clear:none; width:auto; }
div.top_news dl dd { float:none; }

/* NEWSページ */
div.news dl { display:block; }
div.news dl.news_list dt { margin-right:0; float:none; margin-bottom:5px; clear:none; text-align:left; width:auto; }
div.news dl.news_list dd { float:none; width:auto; }
div.news div.news_detail dl dt time, div.news div.news_detail dl dt h3 { display:block; text-align:left; }
div.news div.news_detail dl dt time { padding-right:0; }
div.news div.news_detail div.news_navi a { width:110px; }

/* ABOUTページ */
div.about div.about_lead img { width:50vw; }
div.about div.about_greeting div.about_greeting_image { float:none; margin:0 auto 20px; width:50vw; }
div.about div.about_data img.about_data_image, div.about div.about_group div img.about_group_image { width:50vw; margin:0 auto 20px; }
div.about div.about_group div img.about_group_image { float:none; margin:0 auto 20px; display:block; }
.about dt { margin-right:15px; }


/* CRAFTSMENページ */
div.craftsmen div.craftsmen_image h2 { padding:0 20px; }
div.craftsmen div.craftsmen_photo { float:none; margin-left:auto; margin-right:auto; }
div.craftsmen div.craftsmen_certi div.craftmen_certi_image { width:50vw; margin-left:auto; margin-right:auto; }
div.craftsmen div.craftsmen_certi div.craftmen_certi_image img { width:50vw; }

/* EQUIPMENTページ */
div.equipment div.equipment_boxes { display:block; }
div.equipment div.equipment_boxes div.equipment_box { width:100%; margin-right:0; }

/* RECRUITページ */
div.recruit div.recruit_box div.recruit_section { margin-left:10px; }
div.recruit div.recruit_box div.recruit_section div.recruit_item div.recruit_item_head { padding-right:30px; }
table.recruit_item_detail, table.recruit_item_detail tbody, table.recruit_item_detail th, table.recruit_item_detail td { display:block; }
table.recruit_item_detail { display:none; }
table.recruit_item_detail, table.recruit_item_detail tr, table.recruit_item_detail th, table.recruit_item_detail td { border:0; }
table.recruit_item_detail th { text-align:left; }

/* ACCESSページ */
div.access img { width:50vw; }

/* CONTACTページ */
div.contact div.contact_boxes div.contact_box { display:block; }
div.contact div.contact_boxes div.contact_box h3 { display:block; width:auto; }
div.contact div.contact_boxes div.contact_box a { display:block; margin-left:auto; }
div.contact div.contact_buttons input[type="submit"], div.contact div.contact_buttons a { width:140px; }
}