@charset "utf-8";

html{
	font-size: 62.5%;
}
@media screen and (max-width: 1200px){
  html{
    font-size: 50.78125%; /* 13px */
  }
}
@media screen and (max-width: 1024px){
  html{
    font-size: 46.875%;
  }
}
@media screen and (max-width: 520px){
  html{
    font-size: 62.5%;
  }
}

/*--------------------------------------*/

body{
  font-size: 1.6rem;
	font-family: "Figtree", sans-serif !important;
	line-height: 1.75 !important;
  font-weight: 500;
}
@media screen and (min-width: 521px){
	body{

	}
}
@media screen and (max-width: 520px){
	body{
    font-size: clamp(1.6rem, 3.2vw, 1.3rem);
	}
}

@keyframes csn-rotate{
	to{
		transform: rotate(360deg);
	}
}

.button a{
  display: inline-block;
  border-radius: 10em;
  background-color: var(--c_lightgray);
  color: var(--c_primary);
  padding: .5em 1.5em;
  white-space: nowrap;
  width: 10em;
  box-sizing: border-box;
}
.button.p a{
  background-color: var(--c_primary);
  color: var(--c_white);
}

section .heading.common{
  font-size: 5rem;
  margin-bottom: 1em;
  text-align: center;
  font-weight: 500;
  position: relative;
}
section .heading.common .label{
  display: inline-block;
  background-color: var(--c_white);
  padding: .1em 1em;
  position: relative;
  z-index: 2;
}
section .heading.common::after{
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: var(--c_border_gray);
  top: 50%;
  position: absolute;
}
@media screen and (max-width: 520px){
  section .heading.common{
    font-size: 7vw;
  }
}

/*--------------------------------------*/

.breadcrumbs{
  font-size: clamp(1rem, 80%, 1.4rem);
}
.breadcrumbs ul{
  display: inline-flex;
  align-items: center;
}
.breadcrumbs ul .icon_arrow::before{
  border-width: 1px;
}
.breadcrumbs ul li{
  margin-right: 1em;
}

/*--------------------------------------*/

#wrapper{

}
@media screen and (min-width: 521px){
	#wrapper{
    min-width: 980px;
    margin: 0 auto;
	}
}
@media screen and (max-width: 520px){
	#wrapper{

	}
}

/*--------------------------------------*/

#main{
	
}
@media screen and (min-width: 521px){
	#main{

	}
}
@media screen and (max-width: 520px){
	#main{

	}
}

/*--------------------------------------*/

#contents{
	
}
@media screen and (min-width: 521px){
	#contents{

	}
}
@media screen and (max-width: 520px){
	#contents{

	}
}

/*--------------------------------------*/

#sidebar{
	
}
@media screen and (min-width: 521px){
	#sidebar{

	}
}
@media screen and (max-width: 520px){
	#sidebar{

	}
}

.bottom_links{
  padding: 2em 2em;
}

/*--------------------------------------*/

footer{
	background-color: var(--c_primary);
  color: var(--c_white);
  padding: 1em 0 2em 0;
}
@media screen and (min-width: 521px){
	footer{

	}
}
@media screen and (max-width: 520px){
	footer{
    padding-bottom: 8em;
	}
}