@charset "UTF-8";

/*******************************************************************************
 * 共通スタイルの設定
 *******************************************************************************/
body {
/*	position:			relative; */
/*	width:				100%; */
	font-size:			16px;
/*	font-family:		"Hiragino Kaku Gothic ProN","メイリオ", sans-serif; */
	font-family:		'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	line-height:		1.7;
/*	color:				#333; */
/*	min-width:			100%; */
}

/*************************************************
 * 余白設定
 *************************************************/
/***** 上 *****/
.mg-top--10 {
	margin-top:						-10px !important;
}
.mg-top-05 {
	margin-top:						5px !important;
}
.mg-top-10 {
	margin-top:						10px !important;
}
.mg-top-20 {
	margin-top:						20px !important;
}
.mg-top-30 {
	margin-top:						30px !important;
}
.mg-top-40 {
	margin-top:						40px !important;
}
.mg-top-50 {
	margin-top:						50px !important;
}
.mg-top-60 {
	margin-top:						60px !important;
}
/***** 下 *****/
.mg-bottom-05 {
	margin-bottom:					5px !important;
}
.mg-bottom-10 {
	margin-bottom:					10px !important;
}
.mg-bottom-20 {
	margin-bottom:					20px !important;
}
.mg-bottom-30 {
	margin-bottom:					30px !important;
}
.mg-bottom-40 {
	margin-bottom:					40px !important;
}
.mg-bottom-50 {
	margin-bottom:					50px !important;
}
.mg-bottom-60 {
	margin-bottom:					60px !important;
}
.mg-bottom-70 {
	margin-bottom:					70px !important;
}
/***** 右 *****/
.mg-right-05 {
	margin-right:					5px !important;
}
.mg-right-10 {
	margin-right:					10px !important;
}
/***** 左 *****/
.mg-left-10 {
	margin-left:					10px !important;
}
.mg-left-20 {
	margin-left:					20px !important;
}

.input-mg-left{
	margin-left:					150px !important;
}
@media only screen and (max-width:	800px) {
	.input-mg-left{
		margin-left:					20px !important;
	}
}

/***** 隙間なし *****/
.no-gutters {
	margin:0;
	padding:0;
}
/*************************************************
 * フォント
 *************************************************/
/***** フォントファミリー *****/
.font-type-01 {
	 font-family:					"Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
	 font-weight:					bold;
}
/***** フォントタイプ *****/
.fo-bold {
	font-weight:					bold;
}
/***** フォントカラー *****/
.fo-white {
	color:							#fff !important;
}
.fo-blur {
	color:							#1e50a2 !important;
}
.fo-green {
	color:							#2ac278 !important;
}
.fo-red {
	color:							#ed697c !important;
}
/***** フォントサイズ *****/
.fo-14 {
	font-size:						14px !important;
}
.fo-18 {
	font-size:						18px !important;
}
.fo-20 {
	font-size:						20px !important;
}
.fo-24 {
	font-size:						24px !important;
}
.fo-36 {
	font-size:						36px !important;
}
@media only screen and (max-width:	800px) {
	.fo-24 {
		font-size:					20px !important;
	}
	.fo-36 {
		font-size:					26px !important;
	}
}

/*************************************************
 * 背景色
 *************************************************/
.base-white {
	background:						#fff !important;
}
.base-white-1 {
	background:						#fefefe !important;
}
.base-gray {
	background:						#f3f3f3 !important;
}
.base-red {
	background:						#ed697c !important;
}
.base-green {
	background:						#2ac278 !important;
}
.base-blue {
	background:						#15bbde !important;
}
.base-yellow {
	background:						#decd15 !important;
}
.bg-gray {
	background:						#f3f3f3;
}


/*************************************************
 * リンク
 *************************************************/
a.underline {
	text-decoration:				underline;
}
a.underline:hover {
	text-decoration:				none;
}

/*************************************************
 * テキスト位置
 *************************************************/
.text-center {
	text-align:						center !important;
}
.text-right {
	text-align:						right !important;
}
.text-left {
	text-align:						left !important;
}
.text-top {
	vertical-align:					top !important;
}
.text-middle {
	vertical-align:					middle !important;
}
.text-bottom {
	vertical-align:					bottom !important;
}
.text-lc {
	text-align:						left;
}
.text-rc {
	text-align:						right;
}
.textnowrap {
	white-space:					nowrap;
}
@media only screen and (max-width:	800px) {
	.text-lc {
		text-align:					center;
	}
	.text-rc {
		text-align:					center;
	}
}

/*************************************************
 * 表示位置
 *************************************************/
.pos-rel {
	position:						relative !important;
}
/*消去*/
@media (max-width:	800px) {
	.no-disp-s {
		display:					none !important;
	}
}
@media (min-width:	801px) {
	.no-disp-l {
		display:					none !important;
	}
}

/*************************************************
 * 横幅設定
 *************************************************/
.width80{
	width:							80px;
}
.width100{
	width:							100px;
}
.width120{
	width:							120px;
}
.width140{
	width:							140px;
}
.width160{
	width:							160px;
}
.width180{
	width:							180px;
}
.width200{
	width:							200px;
}
.width300{
	width:							300px;
}
.width320{
	width:							320px;
}
.width340{
	width:							340px;
}
.width360{
	width:							360px;
}
.width380{
	width:							380px;
}
.width400{
	width:							400px;
}

/*************************************************
 * カラム垂直揃え
 *************************************************/
.row-center{
	text-align:						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;
}

.box {
	position: relative;
/*	height: 100px; */
/*	border: solid 1px black;*/
}

.bottom-text {
	position:						absolute;
	bottom:							0;
}

/*************************************************
 * gridのgutter調整
 *************************************************/
.row-0{
	margin-left:					0px;
	margin-right:					0px;

	> div{
		padding-right:				0px;
		padding-left:				0px;
	}
}
.row-10{
	margin-left:					-5px;
	margin-right:					-5px;

	> div{
		padding-right:				5px;
		padding-left:				5px;
	}
}
.row-20{
	margin-left:					-10px;
	margin-right:					-10px;

	> div{
		padding-right:				10px;
		padding-left:				10px;
	}
}
.row-30{
	margin-left:					-15px;
	margin-right:					-15px;

	> div{
		padding-right:				15px;
		padding-left:				15px;
	}
}
.row-40{
	margin-left:					-20px;
	margin-right:					-20px;

	> div{
		padding-right:				20px;
		padding-left:				20px;
	}
}

/*************************************************
 * 装飾系
 *************************************************/
.underline {
	border-bottom:					solid 1px black;
}

.underline.leftline {
	padding:						0.1em 0.2em;
/*	color: #494949; */
	background:						#ffe7e9;
	border-left:					solid 3px #de3a47;
	border-bottom:					solid 1px #de3a47;
}

.container.topline {
	border-top:						solid 5px #4653a2;
	border-bottom:					solid 5px #4653a2;
}

.indent {
	text-indent:					1em;
}

.input-padding {
	padding-top:					3px;
	padding-bottom:					3px;
}

/*************************************************
 * その他
 *************************************************/

img.logo {
	width:							48px;
}

h1{
	font-size:						28px;
}

/* 言語切替リンク */
.language {
	padding-top:					5px;
	padding-bottom:					5px;
}
/* ふきだし */
.balloon-right {
	position:						relative;
	display:						inline-block;
	margin:							1.5em 15px 1.5em 0;
	padding:						7px 10px;
	min-width:						120px;
	max-width:						100%;
	color:							#555;
	font-size:						16px;
	background:						#FFF;
	border:							solid 3px #555;
	box-sizing:						border-box;
	border-radius:					10px;
}

.balloon-right:before {
  content:							"";
  position:							absolute;
  top:								50%;
  right:							-23px;
  margin-top:						-12px;
  border:							12px solid transparent;
  border-left:						12px solid #FFF;
  z-index:							2;
}

.balloon-right:after {
  content:							"";
  position:							absolute;
  top:								50%;
  right:							-30px;
  margin-top:						-14px;
  border:							14px solid transparent;
  border-left:						14px solid #555;
  z-index:							1;
}

.balloon-right p {
  margin:							0;
  padding:							0;
}

/* 大きいチェックボックス */
.bigcheck {
	width:							24px;
	height:							24px;
	-moz-transform:					scale(1.4);
	-webkit-transform:				scale(1.4);
	transform:						scale(1.4);
}

/* 枠線なしテーブル */
.table-nobordered th,
.table-nobordered td {
  border:							none !important;
}

/* メインエリア */
.main {
	width:							100%;
	max-width:						1000px;
	min-width:						1000px;
}

/* コンテンツエリア */
.contents {
	margin-left:					10px !important;
	margin-right:					10px !important;
}

/* 入力エリア */
form {
	padding-left:					20px !important;
	padding-right:					20px !important;
}
/* ボタン */
button {
	padding-left:					20px !important;
	padding-right:					20px !important;
}
/*************************************************
 * style.cssから移動
 *************************************************/
.errmsg{
	color:							red;
}

.meiwidth5{
	width:							5%;
}
.meiwidth10{
	width:							10%;
}
.meiwidth15{
	width:							15%;
}
.meiwidth20{
	width:							20%;
}
.meiwidth30{
	width:							30%;
}
.meiwidth40{
	width:							40%;
}
.meiwidth45{
	width:							45%;
}
.meiwidth50{
	width:							50%;
}
.meiwidth55{
	width:							55%;
}
.meiwidth60{
	width:							60%;
}
.meiwidth70{
	width:							70%;
}

.rowspace{
	margin-top:5px;
}

.itembiko{
	color:#ff0000;
	padding-top:10px;
	border-top: 1px solid #ddd;
	width:100%;
	font-size:1.4rem;
}
/*************************************************
 * チャットボットアイコン
 *************************************************/
.boticon{
	position:fixed;
	right:30px;
	bottom:60px;
	transition:1s;
	opacity:0.7;
	widht:200px;
	z-index:999;
}
.boticon:hover{
	opacity:1;
}

.boticon a {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #555555;
	transition: 0.3s ease-in-out;
	font-weight: 600;
	border-radius: 10px;
	z-index:0;
	overflow: hidden;
	text-decoration: none;
	font-size: 24px;
	line-height: 34px;
	width: 75px;
	height: 80px;
	padding: 5px;
}

.boticon a:before {
	font-family: "Font Awesome 5 Free";
	left: 0px;
	border-radius: 10px;
	z-index: 2;
	line-height: 1;
	left:5px;
	position: absolute;
}

.boticon a:after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 0;
	display: block;
	transition: .3s;
	left:0;
}
.boticon a:hover:after {
	width: 100%;
	z-index: -1;
}

.boticon01 a	    { background: #F5F5C2; }
.boticon01 a:after  { background: #FFFFE0; }
.boticon01 a:before { background: #FFFFE0; content: url(../img/menu/menu6.png); }




@media only screen and (max-width:	480px) {
	.col-xs-9 {
	    width: 95%;
	}
	.h1, h1 {
	    font-size: 18px;
		line-height: 1.5;
	}
	.h3, h3 {
	    font-size: 18px;
		line-height: 1.5;
	}
	.btn {
	  font-size: 11px;
	}
	.input-mg-left{
		margin-left:					-10px !important;
	}
	.itembiko{
		font-size:1.0rem;
	}
	.container {
		padding-right: 0;
		padding-left: 0;
	}
}