@charset "utf-8";

/* bootstrap.css基本の打消し（同じclass名での書き換え）
---------------------------------------------------- */
body{ margin:0px; padding:0px}

.navbar {
  margin-bottom:0px;
  border:none;
	}
	
.navbar-brand {
  float:none;
  padding: 0px;
  line-height: 0px;
	}	

.form-control {
  height: auto;
  padding: 14px;  
	}

textarea.form-control {
  height:150px;
  width:100%;
	}

.btn i{ margin-right:5px;}
@media (min-width: 768px) {.btn{ padding:10px;}}
/*
.table-striped > tbody > tr:nth-of-type(odd) { background-color: #eee8e0;}
.table{ margin-bottom:30px}
.table th{ width:30%}
*/
@media (min-width: 768px) {.btn-group-vertical a{ padding-top:15px;padding-bottom:15px}}

/* 全体構造
---------------------------------------------------- */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	}

.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
	}

.clearfix {
    zoom:1;/*for IE 5.5-7*/
	overflow:hidden;
	}

* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
	}

.clear{clear:both;}

img{border:none;}

a {
	outline:none;
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	}

hr {
    display:block;
    height:1px;
    border-top:1px dotted #333;
    margin:0;
    padding:0;
	margin-bottom:20px
	}

body{
	font-size:95%;/* 基本のフォントサイズ */
	line-height:1.7em;/* 基本の行間 */
	font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#333;
	overflow-x: hidden;
	background: #fff;
	}

/* link
---------------------------------------------------- */
a:link,a:visited,a:hover,a:active{text-decoration:none; color:#333}
.imglink a:hover img{
    opacity: 0.6;
    transition: all 0.6s ease 0s;
    -webkit-transition: 0.6s ease-in;
    filter: alpha(opacity=60);
	}

/* pagetop
---------------------------------------------------- */
#pagetop {position: fixed; bottom:20px; right:10px; z-index:100;}

/*共通
---------------------------------------------------*/
.mb05{margin-bottom: 5px;}
.mb10{margin-bottom: 10px;}
.mb20{margin-bottom: 20px;}
.mb30{margin-bottom: 30px;}
.mb40{margin-bottom: 40px;}
.mt5{margin-top: 5px;}
.mt10{margin-top: 10px;}
.mt20{margin-top: 20px;}
.mt30{margin-top: 30px;}
.mt40{margin-top: 40px;}
.mt50{margin-top: 50px;}
.mr6{margin-right: 6px;}

/* css
---------------------------------------------------*/
.inner{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
.bg1{
	background: #f9f9f9;
	padding: 20px 0px;
}

/* header
---------------------------------------------------*/
header .header_in {
	padding: 5px 0px 5px;
	width:100%;
}
.logo{
	margin: 10px 5px 10px 5px;
}
.left p{
	font-size: 11px;
	margin: 5px 0px 5px;
	padding: 0px 5px;
	line-height: 160%;
}
.right p.txt{
	background: #13b4f2;
	padding: 5px 0px;
	color: #fff;
	line-height: 160%;
	margin: 5px auto;
	text-align: center;
	font-size: 14px;
}

/*contents
---------------------------------------------------*/

/*main画像
---------------------------------------------------*/
/*.top_scroll{ height:400px;}*/
.top_scroll_inr{
	width:100%;
/*	width:768px; */
	margin:0px auto;
    display: block;
    height: auto;
}
.mainimage_text{
	width: 100%;
	height: auto;
}
@media (max-width:768px){
	.top_scroll{ height:400px;}
}
@media (max-width:414px){
	.top_scroll{ height:216px;}
}
/*top
----------------------------------------*/

.topbox1{width: 100%;}
.topbox2{background: #333; padding:20px 0px 40px; }
.topbox2 .txt{
	color: #fff;
	font-size: 16px;
	text-align: center;
	line-height: 160%;
}
.topbox2 .txt2{
	display:block;
	font-size: 18px;
	font-weight: bold;
}
.topbox3{
	width: 100%;
	background: url(../images/top_bg2.jpg) no-repeat left center #72b2f9 / cover;
	height: auto;
	padding: 50px 0px;
}
.h3top3{
	font-size: 20px;
	font-weight: bold;
	color: #fff;
	line-height: 160%;
	margin: 10px 0px;
	padding: 0px 10px;
	text-shadow: 0px 0px 10px #2a73c4;
}
.txtbox{
	width: 100%;
	margin: 0px auto;
}
.txtbox p{
	font-size: 16px;
	font-weight: bold;
	line-height: 160%;
	margin: 0px 0px 10px;
	padding: 0px 10px;
}
.categorybox{
	float: left;
	width: 32%;
	height: auto;
	margin: 0px 0px 0px 1%;
}
.category_txt{
	line-height: 160%;
	background:#02aff1;
	color: #fff;
	font-size: 24px;
	text-align: center;
}
.arealist{
	width: 95%;
	margin: 20px auto;
}
.arealist dt{
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	color: #02aff1;
	margin-bottom: 15px;
	padding-bottom: 10px;
	border-bottom: 3px #dfdfdf solid;
}
.arealist dd{line-height: 160%;}
.arealist dd p{margin-bottom: 10; font-weight: bold;}
.arealist dd p .title01{display: block; font-weight: bold;}

.news_t{
	text-align: center;
	margin: 0px auto 10px auto;
}
.news{
	width: 100%;
	margin: 0px auto 40px;
	padding: 20px 0px 10px;
}
.newsbox{
	width: 98%;
	margin: 0px auto;
	height: 150px;
	overflow-y: scroll;
	overflow-x: hidden;
	font-size: 16px;
	
}
.tbl-new{
	width: 100%;
	margin: 20px auto;
	padding: 0px;
}
.tbl-new th{
	width: 20%;
	font-size: 15px;
	font-weight: bold;
	text-align: left;
	line-height: 160%;
	margin: 0px;
	padding: 5px 0px;
	vertical-align: top;
	white-space: nowrap;
}
.tbl-new td{
	font-size: 15px;
	font-weight: normal;
	text-align: left;
	line-height: 160%;
	margin: 0px;
	padding:  0px 10px;
}

@media (max-width: 768px) {
	.tbl-new tr, .tbl-new th, .tbl-new td {
		display: block;
	}
	.tbl-new th{
		width: 100%;
		font-size: 15px;
		font-weight: bold;
		text-align: left;
		line-height: 160%;
		margin: 0px;
		padding: 5px 10px 0px;
		vertical-align: top;
		white-space: nowrap;
	}
}


/* f_navi
---------------------------------------------------- */
.footer_nav{
	width: 100%;
	margin: 0px auto;
	padding: 0px;
	text-align: center;
	background: #02aff1;
}
.fnavi{
	width: 100%;
	margin: 0px auto;
	padding: 0px;
	text-align: left;
	list-style: none;
	border-top: solid 1px #ccc;
}
.fnavi li{
	display: block;
	font-size: 12px;
	line-height: 100%;
	margin: 0px auto;
	padding: 0px;
}
.fnavi li+li{
	border-left: solid 0px #333;
}
.fnavi li a{
	display: block;
	color: #fff;
	text-decoration: none;
	padding: 15px 0px 15px 20px;
	border-bottom: solid 1px #fff;
}
.fnavi li a:hover{
	color: #fff;
	text-decoration: none;
}	
.fnavi li a:after {
	float: right;
	font-family: FontAwesome;
	content: '\f0da';
	color: #fff;
	margin-right: 20px;
}

/*footer
---------------------------------------------------*/
.footer_in {
	width:100%;
	background:#f9f9f9;
	padding:20px 0px;
}
.fleft {
	padding: 0px 10px;
}
.flogo{
	margin-bottom: 10px;
	text-align: center;
}
.address{
	font-size: 15px;
	font-weight: normal;
	text-align: center;
}
.gmap{
	background: #333;
	padding: 0px 10px;
	color: #fff;
	font-size: 12px;
	line-height: 160%;
	margin: 0px 0px 0px 6px;
}
.gmap a{
	text-decoration: none;
	color: #fff;
}
.fright {
	width: 100%;
	text-align:center;
	padding: 0px;
}
.fright_txt{
	background: #e0e0e0;
	text-align: center;
	line-height: 160%;
	font-size: 15px;
	padding: 2px 0px;
	margin: 0px 0px 5px;
}
.h4tel{
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	margin: 0px;
	padding: 10px 0px;
}
.copy{
	font-size: 12px;
	text-align: center;
}
/* gnavi
-----------------------------------*/
.menu-trigger,
.menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
  cursor: pointer;
}
.menu{
	position: absolute;
	z-index: 1;
	top: 10px;
	right: 10px;
	display: block;
}
.menu-trigger {
	position: relative;
	width: 50px;
	height: 50px;
	background: #02aff1;
	z-index: 2;
	border: solid 1px #fff;
}
.menu-trigger span {
  position: absolute;
  background: #fff;
  width: 30px;
  height: 2px;
  left: 0;
  right: 0;
  margin: auto;
}
.menu-trigger span:nth-of-type(1) {
  top: 14px;
}
.menu-trigger span:nth-of-type(2) {
  top: 0;
  bottom: 0;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 14px;
}

.menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(9px) rotate(-45deg);
  transform: translateY(9px) rotate(-45deg);
}
.menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-9px) rotate(45deg);
  transform: translateY(-9px) rotate(45deg);
}

@media(max-width:414px){
	.menu{
		position: absolute;
		z-index: 1;
		top: 5px;
		right: 5px;
		display: block;
	}
	.menu-trigger {
		  position: relative;
		  width: 40px;
		  height: 40px;
		  background: #02aff1;
		  z-index: 2;
		  border: solid 1px #fff;
	}
	.menu-trigger span {
	  position: absolute;
	  background: #fff;
	  width: 20px;
	  height: 2px;
	  left: 0;
	  right: 0;
	  margin: auto;
	}
	.menu-trigger span:nth-of-type(1) {
	  top: 9px;
	}
	.menu-trigger span:nth-of-type(2) {
	  top: 0;
	  bottom: 0;
	}
	.menu-trigger span:nth-of-type(3) {
	  bottom: 9px;
	}
}

nav {
  display: none;
  position: absolute;
  top: 0;
  background: rgba(2,175,241,0.95);
  width: 100%;
  height: auto;
	padding: 50px 0px;
}
.list {
  padding: 0px 0px 20px;
	list-style: none;
  border-top: 1px solid #fff;
}
.list li {
  border-bottom: 1px solid #fff;
}
.list li a {
  display: block;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  color: #fff;
  padding: 15px 0px;
}
.list li a:hover {
  text-decoration: none;
  font-size: 16px;
  color: #ffcc00;
}
._on{
  color: #ffcc00;
}
.gnavi_tel{
	font-size: 22px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	margin: 0px;
	padding: 0px;
	line-height: 160%;
}
.gnavi_tel a{
	color: #fff;
	text-decoration: none;
}

/* contents
------------------------------------------------------*/
.subimg{
	width: 100%;
	margin: 0px auto;
	padding: 20px 0px;
	background: url("../images/subimg.jpg") no-repeat center center / cover;
}
.h2subtitle{
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
	font-size: 28px;
	font-weight: bold;
	text-align: center;
	color: #333;
	margin: 0px;
	padding: 20px 0px;
	background: rgba(255,255,255,0.85);
}
.contents{
	width: 95%;
	margin: 0px auto;
	padding: 20px 0px;
}
.title01{
	background:#02aff1;
	color:#fff;
	font-weight:bold;
	padding:10px ;
	border: 1px solid #eee;
	margin: 0px 0px 10px;
	font-size: 20px;
}
.title02{
	font-weight: bold;
	text-align: center;
	font-size: 26px;
	color: #02aff1;
	margin: 10px 0px;
}
.tbl-com{
	width: 100%;
	margin: 20px auto;
	border-top: solid 1px #ddd;
	border-left: solid 1px #ddd;
}
.tbl-com th{
	width: 25%;
	font-size: 15px;
	background: #f9f9f9;
	text-align: left;
	padding: 10px;
	border-bottom: solid 1px #ddd;
	border-right: solid 1px #ddd;
	vertical-align: top;
	white-space: nowrap;
}
.tbl-com td{
	font-size: 15px;
	text-align: left;
	line-height: 180%;
	padding: 10px;
	border-bottom: solid 1px #ddd;
	border-right: solid 1px #ddd;
}
.td_ol{
	margin: 0px 0px 0px 20px;
	padding: 0px;
	list-style: decimal;
	font-size: 15px;
}
.td_ul{
	margin: 0px 0px 0px 20px;
	padding: 0px;
	list-style:disc; 
	font-size: 15px;
}
.td_lf{
	float: left;
	margin: 0px;
	width: 40%;
}
@media (max-width: 768px) {
	.tbl-com tr, .tbl-com th, .tbl-com td {
		display: block;
	}
	.tbl-com th{
		width: 100%;
		font-size: 15px;
		background: #f9f9f9;
		text-align: left;
		padding: 10px;
		border-bottom: solid 1px #ddd;
		border-right: solid 1px #ddd;
		vertical-align: top;
		white-space: nowrap;
	}
}


.business_bg{
	margin: 0px auto;
	padding: 10px 0px;
	background: url(../images/business_bg.jpg) center bottom no-repeat;
}
.h3biz{
	font-weight: bold;
	font-size: 18px;
	color: #02aff1;
	margin: 0px;
	padding: 10px 5px;
	text-align: left;
	line-height: 160%;
}
.txtbox_b{
	margin:0px auto;
}
.txtbox_b p{
	padding: 5px 10px;
	margin:0px 0px 10px;
	font-size: 14px;
	color: #000;
	text-shadow: 1px 1px 5px #fff;
}
.txtbox2_b{
	width: 80%;
	margin: 0px auto;
	background: #e1ecf4;
	padding: 10px 0px;
}
.txtbox2_b p{
	padding: 5px 10px;
	margin:0px;
	font-size: 14px;
	font-weight: bold;
}
.products_list li{
	float: left;
	width: 32%;
	margin: 0px 0% 20px 1%;
	list-style: none;
}
.products_list img{
	border: 1px solid #eee;
}
.title_p{
	font-size: 16px;
	font-weight: bold;
	margin: 5px 0px;
}
.comments{
	padding: 0px 5px;
	line-height: 140%;
}
@media (max-width:767px){
	.products_list li{
		float: none;
		width: 80%;
		margin: 0px auto 20px;
		list-style: none;
	}
	.products_list img{
		border: 1px solid #eee;
	}
	.title_p{
		font-size: 16px;
		font-weight: bold;
		margin: 5px 0px;
	}
	.comments{
		padding: 0px 5px;
		line-height: 140%;
	}
}

.servicebox{margin: 0px auto 20px;}
.h4ser{
	background: #02aff1;
	color: #fff;
	padding: 3px 15px 0px;
	font-weight: bold;
	font-size: 20px;
	line-height: 160%;
	margin: 0px 0px 10px;
	border-left: 7px solid #333;
}
.ser_lf{
	float: left;
	width: 65%;
	margin: 10px 1%;
}
.img_box{
	float: right;
	width: 30%;
	margin: 10px 1%; 
}
@media (max-width:767px){
	.h4ser{
		background: #02aff1;
		color: #fff;
		padding: 3px 15px 0px;
		font-weight: bold;
		font-size: 20px;
		line-height: 160%;
		margin: 0px 0px 10px;
		border-left: 7px solid #333;
	}
	.ser_lf{
		float: none;
		width: 90%;
		margin: 10px auto;
	}
	.img_box{
		float: none;
		width: 90%;
		margin: 10px auto; 
	}
}

.info p{
	text-align: center;
	font-size: 14px;
	line-height: 200%;
	font-weight: bold;
}
.blk{
	color: #fff;
	background: #333;
	padding: 2px 10px;
	margin: 0px 6px 5px 10px;
}
.contact{
	width: 100%;
	margin: 20px auto 10px;
}
.contact p{
	font-size: 15px;
	text-align: left;
	line-height: 160%;
	margin: 0px 0px 10px;
	padding: 0px 5px;
}
/* form
---------------*/
.contact_form{
	width: 100%;
	margin: 0px auto;
	padding: 0px;
}
input[type="submit"]{
    font-size: 14px;
    font-weight: normal;
    padding: 10px 20px;
    background-color: #02aff1;
    color: #fff;
    border-style: none;
}
input[type="button"] {
    font-size: 14px;
    font-weight: normal;
    padding: 10px 20px;
    background-color: #02aff1;
    color: #fff;
    border-style: none;
}
input:hover[type="submit"]{
    background-color: #0087bb;
    color: #fff;
}
input:hover[type="button"] {
    background-color: #0087bb;
    color: #fff;
}
input, select {
	vertical-align:middle;
	font-family:"ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", "ＭＳ Ｐゴシック", Meiryo, sans-serif;
}
.form-s{width:70px;}
.form-m{width:150px;}
.form-l{width:300px;}
.form100{width:99%;}
.form-h{height:80px;}
input[type="checkbox"],input[type="radio"]{vertical-align:middle;}
input[type="text"],select{border:1px solid #ccc;}
input:focus[type="text"]{border:1px solid #06c;}
input {
	padding-top: 10px;
	padding-bottom: 10px;
}
input[type="text"]{
	padding: 10px 5px;
} 
input::-webkit-input-placeholder{
	line-height: 140%;
	padding-left: 5px;
}
textarea {
	width: 99%;
	padding: 10px;
}
/*
textarea::-webkit-textarea-placeholder{
	line-height: 200%;
}*/
.needinput{background-color:#fee;border:1px solid #ccc}
.form70 {
	width: 70%;
}
.form80 {
	width: 80%;
}
.form60 {
	width: 60%;
}
.form40 {
	width: 40%;
}
.tbl-con {
	width: 100%;
	margin: 20px auto;
	border-top: solid 2px #ffffff;
	border-left: solid 2px #ffffff;
}
.tbl-con th {
	font-size: 14px;
	font-weight: bold;
	line-height: 150%;
	color: #333333;
	text-align: left;
	vertical-align: top;
	width: 240px;
	margin: 0px;
	padding: 10px 5px 10px 20px;
	background-color: #dddddd;
	white-space: nowrap;
	border-bottom: solid 2px #ffffff;
	border-right: solid 2px #ffffff;
}
.tbl-con td {
	font-size: 14px;
	font-weight: normal;
	line-height: 150%;
	color: #333333;
	text-align: left;
	margin: 0px;
	padding: 10px 20px 10px 20px;
	background-color: #f9f9f9;
	border-bottom: solid 2px #ffffff;
	border-right: solid 2px #ffffff;
}
@media (max-width: 768px) {
	.tbl-con tr, .tbl-con th, .tbl-con td {
		display: block;
	}
	.tbl-con th {
		font-size: 14px;
		font-weight: bold;
		line-height: 150%;
		color: #333333;
		text-align: left;
		vertical-align: top;
		width: 100%;
		margin: 0px;
		padding: 10px 5px 10px 20px;
		background-color: #dddddd;
		white-space: nowrap;
		border-bottom: solid 2px #ffffff;
		border-right: solid 2px #ffffff;
	}
} 
.kome {
	background-image: url(../images/kome.png) ;
	background-repeat: no-repeat;
	background-position: center right;
}
.kome2 {
	background-image: url(../images/kome2.png) ;
	background-repeat: no-repeat;
	background-position: center right;
}
.h4pp {
	font-size: 15px;
	font-weight: bold;
	line-height: 100%;
	color: #333333;
	text-align: left;
	padding: 0px 5px;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 10px;
	border-left-width: 5px;
	border-left-style: solid;
	border-left-color: #02aff1;
}
.p_box {
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	overflow: auto;
	height: 300px;
	width: 100%;
	border: 1px solid #666;
	background-color: #f9f9f9;
}
.std  {
	width: 100%;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding: 10px 0px 10px 0px;
	background: #fff;
}
.std p{
		font-size: 14px;
		text-align: left;
		line-height: 160%;
		margin: 0px;
		padding: 5px 10px;
}
.std ol {
	padding: 0px;
	margin-top: 20px;
	margin-right: 20px;
	margin-bottom: 10px;
	margin-left: 45px;
	list-style-type: decimal;
}
.std ul {
	padding: 0px;
	margin-top: 20px;
	margin-right: 20px;
	margin-bottom: 10px;
	margin-left: 45px;
	list-style-type: none;
}
.std li {
	font-size: 14px;
	line-height: 160%;
	color: #333333;
	text-align: left;
	margin: 0px;
	padding: 5px 10px 5px 0px;
}
.no_br{
	display: block;
}
@media(max-width:414px){
	.no_br{
		display: none;
	}
}
.yes_br{
	display: none;
}
@media(max-width:414px){
	.yes_br{
		display: block;
	}
}

