@charset "UTF-8";
@import url(https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500&display=swap&subset=japanese);

/******************************************************************
base
******************************************************************/
body { min-width: 320px; font-family: "Noto Sans JP", "游ゴシック体", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 14px; color: #181A24; line-height: 1.6; overflow-wrap: break-word;}

@media screen and (max-width: 767px) { body { font-size: 14px; } }

body[data-menu-open="true"] { overflow: hidden; }


/******************************************************************
layout - breadcrumb
******************************************************************/
.l-breadcrumb { max-width: 950px; margin-right: auto; margin-left: auto; padding-right: 30px; padding-left: 30px; }

.l-breadcrumb ol { padding-top: 10px; font-size: 12px; }

.l-breadcrumb ol::after { content: ""; display: block; clear: both; }

.l-breadcrumb ol li { float: left; padding-right: .5em; line-height: 1.6; }

.l-breadcrumb ol li a { line-height: 1.6; color: inherit; text-decoration: none; }

.l-breadcrumb ol li a:hover { text-decoration: underline; }

.l-breadcrumb ol li:not(:last-child)::after { content: '>'; padding-left: .5em; }

@media screen and (max-width: 767px) { .l-breadcrumb { display: none; } }


/******************************************************************
component - section
******************************************************************/
.c-section { position: relative; padding-top: 0.1px; padding-bottom: 0.1px; }

.c-section__detail { max-width: 950px; margin-right: auto; margin-left: auto; padding-right: 30px; padding-left: 30px; margin-top: 32px; margin-bottom: 56px; box-sizing: content-box; }

@media screen and (max-width: 767px) { .c-section__detail { margin-top: 24px; margin-bottom: 32px; padding-right: 24px; padding-left: 24px; } }

.l-contents a { color: #004098; text-decoration: none; }

.l-contents a:hover { text-decoration: underline; }

/******************************************************************
layout - pagetop
******************************************************************/
[data-pagetop] { position: relative; }

@media print { [data-pagetop] { display: none; } }

[data-pagetop] .l-pagetop__btn { display: none; position: absolute; bottom: 30px; right: 30px; overflow: hidden;}

[data-pagetop="fixed"] .l-pagetop__btn { position: fixed; z-index: 100; }

@media screen and (max-width: 767px) { [data-pagetop] .l-pagetop__btn { bottom: 10px; right: 10px; } }

.l-pagetop__btn { display: block; box-sizing: border-box; }

.l-pagetop__btn { position: relative; width: 45px; height: 45px; border-radius: 100%; background: #004098; transition-property: background; transition-duration: 0.3s; }

.l-pagetop__btn::after { position: absolute; content: ""; margin: auto; box-sizing: border-box; vertical-align: middle; top: 0; bottom: 0; right: 0; left: 0; transform: translate(4px, 1px) rotate(45deg); transform-origin: top left; border-top: 1px solid #fff; border-left: 1px solid #fff; width: 8px; height: 8px; transition-property: top, right, bottom, left; transition-duration: 0.3s; }

@media print, screen and (min-width: 768px) { .l-pagetop__btn:hover { background: #0055cb; } }

@media screen and (max-width: 767px) { .l-pagetop__btn { position: relative; width: 35px; height: 35px; }
  .l-pagetop__btn::after { position: absolute; content: ""; margin: auto; box-sizing: border-box; vertical-align: middle; top: 0; bottom: 0; right: 0; left: 0; transform: translate(3px, 1px) rotate(45deg); transform-origin: top left; border-top: 1px solid #fff; border-left: 1px solid #fff; width: 6px; height: 6px; transition-property: top, right, bottom, left; transition-duration: 0.3s; } }