@charset "UTF-8";
/* --------------------------------------------------------------------
 Copyright (c) plusi
 -------------------------------------------------------------------- */
/* ====================================
 Layout Style
 ====================================== */

/* ------------------------------------
 border
 -------------------------------------- */
.bdl_sR{ border: 1px solid red; }
.bdl_dR{ border: 1px dashed red; }
.bdl_sG{ border: 1px solid #aaa; }
.bdl_dG{ border: 1px dashed #aaa; }

/* ------------------------------------
 background-color
 -------------------------------------- */
.bg_gray{ background-color: #f6f6f6; }
.bg_darkgray{ background-color: #251e1c; }
.bg_lightblue{ background-color: #cadcf0; }
.bg_lightyellow{ background-color: #fff8ba; }
.bg_orange{ background-color: #ffaf1a; }
.bg_white{ background-color: #fff; }
.bg_black{ background-color: #1e1e1e; border-bottom: 1px dotted #666;}

.bg_pad{ padding: 25px 0; }

.bg_kakumaru_box{ background-color: #fff; border-radius: 30px; width: 95%!important; margin: 50px 0 auto; padding: 50px;}
.bg_kakumaru_box_mini{ background-color: #fff; border-radius: 20px; width: 96%!important; margin:  auto!important; padding: 10px 0;}
@media screen and (max-width: 599px){
	.bg_kakumaru_box{ padding: 30px 20px!important; border-radius: 10px;}
}
.borderB{ border-bottom: 2px solid #fff!important; } /* 区切りに */

.circle{ }
@media screen and (max-width: 767px) {
	.circle{
		width: 90%;
		height: auto;
		margin:auto;
		border-radius: 50%;
		background: #f9f9f9;/*背景色 fffde7*/
	}
}
.bg_dot{
	background-color: #f6f6f6;
	background-image:
		radial-gradient(#ececec 20%, transparent 20%),
		radial-gradient(#ececec 20%, transparent 20%);
	background-size: 10px 10px;
	background-position: 0 0, 5px 5px;
}
/* ------------------------------------
 text-color
 -------------------------------------- */
.txMainColor{ color: #0071b9!important; }	/* イメージカラー（メインカラー） */
.txRed{ color: red; }
.txBK{ color: #000!important; }
.txBlack{ color: #404040; }
.txWhite{ color: #f2f2f2!important; }
.under_y{
	background: linear-gradient(transparent 40%, #ffff66 40%);
}
.txBold{ font-weight: bold!important; }
/* 文字の上に点 */
.dots {
	font-size: 100%;
	-webkit-text-emphasis: filled;
	text-emphasis: filled;
}
.under_line{ text-decoration: underline; }

/* ------------------------------------
 画像
 -------------------------------------- */
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.forPC { display: block!important; }
.forMP { display: none!important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 767px) {
	.forPC { display: none !important; }
	.forMP { display: block !important; }
}
.imgFit{
	width: fit-content;
	object-fit: contain;
}
@media only screen and (max-width: 767px) {
	.imgFit{
		width: 96%;
	}
}

/* ------------------------------------
 文字装飾
 -------------------------------------- */
.kakumaru{
	background-color: #333;
	display: inline-block;
	padding: 0.2em 20px;
	margin-right: 20px;
	margin-bottom: 3px;
	border-radius: 1em;
	color: #fff;
}
@media screen and (max-width: 599px){
	.spSmall{
		font-size: 14px!important;
	}
}
/* ------------------------------------
 float
 -------------------------------------- */
.flL{ float: left; }
.flR{ float: right;}
.cls{
	clear: both!important;
	clear: left!important;
	clear: right!important;
}
/* micro clearfx */
.clearfix:before,
.clearfix:after{
	content: "";
	display: table;
}
.clearfix:after{ clear: both; clear: left!important;}
.clearfix{ zoom: 1; clear: right!important} /* For IE 6/7 */


/* ------------------------------------
 position
 -------------------------------------- */
.posC{ text-align: center; margin: 0 auto!important; }
.posR{ text-align: right!important; margin: 0 auto!important; }
/* --------------------------------
	font-awsome
   -------------------------------- */
i.pdf{
	color: red!important;
	padding-right: 10px;
}
i.aws{
	padding-right: 5px;
	color: #54bce8;
}
/* ------------------------------------
 改行 
 -------------------------------------- */
@media screen and (min-width: 768px){
	.br-pc { display:block; }
	.br-sp { display:none; }
}
@media screen and (max-width: 768px){
	.br-pc { display:none; }
	.br-sp { display:block; }
}
/* ------------------------------------
 indent
 -------------------------------------- */
.indent{
	width: 100%;
	margin: 0 auto;
	text-indent: 1em;
	padding: 0 0 20px 0;
}
.indent_dot{
	padding-left: 2em!important;
	margin-bottom: 0px!important;
	text-indent: -1em;
}
/* ------------------------------------
 picture
 -------------------------------------- */
.img-pc { display: block;  width: 100%;}
.img-sp { display: none;}
@media screen and (max-width:760px) {
	.img-pc { display: none; width: 100%; }
	.img-sp { display: block; width: 100%; }
}
/* --------------------------------
	装飾
   -------------------------------- */
p.mini{
	font-size: 95%!important;
	line-height: 150%;
	color: #333;
}
p.point{
	font-size: 18px;
	font-weight: bold;
}
p.sub{ font-size: 16px!important; line-height: 180%;}
p.thin{
	width: 90%!important;
	padding: 0 5%!important;
}
em.point, span.point{
	background-color: #fffacd;
	font-style: bold;
}
p.warning{
	font-size: 16px;
}
p.posL{
	text-align: left;
}
p.posC{
	text-align: center;
}
p.thin{
	font-size: 18px;
	width: 80%;
	margin: 40px auto;
	text-align: left;
}
p.thinC{
	font-size: 18px;
	width: 80%;
	margin: 40px auto;
	text-align: center;
}
p.tit{
	clear: left;
	clear: right;

	text-align: center;
	font-size: 28px;
	font-weight: bold;
	padding: 20px 0;
}
p.point{
	font-size: 20px;
	font-weight: bold;
}
p.lineheight160{
	line-height: 160%;
}
em.point{
	background-color: #fffacd;
	font-style: normal;
}
span{font-size: 80%;}
/* --------------------------------
	Link
   -------------------------------- */
.link-simple a,
.link-simple a:link{ color: #0166CC; font-weight: bold; }
.link-simple a:hover{ color: #0166CC; text-decoration: underline; }
/* ================================
			599px以下
   ================================ */
@media (max-width: 599px){
	p.thin{
		width: 96%!important;
		padding: 0 2%!important;
	}
}
/* --------------------------------
	HR
   -------------------------------- */
hr{
	height: 0;
	margin: 50px 0;
	padding: 0;
	border: 0;
	border-top: 1px dotted #bbb;
}
/* ================================
			599px以下
   ================================ */
@media (max-width: 769px){
	p.mini{
		font-size: 90%;
		line-height: 140%!important;
		color: #333;
	}
}

/* ------------------------------------
 widh
 -------------------------------------- */
/* width */
.w10per{ width: 10% !important; }
.w20per{ width: 20% !important; }
.w30per{ width: 30% !important; }
.w33per{ width: 33.3% !important; }
.w40per{ width: 40% !important; }
.w50per{ width: 50% !important; }
.w60per{ width: 60% !important; }
.w70per{ width: 70% !important; }
.w80per{ width: 80% !important; }
.w90per{ width: 90% !important; }
.wFull{ width: 100% !important; }
.wAuto{ width: auto !important; }

/* ------------------------------------
 margin / padding
 -------------------------------------- */
.spaceTB{ padding: 30px 0; }
/* margin-top */
.mt0{ margin-top: 0 !important; }
.mt10{ margin-top: 10px !important; }
.mt20{ margin-top: 20px !important; }
.mt30{ margin-top: 30px !important; }
.mt40{ margin-top: 40px !important; }
.mt50{ margin-top: 50px !important; }
.mt60{ margin-top: 60px !important; }
.mt80{ margin-top: 80px !important; }
.mt100{ margin-top: 100px !important; }
.mt120{ margin-top: 120px !important; }
/* margin-right */
.mr0{ margin-right: 0 !important; }
.mr10{ margin-right: 10px !important; }
.mr50{ margin-right: 50px !important; }
.mr80{ margin-right: 80px !important; }
.mr100{ margin-right: 100px !important; }
/* margin-bottom */
.mb0{ margin-bottom: 0 !important; }
.mb10{ margin-bottom: 10px !important; }
.mb20{ margin-bottom: 20px !important; }
.mb30{ margin-bottom: 30px !important; }
.mb40{ margin-bottom: 40px !important; }
.mb50{ margin-bottom: 50px !important; }
.mb60{ margin-bottom: 60px !important; }
.mb80{ margin-bottom: 80px !important; }
.mb100{ margin-bottom: 100px !important; }
.mb120{ margin-bottom: 120px !important; }
/* margin-left */
.ml0{ margin-left: 0 !important; }
.ml10{ margin-left: 10px !important; }
.ml50{ margin-left: 50px !important; }
.ml80{ margin-left: 80px !important; }
.ml100{ margin-left: 100px !important; }

/* padding-top */
.pt0{ padding-top: 0 !important; }
.pt10{ padding-top: 10px !important; }
.pt20{ padding-top: 20px !important; }
.pt30{ padding-top: 30px !important; }
.pt40{ padding-top: 40px !important; }
.pt50{ padding-top: 50px !important; }
.pt60{ padding-top: 60px !important; }
.pt70{ padding-top: 70px !important; }
.pt80{ padding-top: 80px !important; }
.pt90{ padding-top: 90px !important; }
.pt100{ padding-top: 100px !important; }
/* padding-right */
.pr0{ padding-right: 0 !important; }
.pr10{ padding-right: 10px !important; }
.pr20{ padding-right: 20px !important; }
.pr30{ padding-right: 30px !important; }
.pr40{ padding-right: 40px !important; }
.pr50{ padding-right: 50px !important; }
.pr60{ padding-right: 60px !important; }
.pr70{ padding-right: 70px !important; }
.pr80{ padding-right: 80px !important; }
.pr90{ padding-right: 90px !important; }
.pr100 { padding-right: 100px !important; }
/* padding-bottom */
.pb0 { padding-bottom: 0 !important; }
.pb10{ padding-bottom: 10px !important; }
.pb20{ padding-bottom: 20px !important; }
.pb30{ padding-bottom: 30px !important; }
.pb40{ padding-bottom: 40px !important; }
.pb50{ padding-bottom: 50px !important; }
.pb60{ padding-bottom: 60px !important; }
.pb70{ padding-bottom: 70px !important; }
.pb80{ padding-bottom: 80px !important; }
.pb90{ padding-bottom: 90px !important; }
.pb100{ padding-bottom: 100px !important; }
/* padding-left */
.pl0 { padding-left: 0 !important; }
.pl10{ padding-left: 10px !important; }
.pl20{ padding-left: 20px !important; }
.pl30{ padding-left: 30px !important; }
.pl40{ padding-left: 40px !important; }
.pl50{ padding-left: 50px !important; }
.pl60{ padding-left: 60px !important; }
.pl70{ padding-left: 70px !important; }
.pl80{ padding-left: 80px !important; }
.pl90{ padding-left: 90px !important; }
.pl100{ padding-left: 100px !important; }
/* padding left and right */
.plr20{ padding-left: 20px!important; padding-right: 20px!important; }
/* padding all */
.pall5{ padding: 5px!important; }
.pall10{ padding: 10px!important; }
.pall15{ padding: 15px!important; }
.pall20{ padding: 20px!important; }

/* ====================================
 Print
 ====================================== */
@media print {
	body {
		min-width: 1200px;
	}
}
