@charset "utf-8";
/* ======================================================

	structure CSS

========================================================= */
.container{
	width:100%;
}

.header{
	width:100%;
}

.headerArea{
	margin:0 auto;
	width:100%;
}

.contents_top {
	width: 1000px;
	margin: 0 auto;
}

.contents{
	margin:0 auto 10px;
	width:1000px;
}

.main{
}

#footer{
	width:100%;
}


.copyright{
	width:100%;
}

/* clear */
.headerArea:after,
.contents:after,
.footerArea:after{
	content:".";
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	font-size:0;
}


@media screen and (max-width: 768px) {
	.container{
		min-width:100%;
	}

	.header{}
		
	.headerArea{
		width:100%;
		height:auto;
	}

	.contents, .contents_top {
		padding: 0 3% 20px;
		width:100%;
	}
	.contents_top {
		padding-top: 20px;
	}

	.footerArea{
		width:100%;
	}

}
@media screen and (max-width: 768px) {
	.contents{
		margin:0 auto 0;
		}
}


/* ======================================================

	body

========================================================= */
body {
	color:#333;
	font-size:20px;
	font-size: 2rem;
	line-height:1.5em;
	background: #fff;
}

.container{}

@media screen and (max-width: 768px) {
	body{
		font-size:16px;
		font-size: 1.6rem;
	}
}



/* ======================================================

	header

========================================================= */
.header{
	width: 100%;
	height: auto;
	position: relative;
	z-index: 99;
}

.headerArea {
}

.headerArea .mv {
	position: relative;
	background: url("images/mv_top_bg.jpg") #D0ECFA top center;
	background-size: cover;
}
.headerArea.sub .mv {
	position: relative;
	background: url("images/mv_sub_bg.jpg") #D0ECFA top center;
	background-size: cover;
}

.headerArea.sub .mv h1 {
	padding-top: 10px;
}
.headerArea .mv h1 {
	position: relative;
	width: 1000px;
	margin: 0 auto;
	padding-top: 50px;
	bottom: -5px;
}
.headerArea.sub .mv h1 {
	bottom: 0;
}
.sub_cat_ttl {
	background: #F1B03E;
	margin-top: 5px;
}
.sub_cat_ttl h2 {
	width: 1000px;
	margin: 0 auto;
	color: #fff;
	font-family: 'Kosugi Maru', sans-serif;
	font-size: 40px; font-size: 4rem;
	font-weight: normal;
	line-height: 1.2em;
	letter-spacing: .2em;
	padding: 10px 0;
}
.sub_cat_ttl.about {background: #FBA40E;}
.sub_cat_ttl.info {background: #8FC31F;}
.sub_cat_ttl.sign {background: #5980C1; letter-spacing: .1em;}

/* clear */
.headerArea::after, .sp_gnavArea::after{
	content:" ";
	display:block;
	clear:both;
	font-size:0;}

@media screen and (max-width:768px){
	.headerArea, .sub_cat_ttl h2 { width: 100%;}
	
	.headerArea .mv h1, .headerArea.sub .mv h1 {
		width:96%;
		height:auto;
		margin: 0 auto;
		padding-top: 60px;
	}
	.h_logo, .sub_cat_ttl h2 {
		padding-left: 3%;
		font-size: 3rem;
	}
	.h_logo img {
		height: auto;
		width: 200px;
	}
	.headerArea .mv img {
		width: 100%;
		height: auto;
	}

}

@media screen and (max-width: 599px) {
	.headerArea .mv h1, .headerArea.sub .mv h1{
		padding-top: 50px;
	}
	.headerArea .mv h1 {
		bottom: -1px;
	}
	.sub_cat_ttl h2 {
		font-size: 6vw;
		letter-spacing: .1em;
	}
}


/* ======================================================

	gnav

========================================================= */
.gnav ul{
	position: relative;
	width: 1000px;
	margin:25px auto 0;
	font-size: 0;
}

/* clear */
.gnav ul::after{
	content:".";
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	font-size:0;
}

.gnav li {
	float: left;
	text-align: center;
	margin: 0 1% 0 0;
	width: 13.4%;
}
.gnav li span {
	font-size: 1.6rem;
	line-height: 1.7em;
	display: block;
	border-bottom: 3px solid #606060;
}
.gnav li:last-child{
	margin-right: 0;
}
.gnav li span:hover {
	border-bottom: 3px solid #2F8BE0;
	font-weight: bold;
}
.gnav li a {
	color: #606060;
	text-decoration: none;
	display: block;
}

/* ドロップメニュー */
.gnav > li.d_menu {
	position: relative;
}

li.d_menu ul.d_menu_li {
	position: absolute;
	z-index: 0;
	top: -30px;
	width: 13.4%;
	background: rgba(255,255,255,.50);
	opacity: 0;
	-webkit-transition: all .2s ease;
	transition: all .2s ease;
}

li.d_menu:hover ul.d_menu_li {
	z-index: 99999;
	top: 5px;
	visibility: visible;
	opacity: 1;
}
li.d_menu ul.d_menu_li li {
	position: relative;
	margin: 0;
	width: 100%;
	border-bottom: 3px solid #D6D6D6;
	background: rgba(255,255,255,.50);
}
li.d_menu ul.d_menu_li li a {
	font-size: 1.4rem;
	padding: 10px 0 5px;
	color: #000;
}
li.d_menu ul.d_menu_li li:hover {
	font-weight: bold;
	border-bottom: 3px solid #2F8BE0;
}
.sp_btn {
	display: none;
}
.sp_nav {
	display: none;
}

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

	.sp_gnavArea_w {
		position: fixed;
		z-index: 9999;
		width: 100%;
	}
	.sp_gnavArea{
		background-color: rgba(241, 176, 62, .80);
		padding: 7px 0;
	}

	.sp_gnav_btn{
		width:auto;
		padding:5px 5px;
		text-align:right;}

	.sp_gnav {
		display:none;
		z-index:100;
		margin-bottom:0;
		background-color: rgba(255,255,255,.97);}

	.sp_gnav li{
		position:relative;
		font-size:1.4rem;
		line-height: 2em;
	}
	.sp_gnav li a {
		display:block;
		padding: 10px 7px;
		border-bottom:1px dotted #F19550;
		color:#333;
		text-decoration:none;}
	.sp_gnav li a::before {
		content: "> ";
		font-size: 2vw;
		color: #F19550;
		padding-right: 3px;
	}

	.sp_gnav li a:hover{
		opacity:0.7;}
	
	/*sp_btn*/
	.sp_btn {
		position: absolute;
		display: block;
		width: 30px;
		height: 30px;
		top: 10px;
		right: 10px;
		cursor: pointer;
		z-index: 1002;
	}
	.sp_btn div {
		position: relative;
	}
	.sp_btn span {
		display: block;
		position: absolute;
		height: 4px;
		width: 100%;
		background: #fff;
		left: 0;
	}
	.sp_btn span:nth-child(1) {
		top: 0;
	}
	.sp_btn span:nth-child(2) {
		top: 11px;
	}
	.sp_btn span:nth-child(3) {
		top: 22px;
	}

	.sp_btn.open span:nth-child(1) {
		top: 11px;
		-webkit-transform: rotate(315deg);
		-moz-transform: rotate(315deg);
		transform: rotate(315deg);
		-webkit-transition: all 0.3s ease-out;;
		-moz-transition: all 0.3s ease-out;;
		-ms-transition: all 0.3s ease-out;;
		-o-transition: all 0.3s ease-out;;
		transition: all 0.3s ease-out;;}

	.sp_btn.open span:nth-child(2) {
		width: 0;
		left: 50%;
	}
	.sp_btn.open span:nth-child(3) {
		top: 11px;
		-webkit-transform: rotate(-315deg);
		-moz-transform: rotate(-315deg);
		transform: rotate(-315deg);
		-webkit-transition: all 0.3s ease-out;;
		-moz-transition: all 0.3s ease-out;;
		-ms-transition: all 0.3s ease-out;;
		-o-transition: all 0.3s ease-out;;
		transition: all 0.3s ease-out;;}

}
@media screen and (max-width:420px){
	.sp_gnav li{
		position:relative;
		font-size:3.2vw;
		line-height: 2em;
	}
}


/* ======================================================

	contents

========================================================= */

/* ======================================================

	main

========================================================= */
.top_lead {
	text-align: center;
	color: #5980c1;
	font-family: 'Kosugi Maru', sans-serif;
	font-weight: normal;
	font-size: 36px; font-size: 3.6rem;
	line-height: 1.6em;
	padding: 30px 0 50px;
}
.top_lead span {
	font-size: 46px; font-size: 4.6rem;
	font-weight: bold;
}

.cat_ttl {
	border-bottom: 2px dashed #8FC31F;
	text-align: center;
	padding-bottom: 10px;
	margin-bottom: 15px;
}
.cat_li li {
	float: left;
	width: 24.2%;
	margin-right: 1%;
}
.cat_li.sub li {
	width: 15.8%;
} 
.cat_li.sub li:nth-child(4n) {
	margin-right: 1%;
}
.cat_li li:nth-child(4n), .cat_li.sub li:nth-child(6n) {
	margin-right: 0;
}
.cat_li li a {
	color: #fff;
	text-decoration: none;
	text-align: center;
	background: #F1B03E;
	padding: 15px;
	margin-bottom: 10px;
	display: block;
	font-size: 24px;
	font-family: 'Kosugi Maru', sans-serif;
	font-weight: 500;
	border-radius: 10px;
}
.cat_li li a:hover {
	background: #8FC31F;
}
#___gcse_0 {
	width: 70%;
	margin: 0 auto;
}
.cse .gsc-control-wrapper-cse, .gsc-control-wrapper-cse {
	border: 1px solid #ccc;
	border-radius: 25px;
}
.gsc-input-box { border: none!important; background: none!important;}

.cse .gsc-search-button-v2, .gsc-search-button-v2 {
	border: none!important;
	background: none!important;
	padding: 6px 20px 0 10px!important;
}
.gsc-search-button-v2 svg {
	fill: #75D2F0!important;
	width: 30px!important;
	height: 30px!important;
}

.btn_li {
	margin: 50px 0 40px;
}
.btn_li li:first-child {
	float: left;
}
.btn_li li:last-child {
	float: right;
}
.btn_li.sub {
	text-align: center;
}
.btn_li.sub li {
	float: none!important;
}

.top_history {
	max-height: 120px;
	overflow-y: scroll;
	font-size: 1.6rem;
	padding: 20px;
	background: rgba(255,255,255,.7);
}
.top_history dt {
	clear: both;
	float: left;
	width: 100px;
}
.top_history dd {
	padding-left: 120px;
	padding-bottom: 5px;
	margin-bottom: 10px;
	border-bottom: 1px dotted #ccc;
}

.news_box {
	border-radius: 10px;
	border: 2px solid #fff;
	background: #F4BD6D;
	padding: 12px 20px;
	margin: 40px 0 0;
	font-size: 1.6rem;
	line-height: 1.7em;
}

.innner {
	width: 94%;
	margin: 0 auto;
}

.f_txt {
	font-size: 14px; font-size: 1.4rem;
	line-height: 1.5em;
	text-align: center;
	margin: 50px 0 15px;
}

@media screen and (max-width:768px){
	.top_lead {
		font-size: 4vw;
		margin-bottom: 20px;
	}
	.top_lead span {
		font-size: 5vw;
	}
	.cat_li li a {
		font-size: 2.4vw;
		padding: 15px 5px;
	}
	.btn_li li {
		width: 49%;
		margin: 0 auto;
	}
	.btn_li img {
		width: 100%;
		height: auto;
	}
	
	.innner { width: 100%;}

}
@media screen and (max-width:599px){
	.top_lead {
		font-size: 4.5vw;
		padding: 15px 0;
	}
	.top_history {
		padding: 10px;
	}
	#___gcse_0 {
		width: 100%;
	}
	.cat_ttl {
		padding-bottom: 5px;
	}
	.cat_ttl img {
		width: 170px;
		height: auto;
	}
	.cat_li li {
		width: 49%;
		margin-right: 2%;
	}
	.cat_li.sub li, .cat_li.sub li:nth-child(2n) {
		width: 31.8%;
		margin-right: 2%;
	}
	.cat_li li:nth-child(2n) {
		margin-right: 0;
	}
	.cat_li.sub li:nth-child(3n) {
		margin-right: 0;
	}
	.cat_li li a {
		font-size: 5.2vw;
		padding: 10px;
	}
	.btn_li {
		margin: 20px 0 20px;
	}
	.btn_li li {
		margin-top: 10px;
		width: 100%;
		float: none!important;
	}
	.cat_li.sub li a {
		font-size: 16px;
		line-height: 1.5em;
	}
	.f_txt {
		font-size: 1.2rem;
		margin: 30px 0 0;
	}
}
@media screen and (max-width:420px){
	.cat_li.sub li a {
		font-size: 4.5vw;
		line-height: 1.5em;
		padding: 5px;
	}
}

.anchor {
	padding-top: 20px;
	margin-top: -20px;
}

@media screen and (max-width:768px){
	.anchor {
		padding-top: 60px;
		margin-top: -60px;
	}
}



/* ======================================================

	footer

========================================================= */
#footer{
	clear: both;
	background: #BAE8F7;
}
#footer a {
	color: #444;
}

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


}


/* ==============================================

	copyright

================================================= */
.copyright{
	clear:both;
	padding: 10px;
	font-size:14px;
	/*font-size:1.4rem;*/
	text-align:center;
}


@media screen and (max-width: 599px) {
	.copyright{
		padding: 10px 5px 8px;
		font-size: 2.8vw;
		line-height: 1.4em;
	}
}

/* =======================================

	#pageTop

========================================== */
#pageTop{
	position:fixed;
	right:30px;
	bottom:20px;
	z-index: 100;
	padding:18px 22px 17px 22px;
	-moz-border-radius:7px ;
	-webkit-border-radius:7px ;
	border-radius:7px ;
	background-color: #8FC31F;
}
#pageTop:link, #pageTop:visited {
	color: #fff;
	font-size: 20px;
	font-size: 2.0rem;
	text-decoration: none;
}
#pageTop:hover{
	opacity:0.7;
}

@media screen and (max-width: 768px) {
	#pageTop {
		bottom:10px;
		right:10px;
		padding:15px 15px 12px 15px;
	}
}

.dnone { display: none;}

/* =======================================

	subpage

========================================== */
/*カテゴリーページ*/
.cat_txt {
	margin: 25px 0 70px;
}
.cat_txt dl {
	position: relative;
	margin-bottom: 30px;
}

.cat_txt dt {
	position: relative;
	margin-bottom: 5px;
	background: #DEE6F3;
	padding: 7px 10px 7px 120px;
	font-weight: 700;
	font-size: 2.0rem;
	line-height: 1.5em;
}
.cat_txt dt::before {
	position: absolute;
	top: 0;
	left: 0;
	content: "あるある";
	color: #fff;
	font-size: 18px;
	font-weight: normal;
	padding: 7px 0;
	background: #5980C1;
	width: 100px;
	text-align: center;
}
.cat_txt dd {
	position: relative;
	background: #FBE0E0;
	padding: 7px 10px 7px 120px;
	font-size: 1.8rem;
	line-height: 1.5em;
}
.cat_txt dd::before {
	position: absolute;
	top: 0;
	left: 0;
	content: "対応など";
	color: #fff;
	font-size: 18px;
	padding: 7px 0;
	background: #EB6363;
	width: 100px;
	text-align: center;
}
h3.cat_h3 {
	position: relative;
	padding: 10px 10px 2px 10px;
	margin: 15px 0;
	border-bottom: 2px dashed #8FC31F;
	color: #8FC31F;
	font-family: 'Kosugi Maru', sans-serif;
	font-weight: normal;
	font-size: 24px;
	line-height: 1.5em;
}

@media screen and (max-width: 599px) {
	.cat_txt dt {
		margin-bottom: 3px;
		padding: 5px 2%;
		font-size: 4.2vw;
		line-height: 1.5em;
	}
	.cat_txt dd {
		padding: 5px 2%;
		font-size: 3.8vw;
		line-height: 1.5em;
	}
	.cat_txt dt::before, .cat_txt dd::before {
		position: relative;
		top: -5px;
		left: -2%;
		display: block;
		width: 104%;
		font-size: 3.8vw;
		line-height: 1.5em;
		padding: 3px 0;
	}
	h3.cat_h3 {
		padding-top: 0;
		margin-top: 0;
		font-size: 5.2vw;
		line-height: 1.5em;
	}
}

/*お役立ち情報*/ /*サイン*/
.info_txt, .sign_txt { margin-bottom: 80px;}
.info_txt h3 {
	position: relative;
	padding: 10px 10px 2px 80px;
	margin: 15px 0;
	border-bottom: 2px dashed #5980C1;
	color: #5980C1;
	font-family: 'Kosugi Maru', sans-serif;
	font-weight: normal;
	font-size: 36px;
	line-height: 1.5em;
}
.info_txt h3::before {
	content:"";
	width: 70px;
	height: 57px;
	background: url("images/info_icon01.png") no-repeat;
	position: absolute;
	left: 0;
	bottom: 5px;
}
.info_txt h3.info02::before { background: url("images/info_icon02.png") no-repeat;}
.info_txt h3.info03::before { background: url("images/info_icon03.png") no-repeat;}
.info_txt h3.info04::before { background: url("images/info_icon04.png") no-repeat;}
.info_txt h3.info05::before { background: url("images/info_icon05.png") no-repeat;}
.info_txt h3.info06::before { background: url("images/info_icon06.png") no-repeat;}
.info_txt h3.info07::before { background: url("images/info_icon07.png") no-repeat;}
.info_txt h3.info08::before { background: url("images/info_icon08.png") no-repeat;}

.info_txt article p, .info_txt article dl, .sign_txt article p {
	padding-left: 10px;
}
.info_txt article, .sign_txt article {
	margin-bottom: 50px;
	position: relative;
}

.info_txt article dl {
	background: #CFE6A0;
	margin-top: 15px;
	padding: 10px 20px;
}
.info_txt article dl dt {
	font-weight: bold;
	margin-bottom: 5px;
}

.sign_txt h3 {
	position: relative;
	padding: 10px 10px 2px 80px;
	margin: 15px 0;
	border-bottom: 2px dashed #FBA40E;
	color: #FBA40E;
	font-family: 'Kosugi Maru', sans-serif;
	font-weight: normal;
	font-size: 32px;
	line-height: 1.5em;
}
.sign_txt h3::before {
	content:"";
	width: 70px;
	height: 57px;
	background: url("images/sign_icon01.png") no-repeat;
	position: absolute;
	left: 0;
	bottom: 5px;
}
.sign_txt h3.sign02::before { background: url("images/sign_icon02.png") no-repeat;}

.sign_li_box {
	position: relative;
	border: 1px solid #BAE8F7;
	padding-bottom: 25px;
	margin-top: 25px;
}
.sign_li {
	margin-top: 20px;
	position: relative;
}
.sign_li span {
	position: relative;
	display: block;
	width: 97%;
	border-bottom: 6px double #BAE8F7;
	padding: 7px 10px 5px;
	margin-bottom: 10px;
	font-family: 'Kosugi Maru', sans-serif;
	color: #5980C1;
	font-size: 1.3em;
}
.sign_li li {
	position: relative;
	margin: 15px 0 20px 1.8em;
}

@media screen and (max-width: 768px) {
	.sign_txt h3, .info_txt h3 {
		font-size: 24px;
		padding-left: 60px;
	}
	.sign_txt h3::before, .sign_txt h3.sign02::before, .info_txt h3::before {
		width: 50px;
		height: 40px;
		background-size: contain!important;
	}
}
@media screen and (max-width: 599px) {
	.info_txt, .sign_txt { margin-bottom: 50px;}
	.info_txt h3, .sign_txt h3 {
		padding: 5px 10px 2px 40px;
		margin: 15px 0;
		font-size: 5.5vw;
		line-height: 1.5em;

	}
	.info_txt h3::before {
		content:"";
		width: 32px;
		height: 28px;
		background: url("images/info_icon01.png") no-repeat;
		background-size: contain!important;
		bottom: 2px;
	}
	.sign_txt h3::before {
		content:"";
		width: 32px;
		height: 28px;
		background: url("images/sign_icon01.png") no-repeat;
		background-size: contain!important;
		bottom: 2px;
	}
	.sign_txt h3.sign02::before {
		width: 32px;
		height: 28px;
		bottom: 2px;
	}
	.info_txt article p, .sign_txt article p{
		padding-left: 0;
	}
	.info_txt article, .sign_txt article {
		margin-bottom: 35px;
	}
	.sign_li_box .list_number01 {
		margin-left: 10px;
	}
}