@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Pliant:ital,wght@0,100..900;1,100..900&display=swap');
body{
	margin:0;
}

#ex_calc a{
	color:#DE2989;
	text-decoration: none;
}

#ex_calc tr.keka a{
	color:#fff;
	font-size:1.1rem;
}

@media screen and (min-width:981px){
	#ex_calc a{
		transition: all 0.3s;
	}
	
	#ex_calc a:hover{
		color:var(--blue_font);
		text-decoration: none;
	}
}

#ex_calc{
	background-color: #FFEFE9;
	min-height: 100dvh;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap:50px;
}

#ex_calc dl{
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap:50px;
}

#ex_calc dt{
	background-color:#33A1C9; 
	color:#fff;
	font-size:1.5rem;
	font-weight: 700;
	line-height: normal;
	padding:10px 10px 30px 10px;
	text-align: center;
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 30px), 50% 100%, 0 calc(100% - 30px));
 /* text-shadow:1px 1px 0 #fff, -1px -1px 0 #fff,
              -1px 1px 0 #fff, 1px -1px 0 #fff,
              0px 1px 0 #fff,  0 -1px 0 #fff,
              -1px 0 0 #fff, 1px 0 0 #fff;*/
	letter-spacing: 2px;
	margin-bottom:0;
}

#ex_calc dd{
	width:95%;
	margin:0 auto;
	padding:20px -30px 20px 30px;
	text-align: left;
}

#ex_calc .coment{
	font-family: "Noto Sans JP",sans-serif;
	font-weight: 800;
	font-size:0.9rem;
	line-height: 1.8;
	color:#0E597D;
	text-align: center;
	 text-shadow:1px 1px 0 rgba(255,255,255,0.5), -1px -1px 0 rgba(255,255,255,0.5),
              -1px 1px 0 rgba(255,255,255,0.5), 1px -1px 0 rgba(255,255,255,0.5),
              0px 1px 0 rgba(255,255,255,0.5),  0 -1px 0 rgba(255,255,255,0.5),
              -1px 0 0 rgba(255,255,255,0.5), 1px 0 0 rgba(255,255,255,0.5);
	margin-bottom:30px;
}

#ex_calc_naiyu{
	margin:50px auto;
	text-align: center;
	color:var(--blue_font);
	font-weight: 700;
}

#ex_calc_naiyu h2{
	font-size:1.3rem;
	margin-bottom:30px;
	font-weight: 700;
}

#ex_calc ul{
	display: inline-block;
	text-align: left;
	
}

#ex_calc li{
	margin-bottom:5px;
}

#ex_calc li:last-of-type{
	margin-bottom: 0;
}

#ex_calc table{
	width:100%;
	border-collapse:separate;
	border-spacing:0 3px;
}

#ex_calc tr:nth-of-type(n+2){
	display: none;
	
}

#ex_calc tr.act,
#ex_calc tr.keka.act{
	display: table-row;
}


#ex_calc th,
#ex_calc td{
	padding:10px 15px;
	line-height: 1.4;
	font-size:1rem;
}

#ex_calc th{
	width:250px;
	background-color: #33A1C9;
	color:#fff;
	font-size:0.9rem;
	font-weight: 700;
	border-radius: 6px 0 0 6px;
	padding:5px 15px;
}

#ex_calc td{
	background-color: rgba(255,255,255,0.5);
	text-align: left;
	border-radius: 0 6px 6px 0;
	border-top:1px solid #EEEEEE;
	border-bottom:1px solid #EEEEEE;
	border-right:1px solid #EEEEEE;
}

#ex_calc tr.keka td{
	background-color: #33A1C9;
	font-weight: 700;
	text-align: right;
	font-size:14px;
	color:#fff;
	border-radius:6px;
}

#ex_calc tr.keka td p{
	margin-top:5px;
}

#ex_calc tr.keka td p.total{
	font-size:1rem;
}

#ex_calc tr.keka strong{
	font-size:1.3rem;
	font-family: "Roboto", sans-serif;
	font-weight: 700;
	color:#fff;
}

#ex_calc tr.keka .nokeka strong{
	font-size:1.15rem;
}

/*-----------------------------


	レスポンシブ


-----------------------------*/

#ex_calc_close{
	display: none;
}

@media screen and (min-width: 0) and (max-width: 430px){
	#ex_calc dt{
		font-size:1.2rem;
		padding:20px 10px 30px 10px;
		position: relative;
	}
	
	#ex_calc th,
	#ex_calc td{
		width:100%;
		display: block;
		background-color: rgba(255,255,255,0.5);
	}
	
	#ex_calc th{
		border-top:1px solid #33A1C9;
		border-left:1px solid #33A1C9;
		border-right:1px solid #33A1C9;
		border-radius: 5px 5px 0 0;
		padding:0;
		vertical-align: top;
	}
	
	#ex_calc th p{
		width: calc(100% - 30px);
		border-top-left-radius: 5px;
		background-color: #33A1C9;
		clip-path: polygon(0 0, 100% 0%, calc(100% - 30px) 100%, 0% 100%);
		padding:3px 30px 3px 5px;
		font-size:0.9rem;
	}
	
	#ex_calc td{
		border-bottom:1px solid #33A1C9;
		border-left:1px solid #33A1C9;
		border-right:1px solid #33A1C9;
		border-radius:0 0  5px 5px;
		padding:15px 20px;
	}
	
	#ex_calc_close{
		display: inline-block;
		font-size:20px;
		position: absolute;
		top:0;
		right:3px;
		line-height: 1;
		color:#fff!important;
	}
	
}

/*-----------------------------



	フォーム



-----------------------------*/

#ex_calc input{
	margin-right:10px;
}

#ex_calc input[type="text"]{
	width:50px;
	font-size:1.05rem;
	font-family: "Pliant", sans-serif;
	padding:3px 5px;
	border:1px solid var(--blue_font);
	outline: none;
	background-color: rgba(241,241,241,1.00);
	border-radius: 3px;
}

#ex_calc input[type="text"]:focus{
	background-color: #fff;
}

#ex_calc input[type="radio"]{
	width: 16px; /* ボタンの幅 */
  	height: 16px; /* ボタンの高さ */
	appearance: none; 
	 border:1px solid var(--blue_font); 
	  border-radius: 50%;
	  margin: 0; /* デフォルトのmarginを消す */
	  position: relative;
	background-color: #fff;	
	  background: radial-gradient(rgba(236,236,236,1.00) 73%, rgba(254, 254, 254, 1) 90%);
}


#ex_calc input[type="radio"]::before{
  background-color: var(--blue_font);
  border-radius: 50%;
  content: "";
	width: 10px;
  height: 10px;
  opacity: 0;
  position: absolute;
	top: calc(50% - 5px);
left: calc(50% - 5px);
}

#ex_calc input[type="radio"]:checked::before{
  opacity: 1;
}
#ex_calc label{
	margin-right:15px;
	display: inline-flex;
	align-items: center;
	gap:5px;
}

#ex_calc_bottan{
	display: none;
	text-align: center;
	margin-top:30px;
}
#ex_calc_bottan input[type="button"]{
	width:200px;
	padding:8px 0;
	background: #fff;
	background: -webkit-linear-gradient(#FFFFFF 0%, #DDDDDD 100%);
	background: -o-linear-gradient(#FFFFFF 0%, #DDDDDD 100%);
	background: linear-gradient(#FFFFFF 0%, #DDDDDD 100%);
	cursor: pointer;
	border:1px solid var(--blue_font);
	border-radius: 8px;
	font-weight: bold;
	font-size:16px;
	color:#1564B3;
}

#logo{
	width:100%;
	margin:0 auto 10px auto;
	line-height: 0;
	display: flex;
	align-items: center;
	padding-left:10px;
}

#logo img{
	width:180px;
}

#logo img.carr{
	width:auto;
	height: 80px;
	margin-right:15px;
}

#logo::after{
	content: '';
	flex:1;
	height: 1px;
	background-color: var(--blue_font);
	display: block;
}

#logo::before{
	margin-right:30px;
}

#logo::after{
	margin-left:30px;
}

#ex_calc p.renewonly{
	font-size:var(--s_font);
	margin-top:10px;
}

/*-----------------------------


	colorbox


-----------------------------*/

body::-webkit-scrollbar {
    width: 6px; /* スクロールバーの太さ */
	background-color: rgba(94,132,138,0.7);
	border-radius: 3px;
	scrollbar-width: thin;
}

::-webkit-scrollbar-thumb {
  background: #00AFCC;
/*background: -webkit-linear-gradient(left, rgba(3,145,168,1.00) 0%, rgba(0, 175, 204, 1) 50%, rgba(3,145,168,1.00) 100%);
background: -o-linear-gradient(left, rgba(3,145,168,1.00) 0%, rgba(0, 175, 204, 1) 50%, rgba(3,145,168,1.00) 100%);
background: linear-gradient(to right, rgba(3,145,168,1.00) 0%, rgba(0, 175, 204, 1) 50%, rgba(3,145,168,1.00) 100%);	*/
	background: -webkit-linear-gradient(left, rgba(117,151,156,1.00) 0%, #fff 50%, rgba(88,114,118,1.00) 100%);
	background: -o-linear-gradient(left, rgba(117,151,156,1.00) 0%, #fff 50%, rgba(88,114,118,1.00) 100%);
	background: linear-gradient(to right, rgba(117,151,156,1.00) 0%, #fff 50%, rgba(88,114,118,1.00) 100%);
border-radius: 100px;
}

/* つまみにホバーした時 */
/*::-webkit-scrollbar-thumb:hover {
  background: #555;
}*/

