@charset "utf-8";

/*---------------------------------------------
デモ用の装飾
---------------------------------------------*/

/* var() 関数 */
:root {

	/* 色1（基本） */
	--s-bg1: #255284;
	--s-clr1: #ffffff;
	/* 色2（濃） */
	--s-bg2: #1a4472;
	--s-clr2: #ffffff;
	/* 色3（薄） */
	--s-bg3: #c5d6e9;
	--s-clr3: #333333;
	/* 色4（とても薄） */
	--s-bg4: #e8ecf1;
	--s-clr4: #333333;

	/* a:link のリンク色 */
	--textlink-link: #0d59b7;
	/* a:visited のリンク色 */
	--textlink-visited: #0d59b7;
	/* a:active のリンク色 */
	--textlink-active: #000000;
	/* a:hoder / a:focus のリンク色 */
	--textlink-hover: #000000;

	/* ボタン（一覧をみる / アンケート送信 / お問い合わせ送信） */
	--btn-background: #255284; /* 色1 */
	--btn-border: none;
	--btn-borderradius: 0;
	--btn-boxshadow: none;
	--btn-color: #ffffff;
	--btn-textdecoration: none;
	/* hover / focus */
	--btn-hover-background: #1a4472; /* 色2 */
	--btn-hover-border: none;
	--btn-hover-borderradius: 0;
	--btn-hover-boxshadow: none;
	--btn-hover-color: #ffffff;
	--btn-hover-textdecoration: underline;

	/* パンくず背景 */
	--pankuzu-background: #e8ecf1; /* 色4 */
	--pankuzu-color: #333333;
	/* 現在地・足あとアイコン */
	--pankuzu-midashi-border: none;
	--pankuzu-midashi-borderradius: 0;
	--pankuzu-midashi-background: #333333;
	--pankuzu-midashi-color: #ffffff;

	/* 大分類見出し背景 */
	--lifetitle-background: #c5d6e9; /* 色3 */
	--lifetitle-color: #333333;

	/* サブサイト共通ヘッダ背景（画像なし） */
	--siteheader-background: #c5d6e9; /* 色3 */
	--siteheader-color: #333333;
	/* サブサイト共通ヘッダ背景（画像あり / スマートフォン表示時） */
	--siteheader-img-background: #255284; /* 色1 */
	--siteheader-img-color: #ffffff;

	/* サブサイト共通フッタ背景 */
	--sitefooter-background: #e8ecf1; /* 色4 */
	--sitefooter-color: #333333;

}
/* var() 関数 ここまで */


/* ヘッダ */
#header {
	font-size: 1.5rem;
}
#header2_box {
	padding: 30px 0px;
}

#he_left {
	top: 30px;
}

.header_nav ul li[class^="h_"] > a,
.header_nav ul li[class^="h_"] > button {
	display: block;
	border: none;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: left center;
	padding: 5px 0px 5px 30px;
	color: var(--textlink-link);
	text-decoration: underline;
}
.header_nav ul li[class^="h_"] > a:hover,
.header_nav ul li[class^="h_"] > button:hover {
	color: var(--textlink-hover);
	text-decoration: none;
}
.header_nav ul li.h_main > a {
	background-image: url("/img/demo-common/icon_h_main.png");
}
.header_nav ul li.h_guide > a {
	background-image: url("/img/demo-common/icon_h_guide.png");
}
.header_nav ul li.h_sitemap > a {
	background-image: url("/img/demo-common/icon_h_sitemap.png");
}
.header_nav ul li.h_lang > a {
	background-image: url("/img/demo-common/icon_h_lang.png");
}
.header_nav ul li.h_support > a,
.header_nav ul li.h_support > button {
	background-image: url("/img/demo-common/icon_h_support.png");
}

.header_nav ul li.h_keep > button {
	border: none;
	border-radius: 20px;
	font-size: 1.5rem;
	line-height: 2rem;
	text-decoration: none;
	padding: 5px 15px;
	background: var(--s-bg1);
	color: var(--s-clr1);
}
.header_nav ul li.h_keep > button:hover,
.header_nav ul li.h_keep > button:focus {
	background: var(--s-bg2);
	color: var(--s-clr2);
}

#cse-search-box,
#open_page_id_box {
	margin-top: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: end;
	    -ms-flex-pack: end;
	        justify-content: flex-end;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
}
#cse-search-box .search_ipt {
	width: 33rem;
}
#top_search_keyword .search_ttl,
#top_search_page_id .search_ttl {
	padding: 10px 20px;
	line-height: 2rem;
}

#submit,
#open_page_id_submit {
	background: #333333;
	color: #ffffff;
}
#submit:hover,
#submit:focus,
#open_page_id_submit:hover,
#open_page_id_submit:focus {
	background: #000000;
	color: #ffffff;
}

#cse_filetype {
	display: none;
}

#top_search {
	background: var(--s-bg1);
	color: var(--s-clr1);
}
.tpl_top_emer #top_search {
	display: none;
}

.gnav ul li a {
	background-color: var(--s-bg1);
	color: var(--s-clr1);
	background-repeat: no-repeat;
	background-position: 40px center;
	margin: -20px 0px;
	padding: 30px 20px 30px 60px;
	-webkit-transition: background-color 0.5s, color 0.5s;
	-o-transition: background-color 0.5s, color 0.5s;
	transition: background-color 0.5s, color 0.5s;
}
.gnav ul li a:hover,
.gnav ul li a:focus {
	background-color: var(--s-bg2);
	color: var(--s-clr2);
	background-repeat: no-repeat;
	background-position: 40px center;
}
.gnav ul li:nth-child(1) a {
	background-image: url("/img/demo-common/gnav_kurashi_white.png");
}
.gnav ul li:nth-child(2) a {
	background-image: url("/img/demo-common/gnav_shigoto_white.png");
}
.gnav ul li:nth-child(3) a {
	background-image: url("/img/demo-common/gnav_kanko_white.png");
}
.gnav ul li:nth-child(4) a {
	background-image: url("/img/demo-common/gnav_shisei_white.png");
}

/* フッタ */
#author_info {
	background-color: var(--s-bg1);
	color: var(--s-clr1);
}
#author_info a {
	color: var(--s-clr1);
}

.tpl_top_emer #author_info {
	background: var(--emer-bg-background, #c1272d);
	color: var(--emer-bg-color, #ffffff);
}
.tpl_top_emer #author_info a {
	color: inherit;
}

#footer_link_pagetop {
	width: 60px;
}

#btn_kaiyu_open,
.kaiyu_list {
	background: var(--s-bg1);
	color: var(--s-clr1);
	border: 1px solid;
}
.kaiyu_list_box2 a {
	height: 60px;
	background-color: var(--s-bg3);
	color: var(--s-clr3);
	text-decoration: none;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	padding: 10px;
}

/* 記事 / 分類 / 組織 */
#hyouka_area_box,
#section_footer,
#kanren_info,
.section_information {
	background-color: var(--s-bg4);
	color: var(--s-clr4);
}

#kanren_link h2,
#osusume_contents_area .second_osusume {
	background-color: var(--s-bg3);
	color: var(--s-clr3);
}
#osusume_contents_area .second_osusume a {
	color: inherit;
}

.common_banner_link a {
	background-color: var(--s-bg1);
	color: var(--s-clr1);
}
.common_banner_link .common_banner_mitsukaranai a span {
	background-image: url("/img/common/icon_mitsukaranai_white.png");
}
.common_banner_link .common_banner_faq a span {
	background-image: url("/img/common/icon_faq_white.png");
}

#sidebar_recommend,
#sidebar_ai_recommend {
	background: #ffffff;
}
#recommend_title,
#ai_recommend_title {
	background: #255284;
	background: -webkit-gradient(linear, left top, right top, from(#255284), to(#3f76b3));
	background: -o-linear-gradient(left, #255284, #3f76b3);
	background: linear-gradient(to right, #255284, #3f76b3);
	color: #ffffff;
	background-color: #255284; /* miChecker対策 */
}
#recommend_title h2 {
	background-image: url("/img/common/icon_recommend_white.png");
}
#ai_recommend_title h2 {
	background-image: url("/img/common/icon_ai_recommend_white.png");
}
#sidebar_recommend ul li,
#sidebar_ai_recommend ul li {
	border-top-color: #1a4472;
}

.side_box_ttl h2,
.subsite_menu_ttl {
	background: #b1cae5;
	background: -webkit-gradient(linear, left top, right top, from(#b1cae5), to(#e8ecf1));
	background: -o-linear-gradient(left, #b1cae5, #e8ecf1);
	background: linear-gradient(to right, #b1cae5, #e8ecf1);
}

.list_lifestage ul li a {
	background-color: var(--s-bg1);
	color: var(--s-clr1);
	background-repeat: no-repeat;
	background-position: center 20px;
}
.list_lifestage ul li.lifestage01 a {
	background-image: url("/img/lifestage/lifestage1.png");
}
.list_lifestage ul li.lifestage02 a {
	background-image: url("/img/lifestage/lifestage2.png");
}
.list_lifestage ul li.lifestage03 a {
	background-image: url("/img/lifestage/lifestage3.png");
}
.list_lifestage ul li.lifestage04 a {
	background-image: url("/img/lifestage/lifestage4.png");
}
.list_lifestage ul li.lifestage05 a {
	background-image: url("/img/lifestage/lifestage5.png");
}
.list_lifestage ul li.lifestage06 a {
	background-image: url("/img/lifestage/lifestage6.png");
}
.list_lifestage ul li.lifestage07 a {
	background-image: url("/img/lifestage/lifestage7.png");
}
.list_lifestage ul li.lifestage08 a {
	background-image: url("/img/lifestage/lifestage8.png");
}

/* 見出し */
#main_header h1 {
	background: #1a4472;
	background: -webkit-gradient(linear, left top, right top, from(#1a4472), to(#3f76b3));
	background: -o-linear-gradient(left, #1a4472, #3f76b3);
	background: linear-gradient(to right, #1a4472, #3f76b3);
	border: none;
	color: #ffffff;
	background-color: #1a4472; /* miChecker対策 */
}

#main_body h2 {
	padding: 19px 30px 19px 20px;
	background: #b1cae5;
	background: -webkit-gradient(linear, left top, right top, from(#b1cae5), to(#e8ecf1));
	background: -o-linear-gradient(left, #b1cae5, #e8ecf1);
	background: linear-gradient(to right, #b1cae5, #e8ecf1);
	border: none;
	border-left: 10px solid #1a4472;
	border-bottom: 3px solid #1a4472;
}
#main_body h2 a {
	color: inherit;
}

#main_body h3,
.kakuka_info_ttl,
.life_cat_list_ttl {
	padding: 14px 27px;
	background: transparent;
	border: 3px solid #1a4472;
}

#main_body h4 {
	padding: 12px 28px 11px;
	background: transparent;
	border: 2px solid #333333;
}

#main_body h5 {
	padding: 9px 30px 9px 25px;
	background: transparent;
	border: none;
	border-left: 5px solid #1a4472;
	border-bottom: 2px solid #1a4472;
}

#main_body h6 {
	padding: 6px 30px;
	background: transparent;
	border: none;
	border-bottom: 1px solid #1a4472;
}

/* ページ内目次 */
.tpl_detail #main_body .toc_link_wrap,
.tpl_site_index #main_body .toc_link_wrap,
.tpl_site_detail #main_body .toc_link_wrap {
	display: block;
}
#main_body .toc_link_wrap summary {
	background: #333333;
	color: #ffffff;
}

/* ボタンの色 */
.section_information_list div.link_box span a,
#hyouka_area_submit input,
.top_search_menu_list ul li a,
#search_trend_word p a,
.top_tab_detail_box .link_box span[class*="link_"] a {
	background: var(--s-bg1);
	color: var(--s-clr1);
}
.section_information_list div.link_box span a:hover,
.section_information_list div.link_box span a:focus,
#hyouka_area_submit input:hover,
#hyouka_area_submit input:focus,
.top_search_menu_list ul li a:hover,
.top_search_menu_list ul li a:focus,
#search_trend_word p a:hover,
#search_trend_word p a:focus,
.top_tab_detail_box .link_box span[class*="link_"] a:hover,
.top_tab_detail_box .link_box span[class*="link_"] a:focus {
	background: var(--s-bg2);
	color: var(--s-clr2);
}

#top_important .link_box span[class*="link_"] a {
	border: 1px solid;
	background: #ffffff;
	color: #333333;
}
#top_important .link_box span[class*="link_"] a:hover,
#top_important .link_box span[class*="link_"] a:focus {
	background: #f6f6f6;
	color: #333333;
}

#main_box_emergency .btn_emer #emer_mail_open_all {
	border: 1px solid;
	background: #ffffff;
	color: #333333;
}
#main_box_emergency .btn_emer #emer_mail_open_all:hover,
#main_box_emergency .btn_emer #emer_mail_open_all:focus {
	background: #f6f6f6;
	color: #333333;
}

#top_tab_title ul li button {
	border: 1px solid #333333;
	border-bottom: none;
}

/* スマートフォン */
@media screen and (max-width: 820px) {

	#header2_box {
		padding: 0px;
	}

	.gnav ul li a {
		margin: 0px;
	}

	#cse-search-box,
	#open_page_id_box {
		display: block;
	}
	#cse-search-box .search_ipt,
	#open_page_id_box .search_ipt {
		width: auto;
	}
	#top_search_keyword .search_ttl,
	#top_search_page_id .search_ttl {
		padding: 0px 0px 10px;
	}

	#footer_link_pagetop {
		width: 40px;
	}

}
/* スマートフォン ここまで */

/*---------------------------------------------
デモ用の装飾 ここまで
---------------------------------------------*/