.t_color {color:#c90013 }
b.t_color {font-weight:800}


.flex {display:flex}
.ac {align-items:center !important; }
.as {align-items:flex-start !important; }
.ad {align-items:flex-end !important; }
.jt {justify-content:flex-start !important; }
.jd {justify-content:flex-end !important; }
.jc {justify-content:center !important; }
.js {justify-content:space-between !important; }

.flex.col-2 > li {width:50%}
.flex.col-3 > li {width:33%}
.flex.col-4 > li {width:25%}
.flex.col-5 > li {width:20%}

.flex.col-2 > div {width:50%}
.flex.col-3 > div {width:33%}
.flex.col-4 > div {width:25%}
.flex.col-5 > div {width:20%}

.flex.col-4 > ul {width:25%}


.flex.wrap {flex-wrap:wrap}
.flex.gap10 {gap:10px}
.flex.gap20 {gap:20px}

.flex.col-2.gap20 > li {width:calc(50% - 10px)}
.flex.col-2.gap20 > div {width:calc(50% - 10px)}

.flex img {max-width:100%}





.form_group { margin-top: 18px; }
.form_group:first-child { margin-top: 0; }
.form_label { display: block; margin-bottom: 8px; font-size: 1.4rem; font-weight: 600; }
.required { color: var(--danger); }

.input {
	width: 100%;
	height: 51px;
	font-size:1em;
	padding:0 10px;
	border: 1px solid #ddd5c8;
	border-radius: .6rem;
	outline: none;
	transition: .2s;
	color:#444;
}

.input:focus,
.select:focus,
.textarea:focus {
	border-color: var(--black);
	box-shadow: 0 0 0 1px var(--black);
}

textarea.input {padding:10px; box-sizing:border-box; color:#444;}

.select {
	width: 100%;
	height: 55px;
	padding:0 10px;
	border: 1px solid #ddd5c8;
	border-radius: .6rem;
	background: #fff;
	outline: none;
	color:#444;
}

.textarea {
	width: 100%;
	min-height: 12rem;
	padding: 15px;
	border: 1px solid #ddd5c8;
	border-radius: .6rem;
	resize: vertical;
	outline: none;
	color:#444;
}

.help { margin: 7px 0 0; color: #888; font-size: 1.2rem; }

.check_row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	margin-top: 15px;
	color: #666;
	font-size: 1.3rem;
}

.check { display: inline-flex; align-items: center; gap: .7rem; }
.check input { width: 1.7rem; height: 1.7rem; accent-color: var(--point); }

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 5.2rem;
	padding: 0 24px;
	border: 1px solid var(--black);
	border-radius: .6rem;
	background: #fff;
	font-weight: 600;
	transition: .2s;
}

.btn:hover { background: #f7f7f7; }
.btn_primary { background: var(--black); color: #fff; }
.btn_primary:hover { background: #333; }
.btn_point { border-color: var(--point); background: var(--point); color: #fff; }
.btn_point:hover { background: #173d2e; }
.btn_point2 { border-color: var(--point);  color:  var(--point); }
.btn_point2:hover { background: #173d2e; color:#fff }
.btn_light { border-color: #ddd5c8; background: #fff; color: #555; }
.btn_sm { height: 3.6rem; padding: 0 14px; font-size: 1.3rem; }
.btn_full { width: 100%; }
.btn_group { display: flex; gap: 1rem; margin-top: 30px; }
.btn_group .btn { flex: 1; }


.b_btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 5.2rem;
	width:150px;
	 
	border-radius: .6rem;
	background: var(--green2);
	color: #fff; 
	font-weight: 600;
	transition: .2s;
}



/* tabs */
.tabs { display: flex; margin-bottom: 30px; border-bottom: 1px solid #222; }

.tabs a,
.tabs button {
	flex: 1;
	height: 5.4rem;
	border: 1px solid #ddd5c8;
	border-bottom: 0;
	background: #fff;
	color: #777;
}

.tabs .active { border-color: #222; background: #222; color: #fff; }
.tab_panel { display: none; }
.tab_panel.active { display: block; }


.value-list2 {
	display:flex;
	gap:13px;
}

.value-item2 {
	width:100%;
	position:relative;
	padding:35px 27px;
	 
	background: rgba(255, 255, 255, .8);
}

.value-item2:last-child {border-right:0;}

.value-item2 > span {
	display:block;
	margin-bottom:15px;
	color:#c90013;
	font-size:1.3rem;
	font-weight:700;
}

.value-item2 strong {
	display:block;
	margin-bottom:18px;
	color:#222;
	font-size:2rem;
	font-weight:700;
}

.value-item2 p {
	color:#666;
	font-size:1.5rem;
}


@media all and (max-width:900px) {
	.flex {flex-wrap:wrap}
	.flex.no_w {flex-wrap:nowrap}
	.flex.col-2 > li {width:100%}
	.flex.col-3 {gap:20px 0 !important; justify-content:space-between }
	.flex.col-3 > li {width:48%;}
	.flex.col-4 {gap:20px 0 !important; justify-content:space-between }
	.flex.col-4 > li {width:48%;}

.flex.col-2 > div {width:100%}
	.flex.col-3 > div,.flex.col-4 > div,.flex.col-5 > div {width:48%}
	.flex.col-5 > li {width:48%}
	.flex.col-4 > ul {width:48%}
	.value-list2 {display:grid; grid-template-columns:repeat(1,1fr)}
}
