@charset "utf-8";

/* =========================================================
  タイプ ： 基礎CSS設定
  更新日 ： 2017-06-29
========================================================= */


/* リセットスタイル
========================================================= */

ol, ul { list-style: none; margin-top: 0; margin-bottom: 0; padding-left: 0; }
dl { margin-top: 0; margin-bottom: 0; }
dd { margin-left: 0; }

h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 0; }

p { margin-top: 0; margin-bottom: 0; }
img { vertical-align: top; }

a:link { outline: 0; }



/* フォームリセットスタイル
========================================================= */

select { cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
select optgroup { background-color: #f5f5f5; }

/* webkit */
::-webkit-input-placeholder { color: #999999; }
:focus::-webkit-input-placeholder { color: transparent; }

/* FireFox */
:-moz-placeholder { opacity: 1; color: #999999; }
:focus:-moz-placeholder { color: transparent; }
::-moz-placeholder { opacity: 1; color: #999999; }
:focus::-moz-placeholder { color: transparent; }
select optgroup { font-style: normal; padding: 8px 2px 7px; }

/* IE */
:-ms-input-placeholder { color: #999999; }
select::-ms-expand { display: none; }

/* iOS */
input,
select,
textarea { -webkit-appearance: none; border-radius: 0; }



/* 基礎スタイル
========================================================= */

html { overflow-y: scroll; font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "Yu Gothic", "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Arial", sans-serif; font-size: 62.5%; line-height: 1; color: #222222; }
a { color: #782504; }
a:hover { text-decoration: none; }
header #headerBlock nav .megaMenu { display: none; }



/* 検索ポップアップ画面
========================================================= */

#searchWindow { position: fixed; top: 0; left: 0; z-index: 10000; width: 100%; height: 100%; background-color: rgba(51,51,51,0.92); opacity: 0; }
#searchWindow #searchWindowInner { position: relative; width: 100%; height: 100%; }
#searchWindow #searchWindowInner a#searchWindowClose { position: absolute; top: 35px; right: 35px; z-index: 10300; width: 51px; height: 51px; cursor: pointer; }
#searchWindow #searchWindowInner a#searchWindowClose div { position: relative; width: 51px; height: 51px; }
#searchWindow #searchWindowInner a#searchWindowClose div:before { position: absolute; top: 23px; left: -9px; width: 68px; height: 4px; background-color: #ffffff; content: ""; -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: ease 0.2s; transition: ease 0.2s; }
#searchWindow #searchWindowInner a#searchWindowClose div:after  { position: absolute; top: 23px; left: -9px; width: 68px; height: 4px; background-color: #ffffff; content: ""; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: ease 0.2s; transition: ease 0.2s; }
#searchWindow #searchWindowInner a:hover#searchWindowClose div:before,
#searchWindow #searchWindowInner a:hover#searchWindowClose div:after { background-color: #999999; }
#searchWindow #searchWindowInner #searchWindowBtn { position: absolute; top: 0; left: 0; z-index: 10100; width: 100%; height: 100%; background-color: rgba(0,0,0,0); }
#searchWindow #searchWindowInner #searchWindowBox { position: absolute; top: 50%; left: 50%; z-index: 10200; width: 800px; height: 80px; margin-top: -40px; margin-left: -400px; }
#searchWindow #searchWindowInner #searchWindowBox input[type="text"] { font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "Yu Gothic", "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Arial", sans-serif; font-size: 3rem; line-height: 3.6rem; color: #999999; font-weight: 500; }
#searchWindow #searchWindowInner #searchWindowBox input[type="text"] { float: left; width: 695px; height: 80px; background-position: 20px center !important; border: 0 !important; padding: 0 0 0 25px !important; }
#searchWindow #searchWindowInner #searchWindowBox input[type="submit"] { float: left; width: 80px; height: 80px; border: 0; background: url(/common/images/header_search_n.svg) no-repeat center #1b1b1b; background-size: 40px 40px; cursor: pointer; }



/* 基礎レイアウト
========================================================= */

header { position: fixed; z-index: 9999; width: 100%; min-width: 1240px; background-color: #ffffff; }
header #headerBlock { width: 1200px; text-align: right; margin-right: auto; margin-left: auto; }
header #headerBlock #headerInner { position: relative; padding-top: 63px; }
header #headerBlock #headerInner #headerLogo { position: absolute; top: 17px; left: 0; }
header #headerBlock #headerInner #headerLogo img { width: 190px; height: 80px; }
header #headerBlock #headerInner #headerMenu { position: absolute; top: 17px; right: 54px; }
header #headerBlock #headerInner #headerMenu a { display: inline-block; color: #222222; text-decoration: none; vertical-align: top; }

/* header #headerBlock #headerInner #headerMenu a:nth-child(1) { position: relative; font-size: 1.4rem; line-height: 1.8rem; font-weight: 700; padding: 8px 14px; }
header #headerBlock #headerInner #headerMenu a:nth-child(1):after { position: absolute; left: 0; right: 0; bottom: 3px; display: block; height: 2px; background-color: #222222; margin-right: 14px; margin-left: 14px; content: ""; opacity: 0; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; }
header #headerBlock #headerInner #headerMenu a:nth-child(1):hover:after { opacity: 1; }
header #headerBlock #headerInner #headerMenu a:nth-child(2) { background-color: #e6e6e6; font-size: 1.4rem; line-height: 1.8rem; padding: 8px 14px; margin-left: 15px; -webkit-transition: 0.3s ease; transition: 0.3s ease; }
header #headerBlock #headerInner #headerMenu a:nth-child(2):hover { background-color: #1b1b1b; color: #ffffff; } */

/* header #headerBlock #headerInner #headerMenu a:nth-child(1) { background-color: #44ece5; font-size: 1.6rem; line-height: 1.8rem; padding: 8px 20px; -webkit-transition: 0.3s ease; transition: 0.3s ease; border-radius: 15px; }
header #headerBlock #headerInner #headerMenu a:nth-child(1):hover { background-color: #22837f; color: #ffffff; } */
header #headerBlock #headerInner #headerMenu a:nth-child(1) { background-color: #e6e6e6; font-size: 1.6rem; line-height: 1.8rem; padding: 8px 20px; -webkit-transition: 0.3s ease; transition: 0.3s ease; border-radius: 15px; }
header #headerBlock #headerInner #headerMenu a:nth-child(1):hover { background-color: #1b1b1b; color: #ffffff; }
header #headerBlock #headerInner #headerMenu a:nth-child(2) { position: relative; font-size: 1.4rem; line-height: 1.8rem; font-weight: 700; padding: 8px 14px; margin-left: 30px; }
header #headerBlock #headerInner #headerMenu a:nth-child(2):after { position: absolute; left: 0; right: 0; bottom: 3px; display: block; height: 2px; background-color: #222222; margin-right: 15px; margin-left: 15px; content: ""; opacity: 0; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; }
header #headerBlock #headerInner #headerMenu a:nth-child(2):hover:after { opacity: 1; }
header #headerBlock #headerInner #headerMenu a:nth-child(3) { background-color: #e6e6e6; font-size: 1.4rem; line-height: 1.8rem; padding: 8px 14px; margin-left: 15px; -webkit-transition: 0.3s ease; transition: 0.3s ease; }
header #headerBlock #headerInner #headerMenu a:nth-child(3):hover { background-color: #1b1b1b; color: #ffffff; }

header #headerBlock #headerInner #headerSearchBtn { position: absolute; top: 12px; right: 0; width: 44px; height: 44px; cursor: pointer; }
header #headerBlock #headerInner #headerSearchBtn:before { position: absolute; top: 5px; left: 5px; display: block; width: 30px; height: 30px; background: url(/common/images/header_search_r.svg) no-repeat center #ffffff; background-size: 19px 19px; border: solid 2px #1b1b1b; content: ""; }
header #headerBlock #headerInner #headerSearchBtn:after  { position: absolute; top: 5px; left: 5px; display: block; width: 34px; height: 34px; background: url(/common/images/header_search_n.svg) no-repeat center #1b1b1b; background-size: 19px 19px; content: ""; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; }
header #headerBlock #headerInner #headerSearchBtn:hover:after { opacity: 0; }
header #headerBlock nav { display: inline-block; }
header #headerBlock nav .megaMenu a { text-decoration: none; }
header #headerBlock nav .megaMenu .mMenuBtn { display: inline-block; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuLink { display: inline-block; font-size: 1.5rem; line-height: 1.8rem; font-weight: 700; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuLink:focus,
header #headerBlock nav .megaMenu .mMenuBtn .mMenuLink.open { color: #ffffff; -webkit-transition: 0.3s ease; transition: 0.3s ease; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(1) .mMenuLink { position: relative; color: #222222; padding: 12px 14px 17px; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(1) .mMenuLink:after { position: absolute; left: 0; right: 0; bottom: 14px; display: block; height: 2px; background-color: #222222; margin-right: 14px; margin-left: 14px; content: ""; opacity: 0; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(1) .mMenuLink:hover:after { opacity: 1; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(n+2) .mMenuLink { position: relative; padding: 12px 35px 17px 14px; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(n+2) .mMenuLink:after { position: absolute; top: 13px; right: 13px; display: block; width: 7px; height: 7px; border-right: solid 3px #000000; border-bottom: solid 3px #000000; content: ""; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(n+2) .mMenuLink:focus:after,
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(n+2) .mMenuLink.open:after { border-color: #ffffff; -webkit-transition: 0.3s ease; transition: 0.3s ease; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(n+3) { border-left: solid 4px #ffffff; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(2) .mMenuLink:focus, header #headerBlock nav .megaMenu .mMenuBtn:nth-child(2) .mMenuLink.open { background-color: #3099b3; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(3) .mMenuLink:focus, header #headerBlock nav .megaMenu .mMenuBtn:nth-child(3) .mMenuLink.open { background-color: #34a9a2; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(4) .mMenuLink:focus, header #headerBlock nav .megaMenu .mMenuBtn:nth-child(4) .mMenuLink.open { background-color: #8874aa; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(5) .mMenuLink:focus, header #headerBlock nav .megaMenu .mMenuBtn:nth-child(5) .mMenuLink.open { background-color: #444444; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(6) .mMenuLink:focus, header #headerBlock nav .megaMenu .mMenuBtn:nth-child(6) .mMenuLink.open { background-color: #cf6665; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList { position: absolute; top: -9999px; left: 0; overflow: hidden; width: 100%; min-width: 1200px; color: #ffffff; text-align: left; opacity: 0; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList.open { top: 110px; opacity: 1; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(2) .mMenuList { background-color: #3099b3; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(3) .mMenuList { background-color: #34a9a2; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(4) .mMenuList { background-color: #8874aa; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(5) .mMenuList { background-color: #444444; }
header #headerBlock nav .megaMenu .mMenuBtn:nth-child(6) .mMenuList { background-color: #cf6665; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList a { color: #ffffff; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock { width: 1200px; margin: 40px auto; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner { display: table; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListTitle { display: table-cell; min-width: 130px; font-size: 1.8rem; line-height: 2.6rem; font-weight: 700; vertical-align: top; padding-top: 8px; padding-right: 70px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListTitle a { display: block; padding: 8px 10px 8px 0; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink { display: table-cell; border-left: solid 1px #ffffff; vertical-align: top; padding: 1px 20px 5px 6px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink + .mmListTitle { padding-left: 150px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn { display: inline-block; vertical-align: top; margin: 10px 10px 10px 40px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn div { position: relative; font-size: 1.8rem; line-height: 2.6rem; padding: 7px 10px 7px 20px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn div:before { position: absolute; top: 16px; left: 5px; display: block; width: 4px; height: 4px; background-color: #ffffff; border-radius: 2px; content: ""; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty1 { font-size: 1.8rem; line-height: 2.6rem; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty2 { font-size: 1.4rem; line-height: 2rem; margin-left: 24px; }

header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty1 li a span.menuExternal { position: relative; display: inline-block; padding-right: 30px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty1 li a span.menuExternal:before { position: absolute; top: 13px; right: 12px; display: block; width: 9px; height: 7px; box-sizing: border-box; border-bottom: solid 1px #ffffff; border-left: solid 1px #ffffff; content: ""; -webkit-transition: 0.3s ease; transition: 0.3s ease; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty1 li a span.menuExternal:after { position: absolute; top: 6px; right: 6px; display: block; width: 12px; height: 11px; box-sizing: border-box; border: solid 1px #ffffff; content: ""; -webkit-transition: 0.3s ease; transition: 0.3s ease; }

header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty1 li a,
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty2 li a { position: relative; display: block; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty1 li a { padding: 7px 10px 7px 20px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty2 li a { padding: 6px 10px 6px 20px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty1 li a:before,
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty2 li a:before { position: absolute; left: 0; display: block; width: 7px; height: 7px; border-right: solid 1px #ffffff; border-bottom: solid 1px #ffffff; content: ""; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: 0.2s ease; transition: 0.2s ease; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty1 li a:before { top: 15px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty2 li a:before { top: 11px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty1 li a:hover:before,
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty2 li a:hover:before { left: 4px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty2 li span { opacity: 0.4; position: relative; display: block; padding: 6px 10px 6px 20px; }
header #headerBlock nav .megaMenu .mMenuBtn .mMenuList .mmListBlock .mmListInner .mmListLink .mmLinkColumn .mmLinkSty2 li span:before { position: absolute; top: 11px; left: 0; display: block; width: 7px; height: 7px; border-right: solid 1px #ffffff; border-bottom: solid 1px #ffffff; content: ""; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

#breadcrumb { padding-top: 110px; }
#breadcrumb .bcInner  { width: 100%; min-width: 1240px; background-color: #e6e6e6; font-size: 1.3rem; line-height: 1.8rem; }
#breadcrumb ul { overflow: hidden; width: 1200px; box-sizing: border-box; padding-left: 10px; margin-right: auto; margin-left: auto; }
#breadcrumb ul li { float: left; padding-top: 10px; padding-bottom: 10px; }
#breadcrumb ul li + li { position: relative; padding-left: 38px; }
#breadcrumb ul li + li:before { position: absolute; top: 15px; left: 12px; display: block; width: 9px; height: 9px; border-right: solid 1px #555555; border-bottom: solid 1px #555555; content: ""; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
#breadcrumb ul li a { color: #222222; text-decoration: none; }
#breadcrumb ul li a:hover { text-decoration: underline; }

#wrapper { width: 1240px; box-sizing: border-box; font-size: 1.6rem; line-height: 3rem; font-weight: 500; padding: 60px 50px; margin-right: auto; margin-left: auto; }
#wrapperLong { width: 100%; min-width: 1240px; font-size: 1.6rem; line-height: 3rem; font-weight: 500; padding-top: 60px; padding-bottom: 60px; margin-right: auto; margin-left: auto; }

#pagetop { width: 1240px; margin: 10px auto 40px; }
#pagetop a { display: block; text-indent: 150%; white-space: nowrap; overflow: hidden; width: 44px; height: 23px; background: url(/common/images/pagetop.svg) no-repeat center; background-size: 44px 23px; padding: 20px; margin-right: auto; margin-left: auto; -webkit-transition: 0.3s ease; transition: 0.3s ease; }
#pagetop a:hover { background-position: center 15px; }

footer { width: 100%; min-width: 1240px; background-color: #595959; color: #ffffff; }
footer #footerArea { position: relative; width: 1200px; height: 140px; margin-right: auto; margin-left: auto; }
footer #footerArea #copyright { position: absolute; top: 36px; left: 30px; font-size: 1.4rem; line-height: 2.2rem; }
body.deviceAd footer #footerArea #copyright { font-family: "Arial", sans-serif; }
footer #footerArea #footerMenu { position: absolute; top: 31px; right: 20px; font-size: 1.3rem; line-height: 2.2rem; }
footer #footerArea #footerMenu a { position: relative; display: inline-block; color: #ffffff; text-decoration: none; padding: 6px 10px; margin-left: 10px; }
footer #footerArea #footerMenu a:after { position: absolute; left: 0; right: 0; bottom: 3px; display: block; height: 1px; background-color: #cecece; margin-right: 10px; margin-left: 10px; content: ""; opacity: 0; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; }
footer #footerArea #footerMenu a:hover:after { opacity: 1; }
