/*RESET*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/**/
#wpadminbar { display: none !important;}

a { color: #333; text-decoration: none;}

body {
	color: #333;
	font-family: 'Zen Maru Gothic', "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif", serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.6;
	padding-top: 4.8rem;
	
	--cate01_color:#d62970;
	--cate02_color:#E36414;
	--cate03_color:#139fab;
	--cate04_color:#4c3a96;
}

header {
	width: 100%;
	box-sizing: border-box;
	background: #0063b2;
	padding: 0.5rem 2.5rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 99;
}
header .header-logo a,
header .header-logo img { display: block;}


/*-----------------------menu-----------------------*/
.btn,.overray { display: none;}

.menu {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.menu ul {
	display: flex;
	justify-content: center;
	align-items: center;
}
.menu li a {
	display: block;
	text-align: center;
	box-sizing: border-box;
	font-weight: bold;
	font-size: 0.9rem;
	color: #FFF;
	text-decoration: none;
	padding: 0 2.5rem;
	line-height: 1;
}
.menu li:not(:last-child) { border-right: 1px solid #FFF;}

.menu input[type="search"] {
    padding: 0.5rem 1rem;
    border-radius: 3rem;
    width: 178px;
    overflow: hidden;
    font-family: 'Zen Maru Gothic', serif;
    font-size: 0.8rem;
	border: none;
	box-sizing: border-box;
}
.menu button[type="submit"] {
    cursor: pointer;
    font-family: FontAwesome;
    font-size: 1.5rem;
    border: none;
    color: #FFF;
    outline: none;
	background: none;
}

/*----------------------//menu----------------------*/

.tab-btn {
	width: calc(100% / 4);
	display: flex;
	justify-content: center;
	align-items: center;
	padding:0.8em 0;
	text-align: center;
	color: #FFF ;
	font-weight: bold;
	transition: all 0.2s ease;
	cursor: pointer;
	position: relative;
	line-height: 1.2;
	font-size: 0.8rem;
	border-radius: 1rem 1rem 0 0;
	background: #FFF;
	border: 2px solid;
}
.tab-btn.cate01 {
	border-color: var(--cate01_color);
	color: var(--cate01_color);
}
.tab-btn.cate02 {
	border-color: var(--cate02_color);
	color: var(--cate02_color);
}
.tab-btn.cate03 {
	border-color: var(--cate03_color);
	color: var(--cate03_color);
}
.tab-btn.cate04 {
	border-color: var(--cate04_color);
	color: var(--cate04_color);
}

.tab-btn.show { color: #FFF;}
.tab-btn.show.cate01 { background: var(--cate01_color);}
.tab-btn.show.cate02 { background: var(--cate02_color);}
.tab-btn.show.cate03 { background: var(--cate03_color);}
.tab-btn.show.cate04 { background: var(--cate04_color);}


.w1200 { 
	max-width: 1200px;
	margin: 0 auto;
}
.grayWrap { 
	background: #ebebeb;
	padding: 2rem 0;
}
.secFlex {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 2rem;
}
.left-content { width: 74%;}
.right-content { width: 26%;}

.sub-title {
	font-weight: bold;
	font-size: 1.5rem;
	margin-bottom: 1.5rem;
}
.article-list {
	display: flex;
	justify-content: flex-start;
	align-items: stretch;
	flex-wrap: wrap;
	gap : 1rem;
	margin-bottom: 2rem;
}
.list-box {
	width: calc(100% / 3 - 1rem);
	background: #FFF;
}
.list-img { 
	overflow: hidden;
	height: 32%;
	/*display: flex;
	justify-content: center;
	align-items: center;*/
}
.list-img img {
	display: block;
	width: 100%;
}
.list-bottom { padding: 1rem;}
.list-bottom ul {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 0.5rem;
}
.list-bottom ul li {
	font-size: 80%;
	padding: 0.2rem 1rem;
	color: #FFF;
	line-height: 1;
	border-radius: 3rem;
}
.list-bottom ul li.cate01 { background: var(--cate01_color); }
.list-bottom ul li.cate02 { background: var(--cate02_color); }
.list-bottom ul li.cate03 { background: var(--cate03_color); }
.list-bottom ul li.cate04 { background: var(--cate04_color); }

.list-title {
	font-weight: bold;
	margin-bottom: 0.5rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; 
    overflow: hidden;
	text-overflow: ellipsis;	
}
.list-txt { 
	color: #a6a6a6;
}
.list-txt p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; 
    overflow: hidden;
	text-overflow: ellipsis;	
}
.list-date {
	text-align: right;
	color: #a6a6a6;
	font-weight: bold;
}

.nav-links {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1rem;
}
.nav-links .next,
.nav-links .prev { font-family: FontAwesome;}

.nav-links a,
.nav-links span {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 2rem;
	height: 2rem;
	background: #FFF;
	font-weight: bold;
	border-radius: 50%;
	line-height: 1;
}
.nav-links span.current {
	background: #0063b2;
	color: #FFF;
}


.right-content img { max-width: 100%; }
.add-area { 
	margin-bottom: 2rem;
	text-align: center;
}

.side-cateList {
	background: #FFF;
	border-radius: 1rem;
	margin-bottom: 2rem;
}
.side-cateTitle {
	padding: 1rem;
	font-weight: bold;
	display: flex;
	align-items: center;
}
.side-cateTitle::before {
	content: "";
	width: 2em;
	height: 1em;
	background: url("../img/icon_category.png") no-repeat center;
	margin-right: 0.2rem;
}

.side-cateTab .wrapSlide { 
	visibility: hidden;
	height: 0;
	flex-direction: column;
	box-sizing: border-box;
}
.side-cateTab .wrapSlide.show { 
	visibility: inherit;
	height: auto;
	padding: 1rem;
	border: solid 2px;
}
.side-cateTab .wrapSlide.show.cate01 { border-color:var(--cate01_color); }
.side-cateTab .wrapSlide.show.cate02 { border-color:var(--cate02_color); }
.side-cateTab .wrapSlide.show.cate03 { border-color:var(--cate03_color); }
.side-cateTab .wrapSlide.show.cate04 { border-color:var(--cate04_color); }

.side-cateTab .wrapSlide li a {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 0.5rem;
}

.side-tabBtn ul {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.side-tabBtn ul li { width: calc(100% / 4);}

.side-tabContents li:not(:last-child) {
	padding-bottom: 0.5rem;
	border-bottom: 1px dashed #a6a6a6;
}
.side-tabContents li:not(:first-child) {
	padding-top: 0.5rem;
}
.side-tabContents .thum-img { 
	width: 22%;
	font-weight: bold;
	text-align: center;
	font-size: 0.7rem;
	color: #a6a6a6;
}
.side-tabContents p { 
	width: 78%;
	font-size: 0.8rem;
	font-weight: bold;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; 
    overflow: hidden;
	text-overflow: ellipsis;	
}

.side-tag {
	background: #FFF;
	border-radius: 1rem;
	overflow: hidden
}
.side-tagTitle {
	background: #0063b2;
	color: #FFF;
	font-weight: bold;
	padding: 0.5rem;
	display: flex;
	align-items: center;
}
.side-tagTitle::before {
	content: "";
	width: 1.8rem;
	height: 1.8rem;
	display: block;
	background: url("../img/icon_tag.png") no-repeat center;
	margin-right: 0.5rem;
}
.side-tag ul {
	padding: 1rem;
}
.side-tag ul li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0.5rem;
	font-weight: bold;
	font-size: 0.8rem;
}
.side-tag ul li i {
	font-family: FontAwesome;
	color: #0063b2;
	font-weight: 900;
}
.side-tag ul li:not(:last-child) {
	padding-bottom: 0.5rem;
	border-bottom: 1px dashed #a6a6a6;
	margin-bottom: 0.5rem;
}

footer { 
	background: #0063b2;
	color: #FFF;
}
footer .w1200 {
	padding: 2rem 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.footer-logo { font-size: 0.8rem;}
.footer-logo img { margin-bottom: 1rem;}

.site-map {
	display: flex;
	gap: 3rem;
	font-size: 0.8rem;
}
.site-map ul li { margin-bottom: 0.5rem;}
.site-map ul li:first-child { 
	color: #8cc0ea;
	font-weight: bold;
}
.site-map ul li a {
	color: #FFF;
	padding-left: 1rem;
}
.shoproLogo {
	background: #004c89;
	padding: 1.5rem 0 1rem;
	text-align: center;
}
.shoproLogo img { max-width:324px;  width: 20%;}

.pankuzu {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	margin-bottom: 3rem;
	font-size: 0.8rem;
	gap: 0.5rem 1rem;
	color: #a6a6a6;
}
.pankuzu a { 
	text-decoration: underline;
	color: #a6a6a6;
}
.pankuzu li:not(:last-child)::after {
	content: ">";
	margin-left: 1rem;
}



@media (max-width: 1200px){
	.w1200 { max-width: 90%;}
}

@media (min-width: 767px){
	.spOnly { display: none; }
}
@media (max-width: 1200px){
	body { 
		font-size: 14px;
		padding-top: 4rem;
	}
	
	header .header-logo a { width: 76%;}
	header .header-logo img { width: 100%;}
	
	
/*-----------------------menu-----------------------*/	
	.btn {
		margin: 0;
		padding: 0;
		outline: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
		color: inherit;
		vertical-align: middle;
		text-align: inherit;
		font: inherit;
		-webkit-appearance: none;
		appearance: none;
	}
	.btn {
		position: fixed;
		top: 0.8rem;
		right: 1rem;
		z-index: 99;
		width: 30px;
		height: 30px;
		display: block;
	}
	.btn-line {
		display: block;
		position: relative;
		width: 90%;
		margin: 0 auto;
		height: 3px;
		background-color: #FFF;
		transition: .2s;
	}
	.btn-line::before , .btn-line::after {
		content: "";
		position: absolute;
		width: 100%;
		height: 100%;
		background-color: #FFF;
		transition: .5s;
	}
	.btn-line::before {
		transform: translateY(-9px);
	}
	.btn-line::after {
		transform: translateY(9px);
	}
	/***** メニューオープン時 *****/
	.btn-line.open {
		background-color: transparent;
	}
	.btn-line.open::before , .btn-line.open::after {
		content: "";
		background-color: #FFF;
		transition: .2s;
	}
	.btn-line.open::before {
		transform: rotate(45deg);
	}
	.btn-line.open::after {
		transform: rotate(-45deg);
	}
	
	.overray {
		display: block;
		position: absolute;
		top: 0;
		right: -100%;
		width: 100%;
		height: 100vh;
		z-index: -1;
		background: rgba(0,0,0,0.6);
	}
	.overray.open { right: 0;}
	.menu {
		display: flex;
		flex-direction: column;
		position: fixed;
		justify-content: center;
		align-items: center;
		gap: 2rem 0;
		top: 46px;
		right: -100%;
		width: 100%;
		background-color: #0063b2;
		color: #FFF;
		transition: .3s;
		z-index: 98;
		padding: 6rem 0;
	}
	.menu ul { 
		flex-direction: column;
		position: relative;
		width: 50%;
	}
	.menu li { width: 100%;	}
	.menu li:not(:last-child) {
		border-right: none;
		border-bottom: 1px solid #FFF;
	}
	.menu.open {
		position: fixed;
		right: 0;
	}
	.menu li a { 
		text-align: left;
		padding: 2rem 0;
		position: relative;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.menu li a::after {
		content:"\f105";
		font-family: FontAwesome;;
	}
	
	.pankuzu { display: none;}
	
	
	.secFlex { flex-direction: column; }
	.left-content, .right-content { width: 100%;}
	
	.pager { flex-wrap: wrap; gap: 0.5rem;}
	footer .w1200 { flex-direction: column-reverse; }
	.site-map {
		flex-wrap: wrap;
		gap: 1.5rem 2rem;
		margin-bottom: 2rem;
	}
	
	.footer-logo { text-align: center; }
	.footer-logo img {
		display: block;
		width: 60%;
		margin: 0 auto 1rem;
	}
	
}
@media (max-width: 460px){
	.list-box { width: calc(100% / 2 - 0.5rem);}
	.list-img { height: 30%;}
}