@charset "UTF-8";



/** ************************************* **

	TABLE CONTENTS
	---------------------------
		01. Globals
		02. Titled frame
		03. box
		04. 文字サイズ
	---------------------------

 ** ************************************* **/


/** 01. Globals
**************************************************************** **/
 
/** 02. Titled frame
**************************************************************** **/
.Titl_frame {
  border: 2px solid #ff457b;
	margin: 10px 0;
}
.Titl_frame h3 {
  background: #ff457b;
  color: #FFF;
  margin: 0;
  display: inline-block;
  padding: .3em;
  border-radius: 0 0 5px 0;
}
.Titl_frame .inner {
  padding: .5em;
}

/** 03. box
 **************************************************************** **/
.box.box_pink {
	margin: 10px 0;
	padding: 10px 15px;
	border: 3px solid #ff457b;
	border-radius: 0px;
}



/* ----------------------------------------
 * 囲み文字の基本形　インデント有
 * --------------------------------------- */
.maru {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	border-radius: 50%;
	flex-flow: column; 
	vertical-align:middle;
	margin-right: 5px;
	margin-bottom: 5px;
	text-indent: 0;
}
  /* 円の大きさ */
.size_normal{
	width: 30px;
	height: 30px;
}

/* 囲みと文字の色 */
.blue1 {
	color: #fff;
	border: 1px solid #52A7E0;
	background: #52A7E0;
}



/** 04. 文字サイズ
 **************************************************************** **/

.SideBySide p {
 display:inline-block;
 vertical-align: middle; /*縦方向の揃え位置を指定*/
 margin-bottom: 0;
}

.SideBySide p img{
 height: 50px;
 width: 50px;
}



#content .md {
	font-size: 150%;
}

#content .bg {
	font-size: 400%;
}

#content .sm {
	font-size: 120%;
}

@media all and (max-width: 515px) {
	#content .bg {
		font-size: 5.6vw;
	}

	#content .md {
		font-size: 4.7vw;
	}

	#content .sm {
		font-size: 4.0vw;
	}
}