/* CSS Document */

/* 基本設定
----------------------------------------------------------- */

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul,li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video {	margin: 0;	padding: 0;	border: 0;	font-style:normal;    /*font-weight: normal;*/	font-size: 100%;	vertical-align: baseline;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section { display: block;}
blockquote, q {	quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {	content: ''; content: none;}
input, textarea{	margin: 0;}
ol, ul{ list-style:none;}
table{ border-collapse: collapse; border-spacing:0;}
caption, th{ text-align: left;}
a:focus { outline:none;}
.clearfix:after { content: "."; display: block;	clear: both; height: 0;	visibility: hidden;}
.clearfix {	min-height: 1px;}
* html .clearfix {
	height: 1px;
	/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}

html { overflow-y: scroll;	font-size: 62.5%;scroll-behavior: smooth;}
img { vertical-align: bottom;}
a {  color: #000000;text-decoration: none;}
a:hover { color:#fa4f12; transition: .2s; text-decoration: underline; opacity: 0.6;}

body {
	color: #000000;
    background: #fff;
	font-family:"Noto Sans JP", sans-serif;
	font-size: 1.0rem;
	line-height: 1.6;
    font-weight: 400;
    text-align:justify;
}
img { max-width: 100%; height: auto;}
main { background: #fff; padding-bottom: 50px;}

@media print, screen and (min-width: 768px){
    body { min-width: 1200px; }
}
@media screen and (max-width: 767px) {
    main { padding-bottom: 30px;}
}

/* ヘッダー
----------------------------------------------------------- */
header { position: fixed; border-bottom: 1px solid #d7d7d7;background: rgba(255,255,255,0.95);width: 100%; z-index: 1000;box-sizing: border-box;}
header #hd_logo { padding-left: 20px; }
#hd_link { position: absolute;top: 10px;right: 10px;}
#hd_link img { width: 30px;}
@media print, screen and (min-width: 768px){
    header { height:130px; display: flex; justify-content: space-between; align-items: center; min-width: 1200px; }
}
@media screen and (max-width: 1150px) {
    header #hd_logo { width: 230px;}
}
@media screen and (max-width: 767px) {
    header { height: 50px; }
    header #hd_logo { padding:6px 0 0 10px; width: 100px;}
    #hd_link { display: none;}
}

/* ナビゲーション
----------------------------------------------------------- */
#g_nav { letter-spacing: 0.05em;}
.drop_acc > ul { display: none;}
#g_nav > ul > li > ul > li > ul > li { padding-bottom: 10px;}
#g_nav > ul > li > ul > li > ul > li a { display: block; line-height: 32px;font-weight: 300;}
#g_nav > ul > li > ul > li > ul > li a::before { content: "－ ";}

@media print, screen and (min-width: 768px){
    #g_nav { height: 129px; padding: 85px 20px 0 0;box-sizing: border-box;}
    #g_nav .m_nav_btn { display: none;}
    #g_nav > ul { display: flex;font-size: 1.5rem; font-feature-settings: 'palt';}
    #g_nav > ul > li { margin-left: 27px;}
    #g_nav > ul > li > a { padding-bottom: 10px;}
    #g_nav > ul > li > a.now { position: relative;}
    #g_nav > ul > li > a.now::after { content: "";position: absolute;bottom: -12px;left: 0; width:100%;height: 5px; background: #b64a22;z-index: -1;}
    #g_nav > ul > li.drop_acc > ul { position: absolute;left: -10px; width: 240px;top: 30px; background-color: rgba(255,255,255,0.95);padding:0 15px;border: 1px solid #d7d7d7;}
    #g_nav > ul > li > ul > li { border-bottom: 1px dotted #d7d7d7;}
    #g_nav > ul > li > ul > li:last-of-type { border-bottom: none;}
    #g_nav > ul > li > ul > li p { padding: 15px 0 5px;}
    #g_nav > ul > li > ul > li a { display: block; line-height: 50px;}
    .drop_acc { padding-right:20px; position: relative; }
    .drop_acc::after { position: absolute;top: 50%;margin-top: -4px; right: 0; content: "";width: 0;height: 0;border-style: solid;border-width: 8px 5px 0 5px;border-color: #b64a22 transparent transparent transparent;}
}

@media screen and (max-width: 767px) {
    #g_nav {}
    #g_nav > ul { display: none; background: #fff;font-size: 1.6rem;padding: 10px;box-sizing: border-box;}
    #g_nav > p.m_nav_btn.open + ul { display: block; }
    #g_nav > ul > li { border-bottom: 1px solid #d7d7d7;line-height: 50px;padding: 0 15px;}
    #g_nav > ul > li img { vertical-align: middle;}
    #g_nav > ul > li > a {display: block;}
    #g_nav > ul > li > ul > li { border-top: 1px dotted #d7d7d7;}

    .drop_acc span { display: block; padding-right:20px; position: relative; }
    .drop_acc span::after { position: absolute;top: 50%;margin-top: -4px; right: 0; content: "";width: 0;height: 0;border-style: solid;border-width: 8px 5px 0 5px;border-color: #b64a22 transparent transparent transparent;}
    .drop_acc span.open::after { border-width: 0 5px 8px 5px;border-color: transparent transparent #b64a22 transparent;}

    /* ハンバーガーボタン */
    .m_nav_btn { position: absolute; cursor: pointer; width: 50px; height:50px; right: 10px; top: 0px;}
    
    /* ハンバーガーメニューの線を定義 */
    .m_nav_btn span { display: inline-block; position: absolute; height:5px; width: 40px; background: #b64922; left: 8px;top:10px; }
    .m_nav_btn span::before,.m_nav_btn span::after { content: ""; position: absolute;height:5px; width:40px; background: #b64922;}
    .m_nav_btn span::before { top: 10px;}
    .m_nav_btn span::after { top: 20px;}

    #close_btn { color: #fff; cursor: pointer;position: absolute;top: 15px;right: 0;width: 80px;height: 80px;font-size: 0;}
    #close_btn::before,#close_btn::after {content: ""; display: inline-block; position: absolute; height:5px; width: 60px; background: #212529;top: 20px;}
    #close_btn::before { left: 40px;transform: translate(-50%,-50%) rotate(45deg);}
    #close_btn::after { right: -20px;transform: translate(-50%,-50%) rotate(-45deg);}
}


/* フッター
----------------------------------------------------------- */
footer { border-top: 5px solid #b64922;}
#ft_nav { padding: 30px 0 40px;display: flex;f;flex-wrap: wrap;justify-content: space-between;}
#ft_nav > ul { font-size: 1.4rem;}
#ft_nav > ul > li {line-height: 30px;}
#ft_nav > ul > li > a { color: #b64922;}
#ft_nav > ul > li > a:hover { color: #fa4f12;}
#ft_nav > ul > li > ul > li { padding-left: 1em;}
#ft_nav > ul > li > ul > li > ul > li a {font-weight: 300;}
#ft_nav > ul > li > ul > li > ul > li a::before { content: "－ ";}
#copyright {background: #816257;text-align: center;color: #fff;font-size: 1.2rem;line-height: 40px;}

@media screen and (max-width: 767px) {
    #ft_nav { padding: 10px 15px;}
    #ft_nav a {display: block;}
    #ft_nav > ul { font-size: 1.2rem;}
    .ft_nav_m1,.ft_nav_m2 { display: flex; flex-wrap: wrap;width: 100%;}
    .ft_nav_m1 li { width: 50%;}
    .ft_nav_m2 > li > ul { display: flex; flex-wrap: wrap}
    .ft_nav_m2 > li > ul > li { width: 50%;}
    .ft_nav_m3 {width: 100%;}
    .ft_nav_m3 li > ul { display: flex; flex-wrap: wrap;width: 100%;}
    .ft_nav_m3 li > ul > li { width: 50%;}
    #ft_nav > ul > li {line-height: 30px; }
    #ft_nav > ul > li > a { color: #b64922;}
    #ft_nav > ul > li > a:hover { color: #fa4f12;}
    #ft_nav > ul > li > ul > li {padding-left:0;}
    #copyright {background: #816257;text-align: center;color: #fff;font-size: 1.2rem;line-height: 40px;}
}

/* コンテンツ
----------------------------------------------------------- */
main { padding-top: 130px;}
.bg_orange { background: #f8ece8;}

.btn_area { display: flex; justify-content: center;}
.btn_area a { display: block; width: 240px; line-height: 60px;border: 1px solid #b64922; color: #b64922;background: #fff;text-align: center;font-size: 2.1rem;}

@media print, screen and (min-width: 768px){
    .w1000 { width: 1200px; margin:0 auto;}
    .table_block { display: table;}
    .table_block dl { display: table-row;}
    .table_block dl dt,
    .table_block dl dd { display: table-cell;}
    .sp_only { display: none !important;}
}
@media screen and (max-width: 767px) {
    main { padding-top: 50px;}
    .w1000 { padding:0 15px;}
    .btn_area a { width: 200px; line-height: 50px;font-size: 1.5rem;}
    .pc_only { display: none !important;}
}

#title_area { background: #fa4f12;text-align: center;padding: 25px 0 30px;margin-bottom: 40px;}
#title_area p,#title_area h1 {color: #fff;font-size: 3.6rem;font-weight: 500;line-height: 1.4;letter-spacing: 0.1em;}
#title_area p span,#title_area h1 span { display: block; font-size: 2rem;}
#title_area em { display: block;}
@media screen and (max-width: 767px) {
    #title_area {padding: 15px 15px 20px;margin-bottom: 30px;}
    #title_area p,#title_area h1 {font-size: 2.1rem;letter-spacing: 0.03em;}
    #title_area p span,#title_area h1 span { font-size: 1.6rem;}
}

#breadcrumb { background: #f5f5f5;height: 50px;padding: 0 20px; font-family: "Noto Sans JP", sans-serif;}
#breadcrumb ul { line-height: 50px;display: flex;font-size: 1.4rem;font-weight: 300;}
#breadcrumb ul a { text-decoration: underline;}
#breadcrumb ul a:hover { text-decoration: none;}
#breadcrumb ul li {}
#breadcrumb ul li::after { content: "＞";padding: 0 10px;}
#breadcrumb ul li:last-of-type::after {display: none;}
#breadcrumb em { padding-right: 10px;}
@media screen and (max-width: 767px) {
    #breadcrumb {display: none;}
}

.h2_ptn01 { text-align: center; font-weight: bold;font-size: 3rem;margin-bottom: 40px;padding-top: 140px; margin-top: -140px;}
.h2_ptn01 span {display: inline-block;border-bottom: 5px solid #b64922;padding-bottom: 5px;}
.h2_ptn01 img { max-height: 130px; width: auto;}
@media screen and (max-width: 767px) {
    .h2_ptn01 { font-size: 2.1rem;margin-bottom: 30px;padding-top: 60px; margin-top: -60px;}
    .h2_ptn01 img { max-height: 100px; }
}

.orange { color: #fa4f12;}

/*各ページのタイトル用*/
#title_area.bg_photo_01 { background: url("../img/title_bg01.jpg")no-repeat center center;background-size: cover;padding: 90px 0 85px;}
#title_area.bg_photo_01 h1 { text-align: left;width: 1000px;margin: 0 auto;
    text-shadow:  rgba(0,0,0,0.4) 1px 1px 18px, rgba(0,0,0,0.4) -1px 1px 18px,
    rgba(0,0,0,0.4) 1px -1px 18px, rgba(0,0,0,0.4) -1px -1px 18px;}

@media screen and (max-width: 767px) {
    #title_area.bg_photo_01 {padding: 50px 0 45px;}
    #title_area.bg_photo_01 h1 {width: 100%;padding:0 15px;box-sizing: border-box;}
}

