@charset "UTF-8";

/* top画面用CSS
    **************************************************
	各商品単位色コード
	--------------------------------------------------
	各商品単位色 |    code			|		RGB
	--------------------------------------------------
	基礎単位：	 |	 #009B74		|	0 155 116　
	--------------------------------------------------
	自動車：   	 |	 #143278    	|	20 50 120
	--------------------------------------------------
	火災：		 |	 #A73279		|	167 50 121
	--------------------------------------------------
	傷害疾病：	 |   #B49632		|	180 150 50
	--------------------------------------------------
	DL：	     |   #EB6526		|	235 101 38
	--------------------------------------------------

	1750以上：PC　通常
	1750未満：PC　大
	1600未満：PC 中
	1350未満：PC 小
	950未満：スマホ横
	500未満：スマホ縦
*/

/* **********************************title**********************************/

@media screen and (min-width: 950px) {

	/* タイトル */
	#tittle {
		position: absolute;
		top: 37%;
		left: 50%;
		transform: translate(-50%, -50%);
		color: #000000;
		background-color: rgba(255, 255, 255, 0.9);
		padding: 10px;
		border-radius: 20px;
		font-size: 40px;
		font-weight: bold;
		line-height: 1;
		min-width: 770px;
	}

	#sab_tittle {
		color: #000000;
		font-size: 28px;
	}

	/****** PC big ******/
	@media screen and (max-width: 1750px) {

		/* タイトル */
		#tittle {
			position: absolute;
			top: 37%;
			left: 50%;
			transform: translate(-50%, -50%);
			color: #000000;
			background-color: rgba(255, 255, 255, 0.9);
			padding: 9px;
			border-radius: 18px;
			font-size: 36.5px;
			font-weight: bold;
			line-height: 1;
			min-width: 703px;
		}

		#sab_tittle {
			color: #000000;
			font-size: 25.5px;
		}
	}

	/****** PC middle ******/
	@media screen and (max-width: 1600px) {

		/* タイトル */
		#tittle {
			position: absolute;
			top: 38%;
			left: 50%;
			transform: translate(-50%, -50%);
			color: #000000;
			background-color: rgba(255, 255, 255, 0.9);
			padding: 8px;
			border-radius: 18px;
			font-size: 32px;
			font-weight: bold;
			line-height: 1;
			min-width: 615px;
		}

		#sab_tittle {
			color: #000000;
			font-size: 22px;
		}
	}

	/****** PC small ******/
	@media screen and (max-width: 1366px) {

		/* タイトル */
		#tittle {
			position: absolute;
			top: 37%;
			left: 50%;
			transform: translate(-50%, -50%);
			color: #000000;
			background-color: rgba(255, 255, 255, 0.9);
			padding: 7px;
			border-radius: 15px;
			font-size: 27px;
			font-weight: bold;
			line-height: 1;
			min-width: 520px;
		}

		#sab_tittle {
			color: #000000;
			font-size: 19px;
		}
	}
}

/****** スマホ横 ******/
@media screen and (max-width: 949px) {

	/* タイトル */
	#tittle {
		position: absolute;
		top: 45%;
		left: 50%;
		transform: translate(-50%, -50%);
		color: #000000;
		background-color: rgba(255, 255, 255, 0.9);
		padding: 10px;
		border-radius: 20px;
		font-size: 17.1px;
		font-weight: bold;
		line-height: 1;
		width: 310px;
	}

	#sab_tittle {
		color: #000000;
		font-size: 11px;
	}
}

/****** スマホ縦 ******/
@media screen and (max-width: 499px) {

	/* タイトル */
	#tittle {
		position: absolute;
		top: 38%;
		left: 50%;
		transform: translate(-50%, -50%);
		color: #000000;
		background-color: rgba(255, 255, 255, 0.9);
		border-radius: 20px;
		font-size: 17.1px;
		font-weight: bold;
		line-height: 1;
		width: 300px;
	}

	#sab_tittle {
		color: #000000;
		font-size: 11px;
	}
}

/* **********************************main**********************************/

/* ダウンロードbutton位置調整用 */
.regulate {
	visibility: hidden;
}

/* button配置 */
.text_row {
	display: flex;
	justify-content: space-between;
}

.w-100 {
	width: 100%;
}

/* button配置 */
.button_row {
	display: flex;
	justify-content: space-around;
}

.a_notice {
	color: -webkit-link;
	cursor: pointer;
	text-decoration: underline;
}
@media screen and (min-width: 950px) {

	/****** PC ******/
	/* main_container */
	.main_container {
		margin: auto;
		padding-top: 30px;
		max-width: 1300px;
		display: flex;
		justify-content: center;
	}

	/* notice */
	.notice_box {
		width: 45%;
		max-width: 650px;
	}

	.notice_title_background {
		height: 33px;
		margin-right: 25px;
		border: 1px solid #aca8a8;
		background: #3a3939 url(../../../img/box_info_bg.gif) repeat-x left bottom;
		background-image: url(../../../img/box_info_bg.gif);
		background-color: rgb(255, 255, 255);
		font-weight: bold;
		display: flex;
		justify-content: center;
	}

	.notice_img {
		width: 25px;
		height: 25px;
		padding-top: 5px;
	}

	.notice_title {
		font-size: 25px;
		padding-left: 5px;
	}

	.scroll_box_notice {
		height: 515px;
		margin-right: 25px;
		overflow-y: scroll;
		border: 1px solid rgb(156, 154, 154);
		background-color: rgb(255, 255, 255);
	}

	.notice_text {
		text-decoration: none;
		display: block;
		padding-left: 20px;
		padding-right: 15px;
		padding-top: 9px;
		list-style-type: none;
		unicode-bidi: isolate;
		font-variant-numeric: tabular-nums;
		text-align: justify;
		text-align-last: left;
		text-indent: -1em;
		font-size: 15px;
		line-height: 2em;
		margin: 0;
		margin-bottom: 3px;
	}

	/* guide */
	/* ガイド案内の文言はダウンロード画面でも使用するため、common.cssに記載。 */
	.guide_box {
		width: 45%;
		max-width: 650px;
		height: 550px;
		margin-left: 25px;
		overflow-y: auto;
		border: 1px solid rgb(156, 154, 154);
		background-color: rgb(255, 255, 255);
	}

	.guide_text_tittle {
		font-size: 20px;
		font-weight: bold;
		
		margin-bottom: 5px;
		color: #3d3c3c;
	}

	/* button */

	.icon {
		width: 20px;
		height: 20px;
		display: inline-block;
		vertical-align: top;
		filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(101%);
	}

	.button_space {
		margin-top: 15px;
	}

	/****** PC big ******/
	@media screen and (max-width: 1750px) {

		/* main_container */
		.main_container {
			margin: auto;
			padding-top: 27px;
			max-width: 1500px;
			display: flex;
			justify-content: center;
		}

		/* notice */
		.notice_box {
			width: 45%;
			max-width: 533px;
		}

		.notice_title_background {
			height: 30px;
			margin-right: 25px;
			border: 1px solid #aca8a8;
			background: #3a3939 url(../../../img/box_info_bg.gif) repeat-x left bottom;
			background-image: url(../../../img/box_info_bg.gif);
			background-color: rgb(255, 255, 255);
			font-weight: bold;
			display: flex;
			justify-content: center;
		}

		.notice_img {
			width: 23px;
			height: 23px;
			padding-top: 4px;
		}

		.notice_title {
			font-size: 23px;
			padding-left: 4px;
		}

		.scroll_box_notice {
			height: 470px;
			margin-right: 25px;
			overflow-y: scroll;
			border: 1px solid rgb(156, 154, 154);
			background-color: rgb(255, 255, 255);
		}

		.notice_text {
			text-decoration: none;
			display: block;
			padding-left: 25px;
			padding-right: 15px;
			padding-top: 5px;
			list-style-type: none;
			unicode-bidi: isolate;
			font-variant-numeric: tabular-nums;
			text-align: justify;
			text-align-last: left;
			text-indent: -1.0em;
			font-size: 13.5px;
			line-height: 2em;
			margin: 0;
			margin-bottom: 3px;
		}

		/* guide */
		/* ガイド案内の文言はダウンロード画面でも使用するため、common.cssに記載。 */
		.guide_box {
			width: 45%;
			max-width: 533px;
			height: 500px;
			margin-left: 20px;
			overflow-y: auto;
			border: 1px solid rgb(156, 154, 154);
			background-color: rgb(255, 255, 255);
		}

		.guide_text_tittle {
			font-size: 18px;
			font-weight: bold;
			
			margin-bottom: 5px;
			color: #3d3c3c;
		}

		/* button */

		.icon {
			width: 19px;
			height: 19px;
			display: inline-block;
			vertical-align: top;
			filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(101%);
		}

		.button_space {
			margin-top: 15px;
		}
	}

	/****** PC middle ******/
	@media screen and (max-width: 1600px) {

		/* main_container */
		.main_container {
			margin: auto;
			padding-top: 25px;
			max-width: 1050px;
			display: flex;
			justify-content: center;
		}

		/* notice */
		.notice_box {
			width: 45%;
			max-width: 510px;
		}

		.notice_title_background {
			height: 28px;
			margin-right: 20px;
			border: 1px solid #aca8a8;
			background: #3a3939 url(../../../img/box_info_bg.gif) repeat-x left bottom;
			background-image: url(../../../img/box_info_bg.gif);
			background-color: rgb(255, 255, 255);
			font-weight: bold;
			display: flex;
			justify-content: center;
		}

		.notice_img {
			width: 19px;
			height: 19px;
			padding-top: 5px;
		}

		.notice_title {
			font-size: 20px;
			padding-left: 3px;
		}

		.scroll_box_notice {
			height: 420px;
			margin-right: 20px;
			overflow-y: scroll;
			border: 1px solid rgb(156, 154, 154);
			background-color: rgb(255, 255, 255);
		}

		.notice_text {
			text-decoration: none;
			display: block;
			padding-left: 20px;
			padding-right: 15px;
			padding-top: 5px;
			list-style-type: none;
			unicode-bidi: isolate;
			font-variant-numeric: tabular-nums;
			text-align: justify;
			text-align-last: left;
			text-indent: -1em;
			font-size: 12px;
			line-height: 2em;
			margin: 0;
			margin-bottom: 3px;
		}

		/* guide */
		/* ガイド案内の文言はダウンロード画面でも使用するため、common.cssに記載。 */
		.guide_box {
			width: 45%;
			max-width: 510px;
			height: 450px;
			margin-left: 20px;
			overflow-y: auto;
			border: 1px solid rgb(156, 154, 154);
			background-color: rgb(255, 255, 255);
		}

		.guide_text_tittle {
			font-size: 15px;
			font-weight: bold;
			margin-bottom: 5px;
			
			color: #3d3c3c;
		}

		/* button */

		.icon {
			width: 18px;
			height: 18px;
			display: inline-block;
			vertical-align: top;
			filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(101%);
		}

		.button_space {
			margin-top: 15px;
		}
	}

	/****** PC small ******/
	@media screen and (max-width: 1366px) {

		/* main_container */
		.main_container {
			margin: auto;
			padding-top: 20px;
			max-width: 880px;
			display: flex;
			justify-content: center;
		}

		/* notice */
		.notice_box {
			width: 45%;
			max-width: 400px;
		}

		.notice_title_background {
			height: 23px;
			margin-right: 17px;
			border: 1px solid #aca8a8;
			background: #3a3939 url(../../../img/box_info_bg.gif) repeat-x left bottom;
			background-image: url(../../../img/box_info_bg.gif);
			background-color: rgb(255, 255, 255);
			font-weight: bold;
			display: flex;
			justify-content: center;
		}

		.notice_img {
			width: 16px;
			height: 16px;
			padding-top: 4px;
		}

		.notice_title {
			font-size: 17px;
			padding-left: 3px;
		}

		.scroll_box_notice {
			height: 350px;
			margin-right: 17px;
			overflow-y: scroll;
			border: 1px solid rgb(156, 154, 154);
			background-color: rgb(255, 255, 255);
		}

		.notice_text {
			text-decoration: none;
			display: block;
			padding-left: 20px;
			padding-right: 15px;
			padding-top: 7px;
			list-style-type: none;
			unicode-bidi: isolate;
			font-variant-numeric: tabular-nums;
			text-align: justify;
			text-align-last: left;
			text-indent: -1em;
			font-size: 10px;
			line-height: 2em;
			margin-bottom: 2px;
		}

		/* guide */
		/* ガイド案内の文言はダウンロード画面でも使用するため、common.cssに記載。 */
		.guide_box {
			width: 45%;
			max-width: 550px;
			height: 375px;
			margin-left: 17px;
			overflow-y: auto;
			border: 1px solid rgb(156, 154, 154);
			background-color: rgb(255, 255, 255);
		}

		.guide_text_tittle {
			font-size: 13px;
			font-weight: bold;
			margin-bottom: 5px;
			
			color: #3d3c3c;
		}

		/* button */

		.icon {
			width: 15px;
			height: 15px;
			display: inline-block;
			vertical-align: top;
			filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(101%);
		}

		.button_space {
			margin-top: 12px;
		}
	}
}

/****** スマホ横 ******/
@media screen and (max-width: 949px) {

	/* main_container */
	.main_container {
		margin: auto;
		padding-top: 30px;
		padding-bottom: 50px;
		max-width: 800px;
		justify-content: center;
	}

	/* notice */
	.notice_box {
		margin: auto;
		width: 90%;
		max-width: 800px;
	}

	.notice_title_background {
		height: 23px;
		border: 1px solid #aca8a8;
		background: #3a3939 url(../../../img/box_info_bg.gif) repeat-x left bottom;
		background-image: url(../../../img/box_info_bg.gif);
		background-color: rgb(255, 255, 255);
		font-weight: bold;
		display: flex;
		justify-content: center;
	}

	.notice_img {
		width: 17px;
		height: 17px;
		padding-top: 4px;
	}

	.notice_title {
		font-size: 18px;
		padding-left: 5px;
		padding-top: 2px;
	}

	.scroll_box_notice {
		height: 200px;
		overflow-y: scroll;
		border: 1px solid rgb(156, 154, 154);
		background-color: rgb(255, 255, 255);
	}

	.notice_text {
		text-decoration: none;
		display: block;
		padding-left: 20px;
		padding-right: 15px;
		padding-top: 5px;
		list-style-type: none;
		unicode-bidi: isolate;
		font-variant-numeric: tabular-nums;
		text-align: justify;
		text-align-last: left;
		text-indent: -1em;
		font-size: 12px;
		line-height: 2em;
		margin: 0;
		margin-bottom: 3px;
	}

	/* guide */
	/* ガイド案内の文言はダウンロード画面でも使用するため、common.cssに記載。 */
	.guide_box {
		width: 100%;
		max-width: 650px;
		margin: auto;
		background-color: rgb(255, 255, 255);
	}

	.guide_text_tittle {
		font-size: 15px;
		font-weight: bold;
		
		margin-bottom: 0px;
		color: #3d3c3c;
	}

	/* button */

	.icon {
		width: 18px;
		height: 18px;
		display: inline;
		float: left;
		filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(101%);
	}

	.button_space {
		margin-top: 15px;
	}
}

/****** スマホ縦 ******/
@media screen and (max-width: 499px) {

	/* main_container */
	.main_container {
		margin: auto;
		padding-top: 10px;
		max-width: 500px;
		justify-content: center;
	}

	/* notice */
	.notice_box {
		margin: auto;
		width: 90%;
		max-width: 500px;
	}

	.notice_title_background {
		height: 23px;
		border: 1px solid #aca8a8;
		background: #3a3939 url(../../../img/box_info_bg.gif) repeat-x left bottom;
		background-image: url(../../../img/box_info_bg.gif);
		background-color: rgb(255, 255, 255);
		font-weight: bold;
		display: flex;
		justify-content: center;
	}

	.notice_img {
		width: 17px;
		height: 17px;
		padding-top: 4px;
	}

	.notice_title {
		font-size: 16px;
		padding-left: 5px;
		padding-top: 2px;
	}

	.scroll_box_notice {
		height: 200px;
		overflow-y: auto;
		border: 1px solid rgb(156, 154, 154);
		background-color: rgb(255, 255, 255);
	}

	.notice_text {
		text-decoration: none;
		display: block;
		padding-left: 20px;
		padding-right: 15px;
		list-style-type: none;
		unicode-bidi: isolate;
		font-variant-numeric: tabular-nums;
		text-align: justify;
		text-align-last: left;
		text-indent: -1em;
		font-size: 12px;
		line-height: 2em;
		margin: 0;
		margin-bottom: 3px;
	}

	/* guide */
	/* ガイド案内の文言はダウンロード画面でも使用するため、common.cssに記載。 */
	.guide_box {
		width: 90%;
		max-width: 800px;
		margin: auto;
		background-color: rgb(255, 255, 255);
	}

	.guide_text_tittle {
		font-size: 16px;
		font-weight: bold;
		text-indent: 0rem;
		margin-bottom: 0px;
		color: #3d3c3c;
	}

	/* button */

	.icon {
		width: 18px;
		height: 18px;
		display: inline;
		float: left;
		filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(101%);
	}

	/* button */
	.button_row {
		flex-wrap: wrap;
	}
}