@charset "UTF-8";

/* 保険料表
========================================================================== */

/* ボタン */
.sex-control-area {
	margin: 0 0 10px 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.sex-control-area li{
	flex: auto;
	width: calc( 100% / 2 - 20px);
	font-size: 1.4rem;
	margin-bottom: 10px;
}
.sex-control-area li:nth-child(odd){
	margin-right: 10px;
}
.sex-control-area li a {
	display: block;
	padding: 10px 10px 35px;
	text-align: center;
	border: 1px solid #ccc;
	box-shadow: rgb(0 0 0 / 10%) 0px 2px 0 0;
	font-weight: bold;
	border-radius: 5px;
	position: relative;
}
.sex-control-area li:first-child a {color: #3c9add;}
.sex-control-area li:last-child a {color: #ef5d9a;}
.sex-control-area li a:before {
	content: '';
	position: absolute;
	width: 20px;
	height: 20px;
	margin: auto;
	bottom: 12px;
	left: 0;
	right: 0;
	border-radius: 12px;
}
.sex-control-area li:first-child a:before {background: #3c9add;}
.sex-control-area li:last-child a:before {background: #ef5d9a;}
.sex-control-area li a:after {
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	bottom: 18px;
	left: 0;
	right: 0;
	border-style: solid;
	border-width: 6px 4px 0 4px;
	border-color: #fff transparent transparent transparent;
	margin: auto;
}
.sex-control-area li a span {
	font-size: 1.8rem;
}
@media screen and (min-width: 768px){
	.sex-control-area {flex-wrap: nowrap;}
	.sex-control-area li {width: 25%;}
	.sex-control-area li:not(:last-child) {margin-right: 10px;}
	.sex-control-area li a span {font-size: 2.0rem;}
}


/* 保険料表 */
.block-price:not(:last-child){
	margin-bottom: 40px;
}

.block-price .ttl-bg{
	color: #fff;
	font-size: 2.0rem;
}
@media screen and (min-width: 768px) {
	.block-price .ttl-bg {
		color: #fff;
		font-size: 2.2rem;
	}
}

.price-table thead th.th-bg-age {color: #4c4c4c; background-color: #e6e9eb;}
#block-men .price-table thead th.th-bg01 {color: #3c9add; background-color: #e0f1fb;}
#block-men .price-table thead th.th-bg02 {color: #3c9add; background-color: #d4edfa;}
#block-women .price-table thead th.th-bg01 {color: #ef5d9a; background-color: #ffebf4;}
#block-women .price-table thead th.th-bg02 {color: #ef5d9a; background-color: #ffe0ee;}
.price-table tbody tr:nth-child(even) {background-color: #f7f8f8;}
.price-table thead th.th-bg01 span{
	font-size: 1.6rem;
}
@media screen and (min-width: 768px) {
	.price-table thead th.th-bg01 span{
		font-size: 2.0rem;
	}
}
@media screen and (max-width: 767px){
	.block-price__table {
		margin-top: 10px;
	}
	.block-price .txt-right{
		text-align: right!important;
	}
}