@charset 'UTF-8';
/* -----------------------------------------------------------
   共通
-------------------------------------------------------------- */

.half-right {
	width: 750px;
	margin: 0 ;
	flex-shrink: 0;
}
.half-left {
	width: 320px;
	transition: .3s;
	margin: 0 auto 0 0;
}
.search-area.search-fix {
	position: fixed;
	top: 0;
	height: 100vh;
}

@media screen and (max-width: 768px) {
	.half-right {
		width: 100%;
		margin: 0 auto 0;
	}
	.half-left {
		width: 100%;
	}
}

@media screen and (max-width: 340px) {

}


/* -----------------------------------------------------------
    下層の検索エリア共通 
-------------------------------------------------------------- */
.search-opacity {
	opacity: 0;
}

.search-inner {
	background: #eef4ff;
	width: 320px;
	border-radius: 5px;
	overflow: hidden;
	transition: .5s all;
}
/*
.search-scroll {
	overflow-y: scroll;
	/*max-height: calc( 100vh - 50px );*/
	/*IE(Internet Explorer)・Microsoft Edgeへの対応*/
	/*-ms-overflow-style: none;*/
	/*Firefoxへの対応*/
/*	scrollbar-width: none;
}

.search-scroll::-webkit-scrollbar{
  /*display: none;*/
/*}
.search-scroll::-webkit-scrollbar{
   width: 3.5px;
}
.search-scroll::-webkit-scrollbar-track{
   background-color: #fff5cc;
}
.search-scroll::-webkit-scrollbar-thumb{
  background-color: #ede1a7;
	border-radius: 20px;
}
.search-inner.search-fix {
	position: fixed;
	top:100px;
	height: calc( 100vh - 100px );
	transition: .5s all;
}*/

.search-block {
	padding: 30px 15px 30px 15px;
}

.glossary-search-inner > div{
	margin: 0 0 30px;
}

.glossary-row-list .list-title,
.glossary-cate-list .list-title{
	background: #2589d0;
	color: #fff;
	font-weight: bold;
	padding: 10px 10px;
	border-radius: 5px;
}

.glossary-row-list li,
.glossary-cate-list li{
	font-size: 1.6rem;
	font-weight: bold;
	border-bottom: solid 1px #d1d1d1;
	position: relative;
}

.glossary-row-list li a,
.glossary-cate-list li a{
	position: relative;
    width: 100%;
    display: block;
    height: 100%;
    padding: 12px 0 10px 20px;
}

.glossary-row-list li a:hover,
.glossary-cate-list li a:hover{
	color: #2589d0;
}

.glossary-row-list li::before,
.glossary-cate-list li::before{
	content: "\f105";
    font-family: "Font Awesome 6 Free";
    position: absolute;
    left: 0;
    font-size: 1.6rem;
    top: 11px;
    transition: 0.5s;
	color: #2589d0;
}

@media screen and (min-width: 769px) {
	.search-block {
		display: block!important;
	}
}

@media screen and (max-width: 768px) {
	.search-area {
		padding: 15px;
	}
}


.search-keyword input {
	appearance: none;
	border: 2px solid #2589d0 ;
	border-radius: 3px;
	font-weight: 500;
	font-size: 1.4rem;
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック", YuGothic, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	width: 100%;
	padding: 15px 10px;
	height: 100%;
	margin: 5px 0 0;
}
.search-keyword input:focus {
	outline: none;
	background: #fff;
}
.search-keyword .keyword-ttl {
	font-weight: bold;
}
.search-keyword input.input-area{
	width: 75%;
}
.search-keyword input.submit-area{
	width: 22%;
	background: #2589d0 ;
	color: #fff;
	cursor: pointer;
	transition: .3s all;
}
.search-keyword input.submit-area:hover{
	opacity: .8;
}

@media screen and (max-width: 768px) {	
	.search-inner.search-fix {
		position: static;
		height: auto;
	}
	
	.search-inner {
		border-radius: 0;
		width: 100%;
	}

	.search-block {
		/*display: none;*/
		padding: 20px 15px;
	}
	
	.search-scroll {
		height: auto;
		max-height: unset;
	}
	.search-keyword {
		margin: 0 0 0 0;
	}
	.search-keyword input {
		width: 100%;
		margin: 5px 0 0;
		padding: 15px 10px;
	}

}

@media screen and (max-width: 340px) {	
	.search-block{
		padding: 0 12px;
	}
}

.detail-area .search-keyword{
	display: none;
}


