@charset "UTF-8";





/** 00. ドット背景
 **************************************************************** **/
/* ドット斜め */
.bg_dot{
	background-color: #ffdbc1;
	background-image:
		radial-gradient(#fff3eb 20%, transparent 20%),
		radial-gradient(#fff3eb 20%, transparent 20%);
	background-size: 20px 20px;
	background-position: 0 0, 10px 10px;
	border: solid 1px #ffdbc1;
}

/* ドット色違い */
.dot-mix{
	background-image:
		radial-gradient(#fff3eb 20%, transparent 20%),
		radial-gradient(#fff3eb 20%, transparent 20%);
}

/* ドットサイズ違い */
.dot-size{
background-image:
	radial-gradient(#fff3eb 20%, transparent 20%),
	radial-gradient(#fff3eb 35%, transparent 35%);
}



#content .btn {
	white-space: normal;
}

.section {
	margin-top: 1.5em;
	margin-bottom: 1.5em;
}

.section .section-header {
	padding: 15px;
	background-color: #ffdbc1;
	background-image:
		radial-gradient(#fff3eb 20%, transparent 20%),
		radial-gradient(#fff3eb 20%, transparent 20%);
	background-size: 20px 20px;
	background-position: 0 0, 10px 10px;
}

.section .section-img {
	position: relative;
	margin-bottom: 2em;
}

.section .section-title {
	position: absolute;
	top:-15px;
	left:11px;
	display: inline;
	background-color: #ffdbc1;
	background-image:
		radial-gradient(#fff3eb 20%, transparent 20%),
		radial-gradient(#fff3eb 20%, transparent 20%);
	background-size: 20px 20px;
	background-position: 0 0, 10px 10px;
	font-size: 180%;
	padding: 8px;
}

@media all and (max-width: 414px) {
.section .section-title {
	font-size: 5vw;
	padding: 6px;
}
}

.card {
	border-width: 5px;
}

.card.warning {
	border-color: #fc825d;
}

.card-header {
	border-width: 5px;
	border-top-left-radius: 0px!important;
	border-top-right-radius: 0px!important;
}

.bg-warning {
	border-color: #fc825d;
	background-color:  #fc825d!important;
}
.card-header.bg-warningg {
	background-color: #fc825d;
	border-color: inherit;
	color: #FFFFFF;
	margin-bottom: 0;
}
.card.warning .card-body {
	padding: 0!important;
}

.card.warning .card-body .section {
	letter-spacing: 0;
	margin-top: 0;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0;
	padding: 0;
}

#content .card-body .section table.section-table {
	width: 100%;
	padding:0;
	margin:0;
}

#content .card-body .section table.section-table td.width50 {
	width: 50%;
}

#content .card-body .section table.section-table td {
	padding:0;
	vertical-align: middle;
}

#content .card-body .section table.section-table td.bg_orange {
	background-color: #FFDBC1;
	padding: 1em;
}


#content .mbtm1rem {
	margin-bottom: 1rem;
}

#content .mbtm2rem {
	margin-bottom: 2rem;
}

#content .mbtm3rem {
	margin-bottom: 3rem;
}

#content .mtop3rem {
	margin-top: 3rem;
}


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

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

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

#content .ssm {
	font-size: 140%;
}

@media all and (max-width: 515px) {


#content .bg {
	font-size: 5.6vw;
}

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

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

#content .ssm {
	font-size: 3.0vw;
}

}


/*Fukidashi*/
.fukidashi_block {
	font-family: 'M PLUS Rounded 1c', sans-serif;
 	margin: 0.5em 0;
	padding: 15px 10px;
 	color: #333;
	font-size: 14px;
	background: #ffdbc1;
    border-radius: 15px;
    text-align: center;
}

.fukidashi_block.min {
	font-family: 'M PLUS Rounded 1c', sans-serif;
 	margin: 0.5em 0;
	padding: 5px 8px;
 	color: #393939;
	font-size: 14px;
	background: #ffdbc1;
    border-radius: 15px;
    display: block;
}
.fukidashi_block.fukidashi_blue {
	background: #0f7ebf;
	color: #FFFFFF;
}



.fukidashi_bottom {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: relative;
	z-index: 1;
	display: inline-block;
 	margin: 0.5em 0 1.5em;
	padding: 15px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #393939;
	font-size: 14px;
	background: #93D04F;
    border-radius: 15px;
}
.fukidashi_bottom:before {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
 	margin-left: -15px;
	border: 15px solid transparent;
	border-top: 15px solid #93D04F;
}
.fukidashi_bottom2 {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: relative;
	z-index: 3;
	display: inline-block;
 	margin: 0.5em 0 -1em;
	padding: 15px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #393939;
	font-size: 14px;
	background: #ffdbc1;
    border-radius: 15px;
}
.fukidashi_bottom2:before {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
 	margin-left: -15px;
	border: 15px solid transparent;
	border-top: 15px solid #ffdbc1;
}

.fukidashi_top {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: relative;
	display: inline-block;
 	margin: 12px 0 1em;
	padding: 15px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #393939;
	font-size: 14px;
	background: #ffdbc1;
 	box-sizing: border-box;
    border-radius: 15px;
}
.fukidashi_top:before {
	content: "";
	position: absolute;
	top: -30px;
	left: 50%;
 	margin-left: -15px;
	border: 15px solid transparent;
	border-bottom: 15px solid #ffdbc1;
}

.fukidashi_top2 {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: relative;
	display: inline-block;
 	margin: -10px 0 1em;
	padding: 15px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #393939;
	font-size: 14px;
	background: #ffdbc1;
 	box-sizing: border-box;
    border-radius: 15px;
}
.fukidashi_top2:before {
	content: "";
	position: absolute;
	top: -30px;
	left: 50%;
 	margin-left: -15px;
	border: 15px solid transparent;
	border-bottom: 15px solid #ffdbc1;
}

.fukidashi_right {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: relative;
	display: inline-block;
 	margin: 0 15px 0 0;
	padding: 15px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #393939;
	font-size: 14px;
	background: #ffdbc1;
    border-radius: 15px;
}
.fukidashi_right:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 100%;
 	margin-top: -15px;
	border: 15px solid transparent;
	border-left: 15px solid #ffdbc1;
}
.fukidashi_right2 {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: relative;
	z-index: 3;
	display: inline-block;
 	margin: 20px -30px 0 0;
	padding: 15px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #393939;
	font-size: 14px;
	background: #93D04F;
    border-radius: 15px;
}
.fukidashi_right2:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 100%;
 	margin-top: -15px;
	border: 15px solid transparent;
	border-left: 15px solid #93D04F;
}
.fukidashi_left {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: relative;
	display: inline-block;
 	margin: 30px 0 1.5em -150px;
	padding: 15px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #393939;
	font-size: 14px;
	background: #ffdbc1;
    border-radius: 15px;
}
.fukidashi_left:before {
	content: "";
	position: absolute;
	top: 50%;
	left: -30px;
 	margin-top: -15px;
	border: 15px solid transparent;
	border-right: 15px solid #ffdbc1;
}
.fukidashi_left2 {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: relative;
	display: inline-block;
 	margin: -2px -13px 0px -56px;
	padding: 15px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #393939;
	font-size: 14px;
	background: #ffdbc1;
    border-radius: 15px;
}
.fukidashi_left2:before {
	content: "";
	position: absolute;
	top: 50%;
	left: -30px;
 	margin-top: -15px;
	border: 15px solid transparent;
	border-right: 15px solid #ffdbc1;
}
.fukidashi_left3 {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: relative;
	display: inline-block;
 	margin: -3px 0 1.5em 20px;
	padding: 15px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #393939;
	font-size: 14px;
	background: #ffdbc1;
    border-radius: 15px;
}
.fukidashi_left3:before {
	content: "";
	position: absolute;
	top: 50%;
	left: -30px;
 	margin-top: -15px;
	border: 15px solid transparent;
	border-right: 15px solid #ffdbc1;
}
.fukidashi_left4 {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	position: relative;
	display: inline-block;
 	margin: 40px 0 1.5em -60px;
	padding: 15px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #393939;
	font-size: 14px;
	background: #ffdbc1;
    border-radius: 15px;
}
.fukidashi_left4:before {
	content: "";
	position: absolute;
	top: 50%;
	left: -30px;
 	margin-top: -15px;
	border: 15px solid transparent;
	border-right: 15px solid #ffdbc1;
}

@media all and (max-width: 414px) {

img.vtop2em {
	margin-top: 2em;
}

img.vtop1em {
	margin-top: 1em;
}

}

@media all and (max-width: 414px) {
.fukidashi_left2 {
 	margin: -2px -13px 0px -16px;
}


.fukidashi span.em12 {
	font-size: 4.2vw;
}
}



/* bootstrap 機能拡張 */
.row-center{
letter-spacing:-0.4em;
}
.row-center > [class*='col-'] {
display:inline-block;
letter-spacing:0;
vertical-align:top;
float:none !important;
}
.row-center.va-middle > [class*='col-'] {
vertical-align:middle;
}
.row-center.va-bottom > [class*='col-'] {
vertical-align:bottom;
}




/** 13. 文字付囲み枠
**************************************************************** **/
.box03 {
	position: relative;
	padding: 1.5em 1em;
	border: solid 3px #f44336;
	border-radius: 8px;
	margin: 10px;
}

.box03.green_line {
	border: solid 3px #3B9720;
}

.box03 .box-title {
	position: absolute;
	display: inline-block;
	top: -13px;
	left: 10px;
	padding: 0 9px;
	line-height: 1;
	font-size: 18px;
	background: #FFF;
	color: #f44336;
	font-weight: bold;
}

.box03.green_line .box-title {
	color: #3B9720;
}
.box03 p {
	margin: 0; 
	padding: 0;
}

@media (max-width: 768px) {
	.box03 .box-title {
		position: absolute;
		display: inline-block;
		top: -13px;
		left: 5px;
		padding: 0 2px;
		margin: 0 5px;
		line-height: 1.5;
		font-size: 15px;
		background: #FFF;
		color: #f44336;
		font-weight: bold;
	}

	.box03 {
		position: relative;
		padding: 2em 1em;
		border: solid 3px #f44336;
		border-radius: 8px;
		margin: 5% 5%;
	}
}