@charset "utf-8";

/* form
----------------------------------------------------------*/

body, form {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	vertical-align:baseline;
	background:transparent;
}

select, input, textarea, button { 
	vertical-align:middle; 
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif; 
	position:relative; 
	margin: 0 4px 2px 0;
	*margin-right:3px; 
	top:-1px;  
}

input { 
	height: 16px; 
	line-height: 16px; 
}

button, input[type="button"] {
	overflow:visible; 
	height:22px;
	padding:0 3px;
}

select { 
	height: 20px; 
	line-height: 20px;
}

input[type="checkbox"],
input[type="radio"] { 
	border:none; 
	top:-2px;
	top:0\9;
	margin-right:2px; 
	margin-right: 0\9; 
}

input.r_box {
   width: 1.3em;
   height: 1.3em;
}


.d_form{
	text-align:center;
	padding:5px 0px;
}

.form01{
	width:75%;
	margin: 30px auto;
	text-align: center;
	border-radius: 5px;
	background: #fff;
	padding: 20px 0;
	box-shadow: 1px 1px 1px 1px #666;
}

.form01 dt{
  display: block;
  padding:5px 0;
  text-align:center;
}

.form01 dd{
  width:100%;
  display: block;
  text-align:center;  
}

.form-item {
  width: 100%;
}

.form-item input {
  width: 75%;
  border: none;
  border: 1px solid #333;
  color: #333;
  height: 30px;
  transition: border-color 0.3s;
  border-radius: 3px;
}

.form01 p {
text-align: center;
padding: 30px 0;
}



/* ▼IE10・IE11用 */
:-ms-input-placeholder {
   color: #AAAAAA;
}

/* ▼Chrome・Safari・Opera用(※Edgeにも使える) */
::-webkit-input-placeholder {
   color: #AAAAAA;
}

/* ▼Firefox18以前用 */
:-moz-placeholder {
   color: #AAAAAA;
}
/* ▼Firefox19以上用 */
::-moz-placeholder {
   color: #AAAAAA; opacity: 1;
}

/* ▼CSS標準(予定)の記述 */
:placeholder-shown {
   color: #AAAAAA;
}

.form01{
	width:75%;
	margin: 30px auto;
	text-align: center;
	border-radius: 5px;
	background: #fff;
	padding: 20px 0;
	box-shadow: 1px 1px 1px 1px #666;
	box-sizing:border-box;
}

.form01 dt{
  display: block;
  padding:5px 0;
  text-align:center;
  
}

.form01 dd{
  width:100%;
  display: block;
  text-align:center;
  margin-bottom:10px; 
}

.form02{
	width:750px;
	margin: 15px auto;
	text-align: center;
	box-sizing:border-box;
}


form select{
	width:90%;
	max-width : 90%;
	font-size : 100%;
	font-family : inherit;
	height : 2.5em;
	box-sizing:border-box;
}

input[type="text"]{
	width:90%;
	max-width : 90%;
	font-size : 100%;
	font-family :inherit;
	height : 2.5em;
	padding : 2px 2%;
	box-sizing:border-box;
}

input[type="radio"],input[type="checkbox"]{
  position: relative;
  top: -2px;
	margin-right: 5px;
}

table textarea,
table input[type="text"],
table input[type="password"] {
  border: 1px solid #A6A1A1;
  outline: 0;
}

table input[type="text"]:focus,
table input[type="password"]:focus {
  	 border : 1px solid #55ccff;
 	 outline: 0;
	 box-shadow : 0px 0px 5px #55ccff;
}

/* box_foam */
form.box_form{
	width:100%;
	margin: 30px auto;
	border-radius: 5px;
	/*background: #fff;*/
	padding: 20px 0;
	box-sizing:border-box;
}



form.button_form,
form.box_form{
	margin:15px auto;
	margin-bottom:15px;
	box-sizing:border-box;
}

form.box_form input[type="password"],
form.box_form input[type="time"],
form.box_form input[type="text"],
form.box_form input[type="email"],
form.box_form input[type="tel"],
form.box_form input[type="fax"],
form.box_form input[type="datetime-local"],
form.box_form input[type=number]{
	max-width : 90%;
	height : 2.5em;
	padding : 2px 2%;
	border : 1px solid #ccc;
	border-radius : 3px;
	background : #fafafa;
	-webkit-appearance : none;
	font-size : 100%;
	font-family : inherit;
}

form.box_form input[type="password"]:focus,
form.box_form input[type="time"]:focus,
form.box_form input[type="text"]:focus,
form.box_form input[type="email"]:focus,
form.box_form input[type="tel"]:focus,
form.box_form input[type="fax"]:focus,
form.box_form input[type="datetime-local"]:focus,
form.box_form textarea:focus{
	box-shadow : 0px 0px 5px #55ccff;
	border : 1px solid #55ccff;
	background : #ffffff;
}

form.box_form ul li input[type="checkbox"]{
	margin-right : 10px;
	margin-top : 7px;
}

form.box_form ul li input[type="radio"]{
	margin-right : 10px;
}

form.box_form li:first-child input[type="radio"],
form.box_form li:first-child input[type="checkbox"]{
	margin-top : 0px;
}

form.box_form input[type="text"],
form.box_form input[type="email"]{
	width:90%;

}

form.box_form ul{
	list-style-type : none;
	display:table;
}

form.box_form ul li{
	list-style-type : none;
	display:table-cell;
	vertical-align:middle;
}

form.box_form ul li label:hover{
	cursor : pointer;
}

span.requirement {
	display: inline !important;
	color: #CC0000 !important;
	font-size:80%;
}

form.box_form input[type=file]{
	max-width : 90%;
	height : 2em;
	padding : 2px 2%;
	font-size : 100%;
	font-family : inherit;
}

form.box_form select{
	max-width : 300px;
	font-size : 100%;
	font-family : inherit;
}

form.box_form textarea{
	display : block;
	width : 90%;
	height : 150px;
	padding :2px;
	resize : vertical;
	border : 1px solid #cccccc;
	border-radius : 3px;
	background : #fafafa;
	-webkit-appearance : none;
	font-size : 100%;
	font-family : inherit;
}

form.box_form textarea.edit_box{
	display : block;
	width : 90%;
	height : 750px;
	padding :2px;
	resize : vertical;
	border : 1px solid #cccccc;
	border-radius : 3px;
	background : #fafafa;
	-webkit-appearance : none;
	font-size : 100%;
	font-family : inherit;
	margin: 0 auto;
}

/* kousa7 radio
----------------------------------------------------------*/

.inline-radio {
  display: -webkit-box;
  display: flex;
  border-radius: 3px;
  overflow: hidden;
  border: 1px solid #b6b6b6;
}
.inline-radio div {
  position: relative;
  -webkit-box-flex: 1;
  flex: 1;
}
.inline-radio input {
  width: 100%;
  height: 40px;
  /* opacity: 0; */
}
.inline-radio label {
  position: absolute;
  top: 0;
  left: 0;
  color: #b6b6b6;
  width: 100%;
  height: 100%;
  background: #fff;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  pointer-events: none;
  border-right: 1px solid #b6b6b6;
}
.inline-radio div:last-child label {
  border-right: 0;
}
.inline-radio input:checked + label {
  background: #d81b60;
  font-weight: bold;
  color: #fff;
}



/* collar
----------------------------------------------------------*/
.BC-B01{background:#25a4b7; color:#fff;}
.BC-B02{background:#6276b5; color:#fff;}
.BC-B03{background:#1d4293; color:#fff;}
.BC-B04{background:#b2bfe1; color:#fff;}
.BC-G01{background:#6aa43e; color:#fff;}

.BC-K01{background:#CC7000; color:#fff;}
.BC-K02{background:#005CCC; color:#fff;}
.BC-K03{background:#CC005C; color:#fff;}
.BC-K04{background:#999; color:#fff;}


/* margin
----------------------------------------------------------*/
/* Top */
.MG-T0 { margin-top: 0 !important; }
.MG-T5 { margin-top: 5px !important; }
.MG-T10 { margin-top: 10px !important; }
.MG-T15 { margin-top: 15px !important; }
.MG-T20 { margin-top: 20px !important; }
.MG-T25 { margin-top: 25px !important; }
.MG-T30 { margin-top: 30px !important; }
/* Bottom */
.MG-B0 { margin-bottom: 0 !important; }
.MG-B5 { margin-bottom: 5px !important; }
.MG-B10 { margin-bottom: 10px !important; }
.MG-B15 { margin-bottom: 15px !important; }
.MG-B20 { margin-bottom: 20px !important; }
.MG-B25 { margin-bottom: 25px !important; }
.MG-B30 { margin-bottom: 30px !important; }

/* padding
----------------------------------------------------------*/
/* Left */
.PD-L5 { padding-left: 5px !important; }
.PD-L10 { padding-left: 10px !important; }
.PD-L15 { padding-left: 15px !important; }
.PD-L20 { padding-left: 20px !important; }
.PD-L25 { padding-left: 25px !important; }
.PD-L30 { padding-left: 30px !important; }
/* Right */
.PD-R5 { padding-right: 5px !important; }
.PD-R10 { padding-right: 10px !important; }
.PD-R15 { padding-right: 15px !important; }
.PD-R20 { padding-right: 20px !important; }
.PD-R25 { padding-right: 25px !important; }

/* fontsize
----------------------------------------------------------*/
.FS_SL{font-size: 90%;}
.FS_SM{font-size: 80%;}
.FS_SS{font-size: 70%;}


/* width
----------------------------------------------------------*/
form.box_form input[type="text"].IW30{
	width:30%;

}
form.box_form input[type="text"].IW40{
	width:40%;
}

form.box_form input[type="text"].IW50{
	width:50%;
}



/*================================================
 *  タブレット向けデザイン
 ================================================*/
/* スクロールバーを考慮して20px大きいサイズで切り替え */
@media screen and (max-width:979px) {
/* box_foam */
.form01{
	width:100%;
	margin: 15px auto;
	padding: 0px;
	box-sizing:border-box;

}

.form02{
	width:100%;
	margin: 15px auto;
	padding: 0px;
	box-sizing:border-box;
}

}

/*================================================
 *  スマートフォン向けデザイン
 ================================================*/
@media screen and (max-width:767px) {

form.box_form input[type="text"].IW30{
	width:80%;

}
form.box_form input[type="text"].IW40{
	width:80%;
}

form.box_form input[type="text"].IW50{
	width:80%;
}

/* box_foam */
form.box_form ul{
	list-style-type : none;
	display:block;
}

form.box_form ul li{
	list-style-type : none;
	display:block;
	vertical-align:middle;
}



form.box_form ul{
	list-style-type : none;
	display:block;
}

form.box_form ul li{
	list-style-type : none;
	display:block;
	vertical-align:middle;
}

form.box_form{
	width:100%;
	margin: 20px auto;
	border-radius: 5px;
	background: #fff;
	padding: 10px 0;
	box-sizing:border-box;
}


}


.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

/* news */

div.news01 {
	box-sizing:border-box;
	background:#1f5079;
	color:#fff;
	flex:1;
	border-radius: 10px;
	height: 100px;
	text-align: center;
	padding: 10px;
}

div.news02 {
	box-sizing:border-box;
	flex:3;
	height: 150px;
}

div.news01 p{
	font-size: 18px;
	/*font-weight: bold;*/
}

.news{
  box-sizing:border-box;
  width:100%;
}
.news li{
  border-bottom:1px dotted #000;
  list-style:none;
  padding:10px;
  width:100%;
}
.news a{
  color:#000;
  text-decoration:none;
}
span.categ{
	text-align: center;
	background:#2388b8;
	border-radius:3px;
	color:#fff;
	display:inline-block;
	margin-right:20px;
	padding: 2px 8px;
	font-size: 95%;
	width: 80px;
}

span.imp{
	background:#d10606;
}

span.time{
  display: inline-block;
  font-weight: bold;
  margin-right:40px;
}
.news p{
  color:#1c448d;
  display: inline-block;
  text-decoration:underline;
}
.new::after{
  content:"NEW";
  color: #d10606;
  font-size: 1.1rem;
  border: 1px solid #d10606;
  padding: 4px 8px;
  margin: 0 0 0 20px;
  display: inline-block;
  line-height: 1;
	font-size: 95%;
	width: 50px;
	text-align: center;
}