@charset "UTF-8";
body, html { font-size: 10px; }
@media screen and (min-width: 576px) and (max-width: 768px) { body, html { font-size: 12px; } }
@media screen and (min-width: 769px) and (max-width: 992px) { body, html { font-size: 16px; } }
@media screen and (min-width: 993px) and (max-width: 1200px) { body, html { font-size: 16px; } }
@media screen and (min-width: 1201px) { body, html { font-size: 20px; } }


*{
	box-sizing: border-box;
}

#side_links {
    padding: 10px;
    margin-right: 20px;
    list-style: none; /* リストのデフォルトのマーカーを削除 */
}

#side_links .nav-item {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

#side_links .link-text {
    margin-left: 8px; /* アイコンとテキストの間の余白を追加 */
}

.back-color3{
	background-color :rgb(203, 247, 232);
	margin: 0px 0px 16px;
	padding: 12px 16px;
}
.font_1 {
	font-size: 1.2rem;
}
  
.font_2 {
	font-size: 1.0rem;
}

.font_3{
	font-size: 0.8rem;
}

.font_4 {
	font-size: 2.0rem;
}

.font_6 {
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "游ゴシック体", sans-serif;
	font-size: 1.4rem;	
	font-weight: bold; /* 太字 */
	display: inline-block; /* テキスト幅に合わせる */
	position: relative;   /* 擬似要素の基準にする */
}

.font_6::after {
	content: "";
	display: block;
	width: 120%; /* テキスト幅の120% */
	height: 8px; /* ボーダーの太さ */
	background: rgb(1, 185, 17); /* 下線の色 */
	border-radius: 9999px; /* 両端を丸くする。数値は大きめに */
	position: absolute;
	left: 50%;
	transform: translateX(-50%); /* 中央揃え */
	bottom: -5px; /* テキストからの距離（調整可） */
  
}
.font_7 {
	font-size: 2rem;
	font-weight: bold; /* 太字 */
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "游ゴシック体", sans-serif;
}
.text_area {
  margin-left: 30px;
}
.btn-scale {
  transform: scale(0.6);   /* 全体を60%に縮小 */
  transform-origin: top center; /* 基準点を上中央にする（ズレ防止） */
  display: inline-block;   /* inline要素にscaleを効かせるため */
}

.col {
	font-family: 'Arial', sans-serif; /* ここでフォントファミリーを指定 */
}

.fa-2xl {
	font-size: 2em; /* アイコンのサイズを調整 */
}
.link-text {
	font-size: 16px; /* フォントサイズを調整 */
	font-family: Arial, sans-serif; /* フォントファミリーを指定 */
	color: #333; /* フォントの色を変更 */
	margin-left: 5px; /* アイコンと文字の間隔を調整 */
	font-weight: normal; /* フォントを標準に設定 */
}
#page_top {
	background-color: #e13bfb; /* 薄い紫色 */
	border: none; /* 枠線を消す */
	color: white; /* アイコンの色 */
	border-radius: 50%; /* ボタンを丸くする */
	font-size: 32px; /* フォントサイズ */
	width: 48px; /* ボタンの幅 */
    height: 48px; /* ボタンの高さ */
    display: flex; /* アイコンの中央揃え */
    align-items: center; /* アイコンの中央揃え */
    justify-content: center; /* アイコンの中央揃え */
	opacity: 0;
	visibility: hidden;
	transition: opacity 1s ease, visibility 1s ease;
	position: fixed;
	bottom: 40px;
	right: 20px;
	z-index: 1000;
}
#page_top.show {
	opacity: 1;
	visibility: visible;
}
  
#page_top:hover {
	background-color: #f815f8; /* ホバー時の色を少し濃くする */
}
.copyright {
	padding-top: 10px;
	padding-bottom: 30px;
	background-color: rgb(203, 247, 232);
} 
  
.footer_color{
	background-image: url(../images/softycolordots_1.png);
	background-repeat: repeat-x;
	background-color: rgb(203, 247, 232);
}

.footer_image{
	background-image: url(../images/softycolordots_1.png);
	background-repeat: repeat-x;
	background-color: rgb(203, 247, 232);
} 

.nav-list-style .font_2{
	list-style-type: none;
}