@charset "utf-8";
/*-------------------
共通class
--------------------------------------------------*/
@import url('https://secure.apap.jp/vc/base/usr/docs/css/common_pad.css');

/*-----------------------------------------------------------------------------
■┓基本設定
┗┛
-----------------------------------------------------------------------------*/
img {
	height: auto;
	max-width: 100%;
}

/*########################################################################################

ヘッダー
header

########################################################################################*/
header {
	margin: 0 auto;
}
/*----------------------------
上部左ロゴ
----------------------------------------------------------*/
.hd_top {
	padding: 16px;
}

/*----------------------------
検索ボックス
----------------------------------------------------------*/
.search_box {
	margin: 12px 0;
	padding: 0 64px 0 16px;
}
.search_bar_fh > div:first-child {
	width: calc(100% - 40px);
}
.search_bar_fh > div > input {
	font-size: 14px;
	font-size: 1.4rem;
	width: 100%;
	height: 40px;
}
.search_bar_fh > div > a {
	font-size: 14px;
	font-size: 1.4rem;
	height: 40px;
	padding: 7px;
}

/*----------------------------
上部右ナビゲーション、ハンバーガーメニュー
----------------------------------------------------------*/
#panel_menu01 {
	position: fixed;
		top: 8px;
		right: 8px;
	z-index: 10000;
}
.panel_menu_btn,
.panel_menu_btn span {
	box-sizing: border-box;
	display: block;
	transition: all .4s;
}
.panel_menu_btn {
	background: #fff;
	border-radius: 50%;
	opacity: 0.8;
	position: relative;
	width: 48px;
	height: 48px;
}
.panel_menu_btn span {
	background-color: #2e2e38;
	border-radius: 3px;
	position: absolute;
		left: 9px;
	width: 60%;
	height: 3px;
}
.panel_menu_btn span:nth-of-type(1) {
		top: 10px;
}
.panel_menu_btn span:nth-of-type(2) {
		top: 17px;
}
.panel_menu_btn span:nth-of-type(3) {
		top: 24px;
}
.panel_menu_btn a:hover {
	opacity: 1;
	text-decoration: none;
}
.panel_menu_btn::after {
	color: #2e2e38;
	content: 'MENU';
	display: block;
	font-size: 10px;
	font-size: 1.0rem;
	position: absolute;
		left: 0;
		bottom: 2px;
	text-align: center;
	text-decoration: none;
	transition: all .4s;
	white-space: nowrap;
	width: 100%;
}
.panel_menu_btn.close:hover::after {
	content: 'CLOSE';
}
.panel_menu_btn.close span:nth-of-type(1) {
	-webkit-transform: translateY(8px) rotate(-45deg);
	transform: translateY(8px) rotate(-45deg);
}
.panel_menu_btn.close span:nth-of-type(2) {
	opacity: 0;
}
.panel_menu_btn.close span:nth-of-type(3) {
	-webkit-transform: translateY(-6px) rotate(45deg);
	transform: translateY(-6px) rotate(45deg);
}
.panel_menu_btn .menu_text {
	color: #2e2e38;
	font-size: 10px;
	font-size: 1.0rem;
	letter-spacing: 0;
	margin-top: 23px;
	text-align: center;
}
.panel_ttl {
	background-color: #2e2e38;
	color: #fff;
	font-weight: bold;
	padding: 4px 16px;
	width: 100%;
}
#panel_contents {
	background: #fff;
	display: none;
	max-height: 100%;
	overflow-y: auto;
	position: fixed;
		top: 0;
	width: 100%;
	z-index: 9999;
}
#panel_contents > ul {
	padding: 8px;
}
#panel_contents > ul a:hover {
	opacity: 0.8;
	text-decoration: none;
}
#panel_contents > ul > li {
	margin-bottom: 5px;
}
#panel_contents > ul > li > a {
	background: #fff;
	border-radius: 4px;
	display: block;
	line-height: 1.2;
	padding: 13px 10px 13px 15px;
}
#panel_contents > ul.sp_nav01 {
	background-color: #fff58f;
}
#panel_contents > ul.sp_nav02 {
	background-color: #efefef;
}
#panel_contents > ul.sp_nav03 {
	background-color: #dcdcdc;
}
#panel_contents > ul > li > a::before {
	background-repeat: no-repeat;
	background-size: contain;
	content: "";
	display: inline-block;
	margin-right: 5px;
	width: 8px;
	height: 10px;
}
#panel_contents > ul.sp_nav01 li a::before {
	background-image: url("../images/arrow_black.svg");
}
#panel_contents > ul.sp_nav02 li a::before {
	background-image: url(../images/arrow_orange.svg);
}
#panel_contents > ul.sp_nav03 li a::before {
	color: #666;
}
.gnavi_en {
	display: none;
}
#header_s #panel_menu01 {
		right: 8px;
}
.hd_nav_s ul li a {
	font-size: 12px;
	font-size: 1.2rem;
	padding-top: 2px;
}

#header_s #panel_menu01 {
		right: 8px;
}

/*----------------------------
グローバルナビゲーション
----------------------------------------------------------*/
.gnavi {
	display: none;
}

/*########################################################################################

トップページ（#main_top）

########################################################################################*/
/*----------------------------
メインナビゲーション
----------------------------------------------------------*/
.main_nav ul li a {
	font-size: 13px;
	font-size: 1.3rem;
	padding: 4px;
	height: 80px;
}
.main_nav ul li.pers a {
	background-position: center 14px;
	background-size: 36px 30px;
}
.main_nav ul li.crems a {
	background-position: center 6px;
	background-size: 42px 40px;
}
.main_nav ul li.me a {
	background-position: center 12px;
	background-size: 36px 32px;
}
.main_nav ul li.kennin a {
	background-position: center 8px;
	background-size: 35px 35px;
}
.main_nav ul li.sheal a {
	background-position: center 4px;
	background-size: 24px 38px;
}
.main_nav ul li.vc a {
	background-position: center 6px;
	background-size: 30px 32px;
}
.main_nav ul li.eshinsei a {
	background-position: center 8px;
	background-size: 42px 30px;
}
.main_nav ul li.telcon_24 a {
	background-position: center 6px;
	background-size: 44px 44px;
}
.main_nav ul li.shikaku_joho a {
	background-position: center 8px;
	background-size: 41px 40px;
}
/*----------------------------
トップページ共通
----------------------------------------------------------*/
#main_top .left_contents,
#main_top .right_contents {
	width: 100%;
}
#main_top .left_contents {
	margin-right: 0;
}
#main_top h2 {
	font-size: 16px;
	font-size: 1.6rem;
}

/*----------------------------
健保からのお知らせ
----------------------------------------------------------*/
article.news {
	margin: 0 auto 40px;
}
article.news .info dl dt {
	font-size: 11px;
	font-size: 1.1rem;
	padding: 14px 0;
	width: 80px;
}
article.news .info dl dd {
	font-size: 13px;
	font-size: 1.3rem;
	padding: 12px 0;
	width: calc(100% - 80px);
}
article.news .info .look a {
	font-size: 11px;
	font-size: 1.1rem;
}

/*html内PDF埋込み表示*/
.container .pdf_wrap {
	height: 100vh;
}

/*----------------------------
こんな時どうする？
----------------------------------------------------------*/
article.solution {
	margin: 0 auto 40px;
}
article.solution ul li {
	height: 72px;
}
article.solution ul li a {
	font-size: 14px;
	font-size: 1.4rem;
	padding: 8px 24px 8px 8px;
}

/*----------------------------
ピックアップコンテンツ
----------------------------------------------------------*/
.pickup {
	margin-bottom: 40px;
}

/*----------------------------
お役立ちコンテンツ
----------------------------------------------------------*/
.useful_info {
	margin-bottom: 48px;
}
.useful_info ul {
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	max-width: 452px;
	margin: 0 auto;
}
.useful_info ul li {
	display: flex;
	margin: 0 8px 16px;
}

/*----------------------------
外部リンク
----------------------------------------------------------*/
.links ul {
	display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
}
.links ul li {
	width: calc(50% - 8px);
}

/*########################################################################################

セカンダリページ 目次
main#main

########################################################################################*/
#main .outline_3column a {
	width: calc(50% - 13px);
}

/*########################################################################################

セカンダリページ 通常版
main#main

########################################################################################*/
.mb64px {
	margin-bottom: 56px !important;
}
/*----------------------------
ページタイトル
----------------------------------------------------------*/
#main h2 {
	font-size: 24px;
	font-size: 2.4rem;
}
#main h3 {
	font-size: 20px;
	font-size: 2.0rem;
}
#main h4 {
	font-size: 18px;
	font-size: 1.8rem;
}
#main h4::before {
	font-size: 16px;
	font-size: 1.6rem;
}

/*----------------------------
ページ本文
----------------------------------------------------------*/
#main .content_section_w {
	padding: 56px 24px;
}
#main .point {
	margin: 32px 0 56px;
}
#main h3 + .point {
	margin: 16px 0 56px;
}
#main h4 + .point {
	margin: 8px 0 56px;
}
#main ul.point02 > li .point_circle > span > span > span {
	font-size: 20px;
	font-size: 2.0rem;
}
.table02 thead {
	display: none;
}
.table02,
.table02 tr,
.table02 th,
.table02 td {
	display: block;
	width: 100%;
}
.table02 th,
.table02 td {
	border-bottom: none;
}
.table02 tr:last-child {
	border-bottom: 1px solid #dcdcdc;
}
.point03 {
	margin: 0;
}
.point03,
.point03 tbody,
.point03 tr,
.point03 th,
.point03 td {
	display: block;
	width:100%;
}
.point03 th {
	border-bottom: 1px dotted #2e2e38;
	white-space: normal;
}
.point03 td {
	padding: 8px 16px;
}
.point03 tr:not(:last-of-type) td {
	margin-bottom: 16px;
}
.point03 + p {
	margin-top: 1em;
}
.point_photo img {
	max-height: 100%;
	width: auto;
}
.side_photo {
		flex-wrap: wrap;
		justify-content: center;
}
.point_photo {
	margin: 24px 0 0;
}
.content_section_w > .point_photo {
	margin: 0;
}

/*-----------------------------------------------------------------------------
■┓健康のしくみ（guide.jsp）
┗┛Health Insurance System
-----------------------------------------------------------------------------*/
/*----------------------------
保険料と標準報酬月額（guide_04.jsp）
----------------------------------------------------------*/
#ippanhokenryo {
	flex-wrap: wrap;
}
#ippanhokenryo >div {
	text-align: center;
	width: 100%;
}
#ippanhokenryo > div:first-child {
	padding-top: 24px;
	white-space: nowrap;
}
#ippanhokenryo >div:nth-child(2) {
	transform: rotate(90deg);
}

/*----------------------------
保険証としてのマイナンバーカード利用（guide_12.jsp）
----------------------------------------------------------*/
/* 外部リンク */
#main .side_photo + ul.externallink_wrap {
	margin-top: 40px;
}
/* マイナンバーお問い合わせ */
#main .mynum_contact_free > div {
	width: 100%;
}
#main .mynum_contact_free > div:first-of-type {
	flex: 0 1 auto;
}
#main .mynum_contact_free .mynum_contact_tel a {
	font-size: 26px;
	font-size: 2.6rem;
	letter-spacing: .2em;
}
#main .mynum_contact_free .mynum_contact_tel a .tel_memo {
	letter-spacing: .5em;
}

/*-----------------------------------------------------------------------------
■┓各種手続き（situation.jsp）
┗┛Procedures
-----------------------------------------------------------------------------*/
/* 手続き */
#main .procedure_box {
	padding: 24px;
	position: relative;
}
#main .procedure_box .procedure_ttl {
	width: 110px;
	height: 110px;
}
#main .procedure_box .procedure_ttl::before {
	width: 110px;
	height: 110px;
}
#main .procedure_box .procedure_ttl::after {
	width: 85px;
	height: 85px;
}
#main .procedure_box .procedure_contents {
	position: absolute;
		top: -32px;
		left: -8px;
}
#main .required_box p:first-child {
	margin-left: 96px;
}
#main .required_box  > .required_ttl:first-child {
	margin-left: 84px;
}
#main .required_box .required_contents {
	padding: 16px 0 0;
}
/*----------------------------
医療費が高額になったとき（situation_02.jsp）
----------------------------------------------------------*/
/* 高額療養費の計算例 */
#main .high_expenses_ex .fig_arer {
	padding-bottom: 24px;
}
#main .high_expenses_fig .breakdown_1 > div:nth-of-type(5) {
	display: none;
}
#main .high_expenses_fig .breakdown_1 > div:nth-of-type(6) {
	width: 70%;
	margin-left: auto;
}
#main .high_expenses_fig .breakdown_2 {
	background: #fafcff;
	border: 1px solid #adc7d9;
	border-radius: 8px;
	padding: 12px;
}

/*----------------------------
出産したとき（situation_11.jsp）
----------------------------------------------------------*/
#main .required_box.conditions_box .conditions .required_contents {
	padding: 8px 8px 0 0;
}

/*----------------------------
亡くなったとき（situation_13.jsp）
----------------------------------------------------------*/
/* 手続き内 */
#main .case_death {
		flex-direction: column;
}
#main .case_death > div:nth-of-type(2) {
	padding-left: 1em;
}

/*-----------------------------------------------------------------------------
■┓各種申請書（application.jsp）
┗┛Application Forms
-----------------------------------------------------------------------------*/
#main .tbl_application_doc {
	margin-bottom: 1em;
}
#main .tbl_application_doc thead td:last-child,
#main .tbl_application_doc tbody td.appli_add {
	display: none;
}
.appli_add_padsp {
	display: flex;
	margin-bottom: .5em;
	background: #fff;
}
div:last-child.appli_add_padsp {
	margin-bottom: 3em;
}
.appli_add_padsp > div {
	display: flex;
		align-items: center;
	padding: 8px;
}
.appli_add_padsp > div:nth-of-type(1) {
	background: #2e2e38;
	color: #fff;
	padding: 4px 12px;
	text-align: center;
	white-space: nowrap;
	min-width: 136px;
}
.appli_add_padsp > div:nth-of-type(2) > div {
	line-height: 1.5;
}

/*-----------------------------------------------------------------------------
■┓保健事業（health.jsp）
┗┛Health Activities
-----------------------------------------------------------------------------*/
/*----------------------------
健康診断（checkup.jsp）
----------------------------------------------------------*/
ol.method > li > ul {
		flex-flow: column;
}
ol.method > li > ul >li {
	margin-bottom: 24px;
	width: 100%;
}
ol.method > li > ul.reservation_list > li {
	width: 100%;
}

/*----------------------------
その他保健事業（healthother.jsp）
----------------------------------------------------------*/
/* テーブル内のテーブル */
.tbl_tbl thead {
	display: none;
}
.tbl_tbl tr:last-of-type td:last-child {
	border-bottom: 1px solid #badbbd;
}
.point03 tr .tbl_tbl tr td {
	margin-bottom: 0;
}
.tbl_tbl th,
.tbl_tbl td {
	border-bottom: none;
}
.tbl_tbl td.type {
	background: #ecf6ed;
	color: #333;
}
.tbl_tbl td.price span {
	display: inline-block;
}

/*-----------------------------------------------------------------------------
■┓よくある質問（faq.jsp）
┗┛
-----------------------------------------------------------------------------*/
#main .faq_nav a {
	font-size: 12px;
	font-size: 1.2rem;
	width: calc(100% / 3 - 16px);
}

/*-----------------------------------------------------------------------------
■┓お知らせ（infoKenpoList.jsp）
┗┛
-----------------------------------------------------------------------------*/
#main h3.news_ttl_wrap {
	margin: 0 auto;
	width: 80%;
}
#main ul.years li {
	margin: 0 4px 8px;
	width: calc(20% - 8px);
}
#main .years_btn {
	width: 100%;
}

/*-----------------------------------------------------------------------------
■┓健保ハンドブック（handbook.jsp）
┗┛
-----------------------------------------------------------------------------*/
#guidebook {
	width: 100%;
}
#guidebook #gbl_wrap, #guidebook #gbr_wrap {
	width: calc(50% - 16px);
}

/*-----------------------------------------------------------------------------
■┓上手なお医者さんのかかり方（doctor.jsp）
┗┛
-----------------------------------------------------------------------------*/
#main ol.docter li {
	display: flex;
		flex-direction: column;
	padding: 16px 16px 16px 56px;
}
#main ol.docter li .docter_ttl {
	padding-top: 4px;
	width: 100%;
	min-width: 0;
}
#main ol.docter li .docter_contents {
	border-left: 0;
	padding: 8px 0 0;
}

/*-----------------------------------------------------------------------------
■┓リンク（link.jsp）
┗┛
-----------------------------------------------------------------------------*/
#main a.link_area {
	padding: 24px 16px;
}
#main a.link_area.link_first {
	margin-top: -16px;
}
#main a.link_area .link_ttl {
		align-items: flex-start;
		flex-direction: column;
}
#main a.link_area .link_ttl .link_page_name {
	margin: 0 0 4px 0;
}
#main a.link_area .link_ttl .link_page_url {
	padding-left: 24px;
}

/*-----------------------------------------------------------------------------
■┓サイトマップ（sitemap.jsp）
┗┛
-----------------------------------------------------------------------------*/
#main .wrap_sitemap {
		flex-direction: column;
}
#main .wrap_sitemap > div {
	width: 100%;
}

/*########################################################################################

フッター
#footer

########################################################################################*/
/*----------------------------
フッターメイン
----------------------------------------------------------*/
@media screen and (max-width:950px) {
	#footer footer {
	margin: 40px 16px 0;
	}
}
#footer .kenpo_name {
	margin: 0 1em 16px 0;
}
/*-----------------------------------------------------------------------------
■┓お問い合わせフォーム
┗┛
-----------------------------------------------------------------------------*/
.tel_width input[type="text"],
.email_width input[type="text"] {
	width: 100%;
}
/* arrow */
.arrow > tbody >tr > th {
	white-space: normal;
}

