@charset "utf-8";
/* CSS Document */

:root {
	--color-text: #000;
	--color-primary: #13449d;
	--color-primary-rgb: 19,68,157;
    --color-link: #ecc106;
	--color-link-rgb: 236,193,6;
}

html, body {
	margin: 0;
	padding: 0;
	/*overflow-x: hidden;*/
	font-family: "Noto Sans JP", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	scroll-behavior: smooth;
	-webkit-text-size-adjust: none; -moz-text-size-adjust: none; text-size-adjust: none;
	font-size: 16px;
    color: var(--color-text, #000);
}


/***** header *****/
header h1 { margin: 0; padding: 1.5rem 0; text-align: center; }
.secondPage header #headerNavi { margin-bottom: 1rem; }
.secondPage header #headerNavi nav.col ul { list-style: none; padding: 0; }
.secondPage header #headerNavi nav.col ul li { padding: 0; }
.secondPage header #headerNavi nav.col ul li a { display: block; padding: 0.5rem 10px; font-size: 0.875rem; color: #fff; text-align: center; text-decoration: none; background-color: var(--color-primary); }
.secondPage header #headerNavi .searchWrap form input[name="search"],
.secondPage header #headerNavi .searchWrap form input[type="submit"] { padding: 5px 1rem; color: var(--color-text); font-size: 0.85rem; line-height: 1; border: 1px solid #666; border-radius: 3px; border-collapse: collapse; box-sizing: border-box; }
.secondPage header #headerNavi .searchWrap form input[type="submit"] { padding-top: 6px; cursor: pointer; border-collapse: collapse; background-color: #e0e0e0; }
.secondPage #globalNavi ul { list-style: none; margin: 0; padding: 0; }
.secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul { display: none; }
@media (max-width: 767px) {
    .secondPage header h1 { padding-bottom: 0.5rem; }
    .secondPage header #headerNavi nav.col ul { margin: 0 auto 1rem; width: 90%; }
    .secondPage header #headerNavi nav.col ul li { margin: 0 auto; width: 45%; }
    .secondPage header #headerNavi nav.col ul li:first-child { float: right; }
    .secondPage header #headerNavi nav.col ul li:last-child { float: left; }
    .secondPage header #headerNavi .searchWrap form { text-align: center; }
    .secondPage header #headerNavi .searchWrap form input[name="search"] { width: 60%; }
    .secondPage header #headerNavi .searchWrap form input[type="submit"] { width: 30%; }
    .secondPage #globalNavi { background-color: var(--color-link); user-select: none; }
    .secondPage #globalNavi #menuOpen + .inner { display: none; }
    .secondPage #globalNavi > .inner > ul.clearfix > li { border-bottom: 1px dotted var(--color-text); }
    .secondPage #globalNavi > .inner > ul.clearfix > li:last-child { border-bottom: none; }
    .secondPage #globalNavi > .inner > ul.clearfix > li > a,
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span { position: relative; display: block; padding: 1rem 1rem 1rem 0; color: var(--color-text); text-decoration: none; cursor: pointer; }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span::before { content: ""; width: 7px; height: 7px; border-top: solid 1px var(--color-text); border-right: solid 1px var(--color-text); transform: rotate(135deg); position: absolute; right: 11px; top: 1.5rem; }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul { background-color: #fff; }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent:last-child > span + ul { margin-bottom: 1rem; }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul li { border-bottom: 1px dotted var(--color-text); }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul li:last-child { border-bottom: none; }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul li a { display: block; padding: 1rem; color: var(--color-primary); text-decoration: none; }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul li a.childCatSub { padding-left: 2rem; color: #fff; background-color: #999; border-top: 1px dotted var(--color-text); }
    .secondPage #globalNavi #menuOpen { margin: 0; padding: 1rem; color: #fff; background-color: var(--color-primary); cursor: pointer; }
}
@media print, screen and (min-width: 768px){
    header h1 { float: left; width: 45%; max-width: 400px; text-align: left; }
    .secondPage header h1 { padding-bottom: 0; }
    .secondPage header { position: relative; }
    .secondPage header #headerNavi nav.col ul { margin: 0 0 1rem -1%; }
    .secondPage header #headerNavi nav.col ul li { float: right; margin: 0 0 0 1%; width: 28%; }
    .secondPage header #headerNavi nav.col ul li a:hover { color: var(--color-text); background-color: var(--color-link); }
    .secondPage header #headerNavi .searchWrap form { float: right; width: 100%; text-align: right; }
    .secondPage #globalNavi { background-color: var(--color-primary); }
    .secondPage #globalNavi > .inner > ul.clearfix { display: flex; justify-content: space-between; }
    .secondPage #globalNavi > .inner > ul.clearfix > li { width: 100%; text-align: center; font-size: 0.9rem; user-select: none; }
    .secondPage #globalNavi > .inner > ul.clearfix > li > a,
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span { display: block; padding: 0.8rem 1rem; color: #fff; text-decoration: none; border-left: 1px solid #fff; box-sizing: border-box; cursor: pointer; }
    .secondPage #globalNavi > .inner > ul.clearfix > li:last-child > a,
    .secondPage #globalNavi > .inner > ul.clearfix > li:last-child > span { border-right: 1px solid #fff; }
    .secondPage #globalNavi > .inner > ul.clearfix > li > a:hover,
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span:hover,
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span.selected { color: var(--color-text); background-color: var(--color-link); }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul { position: absolute; min-width: calc(90% / 4); z-index: 999; text-align: left; border: 1px solid #fff; background-color: var(--color-link); }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul li { border-bottom: 1px solid #fff; }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul li a.childCatSub { padding-left: 2rem; background-color: #ccc; border-top: 1px solid #fff; }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul li a { display: block; padding: 1rem; color: var(--color-text); text-decoration: none; }
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul li a:hover { color: #fff; background-color: var(--color-primary); }
}
@media print, screen and (min-width: 960px){}
@media print, screen and (min-width: 1200px){
    .secondPage #globalNavi > .inner > ul.clearfix > li.menuParent > span + ul { min-width: calc(1200px / 4); }
}


/***** main *****/
section h2 { margin: 0 0 3rem; padding: 0; text-align: center; font-size: 2.5rem; font-weight: normal; line-height: 1; }
section h2 span { font-size: 0.5em; color: var(--color-primary); }
.titleUnderLine { position: relative; padding-bottom: 1.5rem; }
.titleUnderLine:before { position: absolute; bottom: 0px; left: calc(50% - 30px); width: 60px; height: 2px; content: ''; background-color: var(--color-primary); }
@media (max-width: 767px) {
    section h2 { font-size: 2.3rem; }
}
@media print, screen and (min-width: 768px){}
@media print, screen and (min-width: 960px){}
@media print, screen and (min-width: 1024px){}


/***** ログイン後トップページ *****/
/* slick-slider */
#topPage ul.slick-slider { list-style: none; margin: 0; padding: 0; }
#topPage .slick-slide { padding: 10px; }
@media (max-width: 767px) {}
@media print, screen and (min-width: 768px){}
@media print, screen and (min-width: 960px){}
@media print, screen and (min-width: 1024px){}

/* 背景色切り替え*/
#topPage .backColorChange { margin-top: 5rem; }
#topPage .backColorChange > section:nth-child(odd) { background-color: rgba(var(--color-primary-rgb),0.1); }
@media (max-width: 767px) {}
@media print, screen and (min-width: 768px){}
@media print, screen and (min-width: 960px){}
@media print, screen and (min-width: 1024px){}

/* 新着情報 */
#topPage .topicsWrap.inner { background-color: #fff; box-sizing: border-box; }
#topPage ul.topicsList { list-style: none; margin: 0; padding: 0; }
#topPage ul.topicsList li { margin: 0 0 15px; padding: 0 0 10px; border-bottom: 1px solid #ccc; }
#topPage ul.topicsList li:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
#topPage ul.topicsList li span { display: inline-block; margin-right: 10px;}
#topPage ul.topicsList li a.topicsTitle { display: block; margin: 10px 0 0; }
@media (max-width: 767px) {
#topPage .topicsWrap.inner { padding: 2rem 1.5rem; }
#topPage .topicsWrap a.linkButton { display: inline-block; padding-top: 0.5rem; padding-bottom: 0.5rem; }
}
@media print, screen and (min-width: 768px){
#topPage .topicsWrap.inner { padding: 2rem 3rem; }
}
@media print, screen and (min-width: 960px){}
@media print, screen and (min-width: 1024px){}


/***** 投稿記事ページ *****/
.topicsIndexWrap { padding-bottom: 2rem; }
.topicsIndexTitle { margin: 0 0 3rem; padding: 1rem; color: #fff; text-align: center; background-color: var(--color-primary); }
.topicsEntryWrap { margin: 0 0 2rem; border: 2px solid #ccc; }
.topicsEntryTitle { position: relative; margin: 0 0 2rem; padding: 1rem; font-weight: normal; font-size: 1.5rem; background-color: rgba(var(--color-primary-rgb), 0.1); }
.topicsEntryTitle:before,
.topicsEntryTitle:after { position: absolute; top: 100%; left: 3rem; height: 0; width: 0; border: solid rgba(var(--color-primary-rgb), 0.1); content: ""; }
.topicsEntryTitle:before { border-color: transparent; border-top-color: rgba(var(--color-primary-rgb), 0.1); border-width: 20px; }
.topicsEntryTitle:after { margin-left: -8px; border-color: transparent; border-width: 8px; }
.topicsEntryBody img { max-width: 100% !important; height: auto !important; }
@media (max-width: 767px) {
    .topicsEntryWrap { padding: 1rem; }
}
@media print, screen and (min-width: 768px){
    .topicsEntryWrap { padding: 3rem; }
}
@media print, screen and (min-width: 960px){}
@media print, screen and (min-width: 1024px){}


/***** Common Area *****/
.gradientGray { padding-top: 5rem; background: #E6E6E6; background: linear-gradient(180deg, rgba(230, 230, 230, 1) 0%, rgba(255, 255, 255, 0) 100%); }
.bannerWrap .bannerWrap2,
.bannerWrap .bannerWrap3,
.bannerWrap .bannerWrap5 { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; }
.bannerWrap .bannerBox { text-align: center; }
.bannerWrap .bannerBox a img { border: 1px solid #ccc; }
.bannerWrap .bannerBox a img:hover { opacity: 0.8; }
@media (max-width: 767px) {
    .bannerWrap .bannerBox { margin: 0 0 1%; width: 49%; }
    .bannerWrap .bannerBox.bonusButton { margin-bottom: 2%; }
    .bannerWrap:not(.recommendBanner) .bannerBox:last-child { margin-bottom: 0; }
}
@media print, screen and (min-width: 768px){
    .bannerWrap .bannerBox { width: 30%; }
    .bannerWrap .bannerBox a.linkButton { width: 80%; }
    .bannerWrap .bannerWrap2 .bannerBox:nth-of-type(1),
    .bannerWrap .bannerWrap5 .bannerBox:nth-of-type(4) { margin-left: 17.5%; }
    .bannerWrap .bannerWrap2 .bannerBox:nth-of-type(2),
    .bannerWrap .bannerWrap5 .bannerBox:nth-of-type(5) { margin-right: 17.5%; }
}
@media print, screen and (min-width: 960px){}
@media print, screen and (min-width: 1024px){}


/***** footer *****/
footer { padding: 3rem 0 2rem; color: #fff; background-color: var(--color-primary); }
footer #copyright { margin-top: 3rem; }
.secondPage footer { margin-top: 5rem; }
#pageTop { display: inline-block; position: fixed; bottom: 2rem; right: 2rem; }
#pageTop a { display: block; padding: 0.5rem 2rem; font-size: 0.9rem; text-align: center; color: #fff; text-decoration: none; background-color: var(--color-primary); border: 2px solid #fff; }
@media (max-width: 767px) {
    footer { text-align: center; }
    }
@media print, screen and (min-width: 768px){
    footer #copyright { text-align: right; }
}


/***** image *****/
img.imageFull { width: 100% !important; height: auto !important; }
img.imageMax { max-width: 100% !important; height: auto !important; }


/***** link *****/
a.linkButton { display: inline-block; padding: 10px 2rem; color: var(--color-text); text-decoration: none; background-color: rgba(var(--color-link-rgb),1.0); border-radius: 3px; }
a.linkButton:hover { background-color: rgba(var(--color-link-rgb),0.8); }
@media (max-width: 767px) {
    a.linkButton { display: block; padding-top: 2rem; padding-bottom: 2rem; }
}
@media print, screen and (min-width: 768px){
    a.linkButton.minW18rem { min-width: 18rem; }
}


/***** align *****/
.center { text-align: center; }
.centerBox { display: table; margin-right: auto; margin-left: auto; }
.right { text-align: right; }
@media (max-width: 767px) {
    .center-sp { text-align: center; }
    .right-sp { text-align: right; }
}
@media print, screen and (min-width: 768px){
    .center-pc { text-align: center; }
    .right-pc { text-align: right; }
}

/***** table *****/
table.tableStyle { margin: 0 auto; border-collapse: collapse; }
table.tableStyle th,
table.tableStyle td { padding: 1rem 2rem; font-weight: normal; text-align: left; vertical-align: top; }
table.tableStyle th { white-space: nowrap; }
@media (max-width: 767px) {
    table.tableStyle { border-top: 1px solid #000; }
    table.tableStyle th,
    table.tableStyle td { display: block; border-bottom: 1px solid #000; }
    table.tableStyle th { background-color: rgba(var(--color-primary-rgb),0.1); }
}
@media print, screen and (min-width: 768px){
    table.tableStyle th,
    table.tableStyle td { border-bottom: 1px solid #000; }
    table.tableStyle th.rowSpan { border-bottom: none; }
}


/***** layout *****/
em { display: inline-block; font-style: normal; }
.sectionWrap { padding-top: 5rem; padding-bottom: 5rem; }
.clearfix { zoom: 1; overflow: hidden; }
.clearfix:after { content: ""; display: block; clear: both; }
@media (max-width: 767px) {
    .pcOnly { display: none !important; }
	.inner { padding-right: 20px; padding-left: 20px; }
    .inner .inner { padding: 0; width: 100%; }
}
@media print, screen and (min-width: 768px){
    .spOnly { display: none !important; }
    .inlineBlock-pc { display: inline-block; }
	.inner { margin: 0 auto; width: 90%; }
	.inner .inner { width: 80%; }
    .col { float: left; }
    .col2 .col { width: 49%; }
    .col2 .col:last-child { float: right; }
    .col64 .col:first-child { width: calc(40% - 15px); margin-right: 15px; }
    .col64 .col:last-child { width: calc(60% - 15px); margin-left: 15px; }
}
@media print, screen and (min-width: 1024px){
    .inner { margin: 0 auto; max-width: 1200px; }
    .inner .inner { max-width: 960px; }
    section .inner { max-width: 1024px; }
}
