@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 { padding-top: 90px; background: #ff8e44; background: linear-gradient(90deg, #d3538e, #f35c67 50%, #e76d52); position: relative; overflow: hidden; }
.md_panelArea h1 { font-size: 2.75em; color: #fff; padding: 120px 20px 110px; font-weight: bold; }
.md_panelArea .english { position: absolute; left: 0; bottom: -64px; font-size: 15em; color: #fff;; opacity: 0.1; }

/*============================
md_pankuzuArea
============================*/
.md_pankuzuArea { background: #eee; position: relative; z-index: 1; }
.md_pankuzuArea ul { padding: 12px 15px 13px;  display: flex; align-items: center; }
.md_pankuzuArea ul li { margin-right: 26px; font-size: 0.75em; line-height: 1.5; position: relative; }
.md_pankuzuArea ul li::after { display: block; content: ""; position: absolute; top: 4px; right: -14px; 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; }
.md_pankuzuArea ul li a span { text-decoration: underline; opacity: 0.5; }
.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/icon_home.svg") no-repeat center bottom; background-size: 15px 14px; }
.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_linkArea
============================*/
.md_linkArea { background: linear-gradient(rgba(0,0,0,0.05),rgba(0,0,0,0)); padding: 50px 0; }
.md_linkArea ul { text-align: center; }
.md_linkArea ul li { display: inline; margin-left: 20px; padding-left: 20px; border-left: solid 1px #ccc;  }
.md_linkArea ul li:first-child { margin-left: 0; padding-left: 0; border-left: none; }

/*============================
md_imgBox
============================*/
.md_imgBox { overflow: hidden; }
.md_imgBox img { transition-duration: 0.3s; }
.md_imgBox:hover img { transform: scale(1.2); transition-duration: 0.3s; opacity: 0.9; }

/*============================
.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_btn_red { position: relative; display: inline-block; min-width: 280px; padding: 21px 0 19px; background: #dc0032; color: #fff; 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_red::before { display: block; content: ""; position: absolute; top: 50%; right: 25px; width: 10px; height: 2px; background: #fff; transform: rotate(45deg) translate(0, -4px); transition: 0.25s all; }
.md_btn_red::after { display: block; content: ""; position: absolute; top: 50%; right: 25px; width: 10px; height: 2px; background: #fff; transform: rotate(-45deg) translate(0, 4px); transition: 0.25s all; }
.md_btn_red:hover { box-shadow: 0 10px 10px rgba(0, 0, 0, 0.15); background: #dd1265; }
.md_btn_red:hover::before { right: 15px; }
.md_btn_red:hover::after { right: 15px; }

.md_btn_grey { position: relative; display: inline-block; min-width: 280px; padding: 21px 0 19px; background: #ccc; color: #777; text-align: center; font-weight: bold; letter-spacing: 0.1em; border-radius: 50px; pointer-events: none; }

.md_btn_excel { display: inline-block; background-color: #f5f5f5; min-width: 300px; border: solid 4px #fff; color: #0f6b37; font-size: 1em; font-weight: bold; padding: 13px 30px 13px 0; text-align: center; position: relative; border-radius: 6px; text-decoration: underline; transition: 0.25s; }
.md_btn_excel::after { content:""; display: block; position: absolute; right: 10px; top: 50%; margin-top: -15px; width: 30px; height: 30px; background: url("../../imageFile/icon_excel.png") no-repeat center; background-size: 30px auto; transition: 0.25s; }
.md_btn_excel:hover { background-color: #ced; }
.md_btn_excel:hover::after {}

/*============================
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; }

.md_textLink_pageIn { display: inline-block; color: #333; position: relative; padding-right: 30px; text-decoration: underline; font-size: 1.125em; }
.md_textLink_pageIn::before {content: ""; position: absolute; right: 0; top: 50%; width: 20px; margin-top: -11px; height: 20px; border: 1px solid #777; border-radius: 20px; }
.md_textLink_pageIn::after { content: ""; position: absolute; right: 7px; top: 50%; width: 6px; margin-top: -5px; height: 6px; border-top: 1px solid #777; border-right: 1px solid #777; -webkit-transform: rotate(135deg); transform: rotate(135deg); }

/*============================
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; }