@charset "utf-8";

/*============================
.md_container
============================*/
.md_container { width: 1240px; margin: 0 auto; position: relative; padding-left: 20px; padding-right: 20px; z-index: 1; }

/*============================
md_panelArea
============================*/
.md_panelArea { height: 560px; background: #222; position: relative; overflow: hidden; z-index: 2; }
.md_panelArea .image { position: absolute; left: 0; top: 0; width: 100%; height: 560px; }
.md_panelArea .image::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 300px; background: linear-gradient(rgba(30, 20, 10, 0), rgba(30, 20, 10, 0.5)); }
.md_panelArea .image img { object-fit: cover; width: 100%; height: 560px; }
.md_panelArea .title { margin-top: 310px; padding-bottom: 30px; font-size: 3.75em; color: #fff; font-weight: 500; line-height: 1.1; position: relative; }
.md_panelArea .title::after { content: ""; position: absolute; left: 0; bottom: 0; height: 2px; border-bottom: solid 1px #fff; animation-name: text01-animate; animation-duration: 1s; animation-fill-mode: forwards; }
	@keyframes text01-animate {
		0% { opacity: 0; width: 0; }
		100% { opacity: 1; width: 100%; }
	}
.md_panelArea .pageLink { margin-top: 30px; }
.md_panelArea .pageLink ul {}
.md_panelArea .pageLink ul li { float: left; margin-right: 60px; }
.md_panelArea .pageLink ul li a { display: inline-block; padding-right: 22px; color: #fff; font-size: 1.3125em; position: relative; }
.md_panelArea .pageLink ul li a::after { content: ""; display: block; width: 15px; height: 15px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); background: url("../../imageFile/global/arrow_wh.svg") no-repeat center; background-size: 10px auto; transition: .25s; }
.md_panelArea .pageLink ul li a:hover::after { right: -3px; }

/*============================
.md_simplePanelArea
============================*/
.md_simplePanelArea { height: 400px; position: relative; }
.md_simplePanelArea::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #f2f0ec; z-index: 0; }
.md_simplePanelArea .pageTitle { display: block; width: 100%; position: absolute; left: 0; top: 50%; transform: translateY(-50%); margin-top: 30px; }
.md_simplePanelArea .pageTitle .main { font-size: 1.375em; text-align: center; color: #464035; font-weight: 500; line-height: 1.25; }
.md_simplePanelArea .pageTitle .main span { font-size: 0.75em; }
.md_simplePanelArea .pageTitle .sub { margin-top: 4px; letter-spacing: 0.02em; font-size: 3.5em; text-align: center; color: #222; font-weight: 500; }
.md_simplePanelArea .pageTitle .subBG { white-space: nowrap; color: #e7e3da; font-size: 8.5em; position: absolute; left: 50%; top: 0; transform: translateX(-50%); margin-top: -34px; z-index: -1; letter-spacing: 0; font-weight: 600; }
.md_simplePanelArea .pageTitle .subBG::before { content: ""; width: 940px; position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); height: 2px; border-bottom: solid 1px #e7e3da; }
.md_simplePanelArea .pageTitle .text { margin-top: 30px; text-align: center; line-height: 1.75; font-size: 1.125em; }

/*============================
md_pankuzuArea
============================*/
.md_pankuzuArea { position: relative; z-index: 1; }
.md_pankuzuArea ul { padding: 12px 15px;  display: flex; align-items: center; }
.md_pankuzuArea ul li { margin-right: 36px; font-size: 0.875em; line-height: 1.5; position: relative; }
.md_pankuzuArea ul li::after { display: block; content: ""; position: absolute; top: 4px; right: -20px; width: 8px; height: 8px; border-top: 1px solid #aaa; border-right: 1px solid #aaa; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.md_pankuzuArea ul li a { display: block; color: #777; position: relative; top: -2px; }
.md_pankuzuArea ul li a span { opacity: 0.75; white-space: nowrap; }
.md_pankuzuArea ul li a em { font-weight: bold; }
.md_pankuzuArea ul li:first-child {} 
.md_pankuzuArea ul li:first-child a { text-indent: -9999px; display: inline-block; width: 15px; height: 15px; background: url("../../imageFile/global/icon_home.svg") no-repeat center bottom; background-size: 15px 14px; top: 0; }
.md_pankuzuArea ul li:last-child { margin-right: 0; overflow: hidden; }
.md_pankuzuArea ul li:last-child::after { display: none; }
.md_pankuzuArea ul li:last-child a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.md_pankuzuArea.bottom { margin-bottom: -120px; margin-top: 120px; }

/*============================
.md_title
============================*/
.md_title {}
.md_title span { display: inline-block; font-size: 1.75em; font-weight: bold; padding: 0 2px 10px; border-bottom: solid 4px #000; line-height: 1.5; }
.md_topTitle { font-weight: bold; }
.md_topTitle em { font-size: 3em; margin-right: 15px; }
.md_topTitle span { font-size: 1.125em; position: relative; top: -2px; }

/*============================
icon
============================*/
.md_icon_normal { display: inline-block; width: 90px; text-align: center; color: #555; padding: 4px 4px 3px; font-size: 0.75em; border: solid 1px #777; }

/*============================
.md_btn
============================*/
.md_btn_main { position: relative; display: inline-block; min-width: 280px; padding: 18px 0 16px; background: #fff; color: #000; border: solid 3px #333; text-align: center; font-weight: bold; letter-spacing: 0.1em; border-radius: 50px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); transition: all 250ms ease-out; }
.md_btn_main::before { display: block; content: ""; position: absolute; top: 50%; right: 25px; width: 10px; height: 2px; background: #dc0032; transform: rotate(45deg) translate(0, -4px); transition: 0.25s all; }
.md_btn_main::after { display: block; content: ""; position: absolute; top: 50%; right: 25px; width: 10px; height: 2px; background: #dc0032; transform: rotate(-45deg) translate(0, 4px); transition: 0.25s all; }
.md_btn_main:hover { box-shadow: 0 10px 10px rgba(0, 0, 0, 0.15); }
.md_btn_main:hover::before { right: 15px; }
.md_btn_main:hover::after { right: 15px; }

/*============================
md_textLink
============================*/
.md_textLink { display: inline-block; color: #333; position: relative; padding-right: 30px; text-decoration: underline; }
.md_textLink::before {content: ""; position: absolute; right: 0; top: 50%; width: 20px; margin-top: -11px; height: 20px; border: 1px solid #333; border-radius: 20px; transition: 0.25s all; }
.md_textLink::after { content: ""; position: absolute; right: 8px; top: 50%; width: 6px; margin-top: -4px; height: 6px; border-top: 1px solid #333; border-right: 1px solid #333; transform: rotate(45deg); transition: 0.25s all; }
.md_textLink:hover::before { right: -5px; }
.md_textLink:hover::after { right: 3px; }

/*============================
font
============================*/
.md_font_centuryB { font-family: century-gothic, sans-serif; font-weight: 700; font-style: normal; }
.md_font_century { font-family: century-gothic, sans-serif; font-weight: 400; font-style: normal; }
.md_font_mincho { font-family: "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho"; }
.md_font_tategaki { writing-mode: vertical-rl; text-orientation: upright; }
.md_font_bebasKai { font-family: bebas-kai, sans-serif; font-weight: 400; font-style: normal; }
.md_font_hanamaki { font-family: "ab-hanamaki", sans-serif; font-weight: 400; font-style: normal; }

/*============================
br
============================*/
.md_br_sp { display: none; }
.md_br_pc { display: inline; }

/*============================
ClearFix
============================*/
.clearFix::after { clear: both; display: block; content: ""; height: 0; line-height: 0; }