@charset "utf-8";

@import "setting";

hgroup.support{
	i{
		filter: invert(83%) sepia(48%) saturate(1870%) hue-rotate(336deg) brightness(101%) contrast(94%);
	}
	h6{
		color: #f7b52c;
	}
}

#support{
	text-align: center;
	
	h5{
		@include fs(16,2,.2);
	}
	
	h4{
		@include fs(20,2,.2);
		margin: .5em auto 1.5em;
	}
	
	ul{
		max-width: 450px;
		margin: auto;
		border-top: dotted 1px #999;
		@include fs(16,3,.2);
		
		li{
			border-bottom: dotted 1px #999;
		}
	}
}

section.supportTitle{
	@include fs(15,2,.15);
	margin-bottom: 3em;
	text-align: center;
	
	h3{
		font-weight: 700;
		@include fs(20,2,.2);
	}
}

section.support{
	margin: 0 auto;
	
	&+section.supportTitle{
		margin-top: calc(var(--headerHeight) * 2.4);
	}
	
	&:last-child{
		margin-bottom: 200px;
	}
	
	dl{
		border-top: solid 1px #ccc;
		border-bottom: solid 1px #ccc;
		display: flex;
		@include fs(15,2,.15);
		padding: 3em 1em;
		justify-content: space-between;
		
		dt{
			@include fs(20,1.6,.15);
			font-weight: 700;
			flex-basis: 7em;
		}
		dd{
			flex-basis: calc(100% - 180px);
			
			ul{
				list-style: disc;
				margin-left: 1em;
				
				li::marker{
					color: #f7b52c;
				}
				
				li+li{
					margin-top: 2em;
				}
				
				&.no-margin{
					li+li{
						margin-top: 0;
					}
				}
			}
			
			h4,h5{
				@include fs(17,1.75,.15);
				font-weight: 500;
			}
		}
	}
	
	&+.support{
		dl{
			border-top: none;
		}
	}
}

// Large devices (desktops, 992px and up)
@media (max-width: 1199.98px) {
}

// Medium devices (tablets, 768px and up)
@media (max-width: 991.98px) {
}

/// Small devices (landscape phones, less than 768px)
@media (max-width: 767.98px) {

section.support{
	
	&:last-child{
		margin-bottom: 120px;
	}
	
	dl{
		display: block;
		
		dt{
			margin-bottom: 1em;
			br{display: none;}
		}
		dd{
			flex-basis: calc(100% - 180px);
			
			ul{
				list-style: disc;
				margin-left: 1em;
				
				li::marker{
					color: #f7b52c;
				}
				
				li+li{
					margin-top: 2em;
				}
				
				&.no-margin{
					li+li{
						margin-top: 0;
					}
				}
			}
			
			h4,h5{
				@include fs(17,1.75,.15);
				font-weight: 500;
			}
		}
	}
	
	&+.support{
		dl{
			border-top: none;
		}
	}
}
}


@media (max-width: 991.98px) and (min-aspect-ratio: 8/5) and (orientation: landscape) {
}