@charset "UTF-8";

body {
	position: relative;
	counter-reset: number 0;
	font-family: メイリオ, Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: rgb(51, 51, 51);
}
a { text-decoration: none; color: inherit; }
p { line-height: 1.6; }

/*clearfix*/
.clearfix, .cf, .comment-respond { zoom: 1; }
.clearfix:before, .clearfix:after, .cf:before, .comment-respond:before, .cf:after, .comment-respond:after {
	content: "";
	display: table;
}
.clearfix:after, .cf:after, .comment-respond:after { clear: both; }
/*clearfix--end*/

a:hover > img { opacity: 0.5; }
a > img {
	transition: opacity 0.5s ease-out;
	-o-transition: opacity 0.5s ease-out; /* opera */
	-moz-transition: opacity 0.5s ease-out; /* firefox */
	-webkit-transition: opacity 0.5s ease-out; /* chrome, safari */
	-ms-transition: opacity 0.5s ease-out; /* ie */
}

.f25{font-size: 25px}
.mauto{ margin: 0 auto;}
.tal{text-align: left;}

/* ========= header ========= */
#header-top .btn-repair{
	display:inline-block;
	position:absolute;
	right:10px;
	top:10px;
	font-size:15px;
	font-weight:bold;
	}


#header-top .btn-repair a{display:flex;	align-items: center;padding:5px 20px;	transition: opacity 0.5s ease-out; border:solid 2px #347eba;	background-color: #009ce5;color: #fff;transition : 0.5s;

}
#header-top .btn-repair a:hover{
	transition : 0.5s;
	background-color: #369;
}


#header-top .btn-repair a i{font-size:30px; margin-right:10px;}


@media screen and (max-width: 768px) {
#header-top .btn-repair{
	right:60px;
	top:5px;
	font-size:12px;
	
	}
#header-top .btn-repair a{display:block; text-align:center;padding:3px 5px;}
#header-top .btn-repair a i{display:block; margin-right:0px; margin-bottom:3px;font-size:20px;}
}
header {
	/*max-width: 1300px;*/
	width: 100%;
	margin: 0 auto;
	position: relative;
}

header h1 {
	position: relative;
	margin-left: -7px;
}
header h1 img { zoom: 0.7;
margin-left: 0.5em;}
	header h1 a:hover > img { opacity: 1; }


/* nav */
#hd-menu-outside {
	/*max-width: 1300px;
	padding: 15px 0;*/
	width: 100%;
	margin: 0 auto;
	padding: 10px 0;
	background: #33d87e;
  z-index: -1;
}

.hd-menu {
	/*max-width: 980px;*/
	max-width: 1180px;
	width: 100%;
	margin: 0 auto;
	font-size: 1px;
  letter-spacing: -0.4em;
}
	.hd-menu li {
        	/*width: 16.6%;*/
		width: 14%;
		color: #fff;
		text-align: center;
		font-size: 1rem;
		display: inline-block;
		border-right: 1px solid #fff;
		box-sizing: border-box;
    letter-spacing: 0;
	}
		.hd-menu li:first-child { border-left: 1px solid #fff; }

.hd-menu li a {
	position: relative;
	display: block;
	/*padding: 5px 3%;*/
	padding: 10px 3%;
	transition: .3s;
	font-size: 1;
	font-weight: bold;
}
.hd-menu li a:hover {
	color: #33d77e;
	background: #fff;
}
.hd-menu li a::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  content: '';
  background: rgba( 255, 255, 254, 0.3);
  transform-origin: left top;
  transform: scale(1, 0);
  transition: transform .5s;
}
/*.hd-menu li a:hover::before {
  transform-origin: left top;
  transform: scale(1, 1);
}*/
.hd-menu span {
	font-size: 0.8em;
	padding-top: 4px;
	display: block;
}

/* #breadcrumb */
#breadcrumb {
	width: 100%;
	margin: 0 auto;
	padding: 10px 0;
}
#breadcrumb ul li {
	padding-right: 10px;
	margin-right: 10px;
	font-size: 0.9rem;
	display:  inline-block;
	position: relative;
}
	/*#breadcrumb ul li:after {
		font-family: "Font Awesome 5 Free";
	  font-weight: 900;
	  content: "\f105";
		position: absolute;
		top: 0;
		right: 0;
	}
	#breadcrumb ul li:last-child:after { display: none; }
*/
/* #sub-menu */
#sub-menu {
	width: 100%;
	margin: 0 auto;
	padding: 20px 0 40px;
}

#sub-menu ul li {
	padding-right: 20px;
	margin-right: 19px;
	/*font-size: 1.2rem;*/
	font-size: 1.4rem;
	line-height: 1.6;
	display:  inline-block;
	position: relative;
}
	#sub-menu ul li:after {
		font-family: "Font Awesome 5 Free";
	  font-weight: 900;
		color: #70adff;
	  content: "\f107";
		position: absolute;
		top: 0;
		right: 0;
	}

#sub-menu ul li a:hover,
#sub-menu ul li a.active { color: #70adff; }


/* ========= #footer ========= */
footer {
	width: 100%;
	margin: 80px auto 0;
	padding: 40px 0;
	box-sizing: border-box;
	border-top: 1px solid #000;}

#footer {
	/*max-width: 980px;*/
	max-width: 1180px;
	width: 95%;
	margin: 0 auto;
	font-size: 0;
	position: relative;}

.ft-menu {
	margin-right: 40px;
	font-size: 0.9rem;
	display: inline-block;
	vertical-align: top;}

	.ft-menu li { margin-bottom: 10px; }

.copy {
	position: absolute;
	top: 0;
	right: 0;
	text-align: right;}

.copy p {
	margin: 5px 0;
	font-size: 0.8rem;}
.copy small {
  display: block;
  font-size: 0.7rem;}

@media screen and (max-width:768px) {
	#main-logo img { width: 60%; }
	header h1 { margin-left: 0; }
	.under:hover{
		color: #222!important;
		background-color:#fff!important;
		text-decoration: none!important;}
	
	/*#spmenu-num{
		position: absolute;
		bottom: 20px;
	}*/

	#spmenu-num li{
		line-height: 1.5;}
	#spmenu-num span{
		font-size: 15px;
		font-weight: normal;
		display: block;} 
  
	#breadcrumb { display: none; }	

	footer { margin: 40px auto 0; padding: 20px 0; }
	#footer { max-width: auto; }

	.ft-menu-outside { text-align: center; }
	.ft-menu { width: 31%; margin-right: 2%; font-size: 0.8rem; }
	.ft-menu:last-child { margin-right: 0; }
	.ft-menu li { margin-bottom: 10px; }

	.copy { margin-top: 10px; position: relative; }
	.copy img { width: 50%; }
	
	/*.fixed{position: fixed;background: #fff; z-index: 100;}
  .drawer-hamburger { background-color: #fff;}*/
	
	.drawer-nav { z-index: 1000 !important;}
	.drawer--right.drawer-open .drawer-hamburger {z-index: 2000; top: 0; right: 0 !important; position: fixed;}
	.drawer-dropdown-menu-item {line-height: 2.75rem!important; font-size: 13px; border-bottom: 1px solid #b3b3b3;}
	.drawer-dropdown.open>.drawer-dropdown-menu {background: #F7F8F7; border-top: 1px solid #b3b3b3;}
	.drawer{pointer-events: all; overflow-y: scroll;}
	.drawer-menu-item{font-weight: bold!important;}
	/*spメニュー100％にする場合以下有効化
	.drawer--right .drawer-nav{right: -100%!important;}
	.drawer-nav{width:100%!important;}
	.drawer--right.drawer-open .drawer-nav{right: 0!important;}*/
	}

/* ========= #TOP ========= */
/* .slider */
.slider-outside {
	/*max-width: 1300px;*/
	width: 100%;
	margin: 0 auto;
}

.slider { width: 100%;}
.slider img {width: 100%; height: auto;}
.slider li { position: relative; }
.slider .cap{
	position: absolute;
	 font-size: 3.8vw;
	transition: .3s ease;
	text-align: center;
	color: #fff;
	font-weight: bold;
	text-shadow:6px 8px 8px #4c4a4a;
	letter-spacing: 1px;
	line-height: 1.2;
}

/* ========= effect ========= */
.cap{
  position: relative;
  display: inline-block;
  transition: .3s;
  padding-top:10px
    
}
.cap::before,
.cap::after {
    
  position: absolute;
  content: '';
  width: 0;
  height: 2px;
  background-color: #2ecc71;
  transition: .3s;
}
.cap::before {
  top: 0;
  left: 0;
}
.cap::after {
  bottom: 0;
  right: 0;
}
.cap:hover::before,
.cap:hover::after {
  width: 100%;
}
/* ========= ↑ ========= */

@media screen and (min-width:769px){
	.slider .cap{font-family:"游明朝", "YuMincho", "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}}

.slider .slick-current .cap {opacity: 1; transition-delay: .5s;}
.slider .cap1{left:26%;top:39%;}
.slider .cap2{left:30%;top:58%;}
.slider .cap3{left:43%;top:12%;}
.slider .cap4{left:47%;top:64%;}
.slider .cap5{left:19%;top:15%;}
.slider .cap6{left:30%;top:46%;}


@media screen and (max-width:768px){
	.slider .cap{font-size: 5.2vw;}
	.slider .cap1{left:12%;top:34%;}
	.slider .cap2{left:22%;top:68%;}
	.slider .cap3{left:9%;top:9%;}
	.slider .cap4{left:28%;top:64%;}
	.slider .cap5{left:15%;top:20%;}
	.slider .cap6{left:9%;top:65%;}
}






/* .topics */
.topics-outside {
	max-width: 880px;
	width: 100%;
	margin: 20px auto 0;
	padding: 12px 0;
	display: inline-flex;
}

.topics-outside > p {
	width: 100px;
	box-sizing: border-box;
	line-height: 40px;
	margin-right: 10px;
	padding-right: 45px;
	position: relative;
	letter-spacing: -1px;
}
	/*.topics-outside > p:after {
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		position: absolute;
		font-size: 1.5em;
		content: "\f105\f105\f105";
		right: 0;
	}*/
.topmain{
	max-width:1000px;
	margin: 0 auto;
}

.top-lead {
	margin: 50px 0;
	font-size: 33px;
	font-weight: bold;
}

/* .top-menu */
.top-menu {
	margin-top: 20px;
	width: 100%;
	display: inline-flex;
	justify-content: space-between;
}
.top-menu li {
	width: 33.33%;
	display: inline-block;
	border-right: 1px solid #6cd7dc;
}
	.top-menu li:last-child { border-right: none; }

.top-menu dl {
	position: relative;
	text-align: center;
	margin: 0 auto;
}
.top-menu dl img {
	width: 90%;
	max-width: 296px;
	margin: 0 auto;
}
/*.top-menu dt span {
	position: absolute;
	top: 43%;
	width: 100%;
	display: block;
	line-height: 1.5;
	color: #fff;
}*/
.top-menu dd {
	font-size: 16px;
	line-height: 1.5;
	margin-top: 10px;
}

.top-content h3 {
	margin-top: 50px;
	font-weight: bold;
	font-size: 30px;
	letter-spacing: 0.3em;
	text-align: center;
}
.top-content h3 span {
	display: block;
	margin-top: 5px;
	font-weight: normal;
	font-size: 0.5em;
}
.ad{display: table;width:100%;}
.ad > article{display: table-cell;vertical-align: top;}
.ad > article:last-child{width: 40%;}


/* in-top-con */
.in-top-con {
	width: 100%;
	margin-top: 50px;
	position: relative;
	display: flex;
	align-content: space-between;
	transition: opacity 0.5s ease-out;
	-o-transition: opacity 0.5s ease-out; /* opera */
	-moz-transition: opacity 0.5s ease-out; /* firefox */
	-webkit-transition: opacity 0.5s ease-out; /* chrome, safari */
	-ms-transition: opacity 0.5s ease-out; /* ie */
}
.in-top-con:first-of-type { margin-top: 20px; }
.in-top-con:hover { opacity: 0.5; }
.in-top-con p {font-size:20px;}
.in-top-img {
	max-width: 676px;
	width: 68%;
	margin-right: 1%;
}
.in-top-img img {
	width: 100%;
	display: block;
}

.in-top-inner {
	/*width: 31%;*/
	width: 43%;
	/*padding: 15px;*/
	padding: 25px;
	color: #fff;
	align-self: stretch;
	box-sizing: border-box;
	position: relative;
}
.in-top-inner::after {
	width: 0;
	height: 0;
	content: " ";
	position: absolute;
	right: 5px;
	bottom: 5px;
	border-style: solid;
	border-width: 0 0 15px 15px;
	border-color: transparent transparent #fff transparent;
	}


.in-top-inner h4 {
	margin-bottom: 20px;
	/*font-size: 21px;*/
	font-size: 30px;
	line-height: 1.6;
	border-bottom: 1px solid #fff;
}

.top-content a.w100p:nth-of-type(even) .in-top-inner { order: 0; }
.top-content a.w100p:nth-of-type(even) .in-top-img { order: 1; margin: 0 0 0 1%; }

.top-content > h4 {
	margin-top: 30px;
	font-size: 30px;
	font-weight: bold;
	text-align: center;
	padding: 0.8em 0 0.5em 0;
	border-bottom: 2px dotted;
	border-top: 2px dotted;
	color: #64aad2;
}
.top-content > h4 small{
	display: block;
	font-size: 18px;
	color: #000;
	line-height: 2;
	font-weight: normal;
}

/*inner-content*/
.inner-content {
	padding: 2em 0;
	position: relative;
}

address {
	font-size: 40px;
	margin: 0 0 10px 0;
	font-weight: bold;
	letter-spacing: 6px;
}
address:before {
	width: 48px;
	height: 32px;
	content: " ";
	display: inline-block;
	vertical-align: top;
	margin-right: 10px;
	background: url("../img/common/tell.png") no-repeat left center;
}
.safety-ul1 {
	color: #64aad2;
	line-height: 1.6;
}
.safety-ul1 li:before {
	font-family: "Font Awesome 5 Free";
	content:'\f005';
	font-weight: 800;
	padding-right: 5px;}
.safety-ul1 small{font-size: 14px;}

.ad .btn-repair{border:solid 1px #64aad2; margin-top:20px; font-size:22px; text-align:center; border-radius:5px; font-weight:bold; background:#64aad2;}
.ad .btn-repair a{color: #FFF;}

@media screen and (min-width:769px) {
	.safety-ul1{
		font-size: 23px;}}

.icon{
	position: absolute;
	top: 20px;
	right: 0;
}

.safety-ul2 {
	width: 100%;	
	padding: 10px 0;
	display: inline-flex;
}
.safety-ul2 li {
	width: 33%;
	border: 1px solid #ccc;
	margin-right: 1%;
	padding: 10px;
	border-radius: 8px;
	display: table;
	box-sizing: border-box;
	align-content: center;
}
	.safety-ul2 li:last-child { margin-right: 0; }

.safety-ul2 li p {
	font-size: 1rem;
	height: 100%;
	display: table-cell;
	vertical-align: middle;
}

.safety-ul2 li p:last-child span {
	font-size: 50px;
	color:#64aad2;
	font-weight: bold;
}

.top-map {
	position: relative;
	text-align: right;
}
.top-map p{
	text-align: left;
	position: absolute;
	left:0;
	top:50px;
}

.top-map img {
	/*margin: -110px 30px 0 0;
	margin: -65px 30px 0 0;*/
	max-width: 619px;
	width: 100%;
}

.top-map .btn-blue {
	position: absolute;
	/*top: 50px;*/
	top:135px;
	left: 0;
}

/* info */
.info dl {
	width: 100%;
	font-size: 1em;
	line-height: 1.6;
	border-top: 1px solid #64aad2;
}
	.info dl:last-of-type { border-bottom: 1px solid #64aad2; }

.info dt {
  float: left;
  clear: left;
	width: 15%;
	margin: 5px 0;
	padding: 10px 0;
}
.info dd {
	width: 85%;
	margin: 5px 0 5px 15%;
	padding: 10px 0 10px 10px;
	box-sizing: border-box;
	border-left: 1px solid #64aad2;
}

.info a:hover{color: #70adff;}

.banner-link { display: flex; }
.banner-link li {
	margin: 20px 2% 0 0;
	width: 20%;
	box-sizing: border-box;
	padding: 20px;
	border: solid 1px #64aad2;
	
}
	.banner-link li:last-of-type { margin-right: 0; }
.banner-link li img { width: 100%; }
	
.banner-link2 { display: flex; }
.banner-link2 li {
	margin: 20px 2% 0 0;
	width: 40%;
	box-sizing: border-box;
	padding: 10px;
	border: solid 1px #64aad2;
	
}
.banner-link2 li:last-of-type { margin-right: 0; }
.banner-link2 li img { width: 100%; }

@media screen and (max-width:768px) {
	.banner-link { display: block; }
	.banner-link li {
	margin: 10px 50px;
	width: 70%;
	text-align: center;}
	.banner-link li img { width: 100%; }
  .slider img {
    height: 230px;
    object-fit: cover;
  }
    
    
	.banner-link2 { display: block; }
	.banner-link2 li {
	margin: 10px 50px;
	width: 70%;
	text-align: center;}
	.banner-link2 li img { width: 100%; }
    
    
  .slider img {
    height: 230px;
    object-fit: cover;
  }    
    
    
  .slider .caption {
    padding-top: 5px;
    top: auto;
    bottom: 0; 
    letter-spacing: 0;
    font-weight: normal;
    font-size: 0.8rem;
    background: rgba(0,0,0,0.3);
  }
  .slider .caption img {
    max-width: 458px;
    height: auto;
	padding-bottom: 5px;
  }
  .slider .caption-txt { padding: 5px 10px; background-color: #33d87e; letter-spacing: -1px;}
  
	.top-lead { font-size: 15px; margin: 20px 0; }

	.top-menu { width: 100%; display: block; }
	.top-menu li { width: 100%; display: block; border-right: none; border-bottom: 1px solid #6cd7dc; padding: 10px 0; }
	.top-menu li:first-child { border-top: 1px solid #6cd7dc;}
	.top-menu li img{vertical-align: middle;}
	
	.top-menu dl { display: inline-flex; width: 100%; }
	.top-menu dt { display: inline-block; width: 30%; }
	.top-menu dd { width: 70%; font-size: 0.9em; display: inline-block; margin-top:0;letter-spacing: -1px;}
	.top-menu span {color:#6cd7dc;font-weight: bold;}

	.top-content h3 { margin-top: 34px; font-size: 1.2rem; }
	address { letter-spacing: -1px;font-size: 30px;text-align: center;}

	.in-top-con { display: block; }
	.in-top-img,
	.top-content a.w100p:nth-of-type(even) .in-top-img,
	.in-top-inner { width: 100%; margin: 0; }
	.ad > article{vertical-align: middle;}
	.icon { position: relative; top: auto; right: auto; width: 90%; }
	.inner-content.pb70 { padding-bottom: 0; }
	.safety-ul2 { display: block; }

	.top-content > h4 { font-size: 1.1em; padding: 1em; }
	.safety-ul2 li { width: 100%; margin-top: 10px; }
	
	.top-map img { margin: 74px 0 0 0; }
	/*.top-map .btn-blue { top: 20px; }*/
	.top-map p{position: static;margin-bottom: 15px;}
	
	.info dt { width: 25%; font-size: 0.9em; }
	.info dd { width: 75%; font-size: 0.9em; margin-left: 25%; }
}


/* ========= #container ========= */
#container {
	/*max-width: 980px;*/
	max-width: 1180px;
	width: 90%;
	margin: 0 auto;
	position: relative;
}

/* title */
h2.ttl-main {
	margin-top: 50px;
	letter-spacing: 0.1em;
  overflow: hidden;
	font-weight: bold;
	font-size: 2.5rem;
}
h2.ttl-main > span {
  position: relative;
  display: inline-block;
  margin: 0 2.5em;
  /*padding: 0.1em 1em;*/
  padding: 0.1em 0em;
  text-align: left;
}
h2.ttl-main > span::before,
h2.ttl-main > span::after {
  position: absolute;
  top: 50%;
  content: '';
  width: 400%;
  height: 1px;
}
h2.ttl-main > span::before { right: 100%; }
h2.ttl-main > span::after { left: 100%; }

h2.ttl-main > span span {
	margin-left: 0.5em;
	letter-spacing: 0;
	font-size: 0.6em;
	font-weight: normal;
}

.ttl-sub {
	font-size: 30px;
	font-weight: bold;
	margin-bottom: 30px;
	padding: 15px 0 15px 8.5rem;
	border-top: 5px solid; 
	border-bottom: 5px solid; 
}

.ttl-dot {
	width: 100%;
	position: relative;
	margin: 50px 0 20px;
	font-size: 1.5rem;
	line-height: 1.2;
	font-weight: bold;
}
	.ttl-dot::before {
		content: " ";
		position: absolute;
		width: 100%;
		height: 1rem;
		bottom: 0.5rem;
		right: 0;
		z-index: -1;
		background: url("../img/support/dotted.png") 0 50% repeat-x;
	}

/*	.ttl-dot::before {
		content: " ";
		position: absolute;
		width: 100%;
		bottom: 0.9rem;
		right: 0;
		border-width: 0 0 5px;
		border-style: solid;
		border-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 1"><circle fill="hsla(214, 56%, 69%, 0.5)" cx="1" cy="0.5" r="0.5"/></svg>') 0 0 100% repeat;
		z-index: -1;
	}
*/
	.ttl-dot span {
		padding-right: 20px;
		background-color: #fff;
	 }
	.ttl-dot span.color-blue,
	#support .ttl-dot span { color: #3e6dac; }


.ttl-blue {
	font-size: 1.5rem;
	color: #3e6dac;
	font-weight: bold;
	line-height: 1.6;
 }

/* txt */
.txt-lead {
	font-size: 20px;
	line-height: 1.4;
}

.txt-blue {
	font-size: 24px;
	line-height: 1.4;
	color: #3e6dac;
	font-weight: bold;
 }
.t-blue {
	line-height: 1.4;
	color: #3e6dac;
}
.txt-red {
	font-size: 20x;
	line-height: 1.4;
	color: #ff0000;
	font-weight: bold;}


@media screen and (max-width:768px){
	.sptxt20{
		font-size: 20px;
	}
}

/* btn */
.btn-blue.poa {
	right: 0;
	bottom: 0;
}

.btn-blue a {
	padding: 10px 10px 10px 2rem;
	display: inline-block;
	line-height: 1;
	position: relative;
	color: #fff;
	background-color: #64aad2;
	transition: opacity 0.5s ease-out;
	-o-transition: opacity 0.5s ease-out; /* opera */
	-moz-transition: opacity 0.5s ease-out; /* firefox */
	-webkit-transition: opacity 0.5s ease-out; /* chrome, safari */
	-ms-transition: opacity 0.5s ease-out; /* ie */
}
.btn-blue a::before {
		font-family: "Font Awesome 5 Free";
	  font-weight: 900;
	  content: "\f105";
		position: absolute;
		left: 10px;
}

.btn-red a {
	padding: 10px 10px 10px 2rem;
	display: inline-block;
	line-height: 1;
	position: relative;
	color: #fff;
	background-color: #FF3300;
	transition: opacity 0.5s ease-out;
	-o-transition: opacity 0.5s ease-out; /* opera */
	-moz-transition: opacity 0.5s ease-out; /* firefox */
	-webkit-transition: opacity 0.5s ease-out; /* chrome, safari */
	-ms-transition: opacity 0.5s ease-out; /* ie */
}
.btn-red a::before {
		font-family: "Font Awesome 5 Free";
	  font-weight: 900;
	  content: "\f105";
		position: absolute;
		left: 10px;
}


@media screen and (max-width:768px) {
	.btn-blue a {letter-spacing: -1px;}
}

/* .back */
.btn_back {
	width: 80px;
	height: 80px;
	position: fixed;
	bottom: 30px;
	right: 30px;
  z-index: 1000;
}
.btn_back a {
	width: 100%;
	height: 100%;
	text-align: center;
	line-height: 80px;
	border-radius: 50%;
	color: #fff;
	display: block;
	background-color: #6cd7dc;
	transition: opacity 0.5s ease-out;
	-o-transition: opacity 0.5s ease-out; /* opera */
	-moz-transition: opacity 0.5s ease-out; /* firefox */
	-webkit-transition: opacity 0.5s ease-out; /* chrome, safari */
	-ms-transition: opacity 0.5s ease-out; /* ie */
}
.btn-blue a:hover,
.btn-red a:hover,
.btn_back a:hover { opacity: 0.6; }


@media screen and (max-width:768px) {	
	h2.ttl-main { margin-top: 30px; font-size: 1.8rem; letter-spacing: 0.1em; text-align: center; }
	h2.ttl-main > span { margin: 0 2em; padding: 0.1em 0.3em; }
	h2.ttl-sub { font-size: 1.7rem; padding: 10px 2rem; text-align: center; }
	.ttl-sub { font-size: 1.5rem; margin-bottom: 20px; padding: 10px 0; }
	.ttl-dot { margin-top: 30px; }
	
	.txt-lead { font-size: 0.9rem; }

	.btn-blue.poa { position: relative; text-align: right; }
  .btn_back { width: 60px; height: 60px; bottom: 15px; right: 15px; }
  .btn_back a { line-height: 60px; }
}


/* box */
.box-list {
	margin-top: 50px;
	font-size: 1px;
	color: #fff;
	text-align: left;
    display:-webkit-box;
    display:-moz-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-direction:normal;
    -moz-box-direction:normal;
    box-direction:normal;
    -webkit-box-orient:horizontal;
    -moz-box-orient:horizontal;
    box-orient:horizontal;
    -ms-flex-direction:row;
    -webkit-flex-direction:row;
    -moz-flex-direction:row;
    flex-direction:row;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;}
.box-list div {
	width: 31.9%;
	margin: 0 0 20px 2%;
	vertical-align: top;
  display: inline-block;
  align-self: stretch;
}
	.box-list div:nth-child(3n+1) { margin-left: 0; }
.box-list div a {
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	position: relative;
	display: block;
	opacity: 1;
	transition: background-color 0.5s ease-out;
	-o-transition: background-color 0.5s ease-out; /* opera */
	-moz-transition: background-color 0.5s ease-out; /* firefox */
	-webkit-transition: background-color 0.5s ease-out; /* chrome, safari */
	-ms-transition: background-color 0.5s ease-out; /* ie */
}
	.box-list div a::after {
		width: 0;
		height: 0;
		content: " ";
		position: absolute;
		right: 5px;
		bottom: 5px;
		border-style: solid;
		border-width: 0 0 15px 15px;
		border-color: transparent transparent #fff transparent;
	}

	.box-list div a:hover {
		background-color: rgba( 255, 255, 255, 0.3 );
}


.box-list div h3 {
	font-family: 'Roboto Condensed', sans-serif;
	text-align: left;
	font-size: 42pt;
	letter-spacing: 0.1em;
	/*text-shadow: 10px 5px 20px #666;*/
	text-shadow: 5px 4px 5px #666;
}
.box-list div h3 span { margin-left: 0.2rem;}
.box-list div h4 {
	margin-top: 30px;
	font-size: 1.5rem;
	font-weight: bold;
}
.box-list div p {
	margin-top: 15pt;
	font-size: 1.1rem;
}
.box-list div img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
  ::i-block-chrome, .box-list div img {
    height: auto;
  }
}


dl.box-blue dt {
	margin-top: 20px;
  padding: 11px 146px 11px 20px;
  position: relative;
  font-size: 1rem;
	font-weight: bold;
  margin-left: 20px;
  line-height: 1.3;
  z-index:-1;
	background-color: rgba(112, 173, 255, 0.42);
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	display: inline-block;
}
	dl.box-blue dt:after {
		position: absolute;
		content: '';
		right: 0;
		top: 0;
		border: none;
		border-right: solid 90px white;
		border-bottom: solid 50px transparent;
		z-index:-2;
	}	

dl.box-blue dd {
	padding: 20px;
	border:  2px solid #70adff;
}


@media screen and (max-width:768px) {		
	.box-list { margin-top: 30px; }
	.box-list div { width: 100%; margin: 0 0 20px 0; display: block; }
	.box-list div h3 { font-size: 1.7rem; }
	.box-list div h4 { margin-top: 10px; font-size: 1.2rem; }
	.box-list div a { padding: 20px; }
	.box-list div p { margin-top: 10px; font-size: 1rem; }
	
	dl.box-blue dt { padding: 8px 70px 8px 20px; margin: 20px 5px 0 10px; }
	dl.box-blue dt:after { right: -20px; border-right: solid 70px white; border-bottom: solid 50px transparent; }	
}


/* .list */
.ul-circle {
	position: relative;
	font-size: 0.9rem;
	line-height: 1.6;
}
.ul-circle li {
	padding-left: 1.5em;
	box-sizing: border-box;
	position: relative;
	vertical-align: top;
}
	.ul-circle li:before{
		content: "●";
		color: #70adff;
		position: absolute;
		left: 0;
	}

.ul-circle.column-2 li {
	display: inline-block;
	width: 45%;
}

.ul-arrow {
	position: relative;
	font-size: 18px;
	line-height: 1.6;
	color: #3e6dac;
}
.ul-arrow li {
	padding-left: 1.5em;
	position: relative;
}
	.ul-arrow li:before{
		font-family: "Font Awesome 5 Free";
	  font-weight: 900;
		font-size: 0.9em;
	  content: "\f30b";
		position: absolute;
		top: 0;
		left: 0;
	}

.ul-num {
	margin-top: 30px;
	position: relative;
	font-size: 18px;
	line-height: 1.6;
}
.ul-num li {
	margin-top: 10px;
	padding-left: 1.5em;
	position: relative;
}
	.ul-num li:before{
		font-size: 0.9em;
	  content: "";
		position: absolute;
		background-color: #70adff;
		border-radius: 50%;
		width: 20px;
		height: 20px;
		text-align: center;
		color: #fff;
		font-size: 0.7em;
		line-height: 22px;
		top: 3px;
		left: 0;
		counter-increment: number 1;
		content: counter(number);
	}

/* mission */
.msn-img {
	max-width: 240px;
	width: 40%;
	margin: 0 80px 0 0;
	float: left;
}

.msn-list {
	width: 55%;
	line-height: 1.6;
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
}

.msn-list dt {
	margin-bottom: 20px;
	font-size: 1.4rem;
	width: 4rem;
	font-weight: bold;
	color: #3e6dac;
}
.msn-list dd {
	margin-bottom: 20px;
	font-size: 0.9rem;
	width: calc(100% - 4rem);
}

/* table */
.tbl-list {
	width: 100%;
	border-bottom: 1px solid #666;
}
.tbl-list th,
.tbl-list td {
	padding: 1rem 2rem;
	text-align: left;
	line-height: 1.4;
	font-size: 0.9rem;
	border-top: 1px solid #666;
	box-sizing: border-box;
	vertical-align: top;
}
.tbl-list th {
	background-color: #efeede;
	width: 25%;
}

.tbl-list td dl.tbl-inner dt,
.tbl-list td dl.tbl-inner2 dt {
  float: left;
  clear: left;
}
.tbl-list td dl.tbl-inner dd,
.tbl-list td dl.tbl-inner2 dd { float: left; }

.tbl-list td dl.tbl-inner dt { width: 5rem; }
.tbl-list td dl.tbl-inner dd { width: 10rem; }
.tbl-list td dl.tbl-inner dd:nth-of-type(even) { width: 7rem; text-align: right; }
.tbl-list td dl.tbl-inner2 dt { width: 15rem; }
.tbl-list td dl.tbl-inner2 dd { width: 7rem; text-align: right; }

.tbl-list td .txt-blue {
	font-size: 0.9rem;
	color: #3e6dac;
 }
.txt-blue-normal{
	color: #3e6dac;
}
.tbl-list small{display: block;}

.tbl-list td a:hover { color: #6cd7dc;; }

@media screen and (max-width:768px) {
	.msn-img { margin: 0 auto; display: block; float: none; }
	.msn-list { margin-top: 20px; width: 100%; }

	.tbl-list th,
	.tbl-list td { padding: 10px 5%; }
	.tbl-list td dl.tbl-inner dt,
	.tbl-list td dl.tbl-inner2 dt { width: auto; }
	/*.tbl-list td dl.tbl-inner dd,*/
	.tbl-list td dl.tbl-inner2 dd { width: auto; margin-left: 2rem; }
	
	.tbl-list td dl.tbl-inner dd{text-align: left!important;}
	.tbl-list td dl.tbl-inner dd.ml{margin-left: 1rem;padding-bottom:0!important;}
	
	/*.tbl-list td dl.tbl-inner dd:first-of-type{margin-left: 1rem;padding-bottom:0!important;}*/
	
	.tbl-list td dl.tbl-inner dd{padding-bottom: 5px;}
	.tbl-list td dl.tbl-inner2 dt{clear: left;float: left;width: 100%;}
	
	.tbl-list td dl.tbl-inner2 dd{margin-left: 0%;padding-bottom: 5px;}
}



/*================= #news */
#news h2.ttl-main { color: #f08c8c; }
#news h2.ttl-main > span::before,
#news h2.ttl-main > span::after {
  background-color: #f08c8c;
}

.news-list li {
	font-size: 0.95rem;
	position: relative;
	line-height: 1.6;
	padding: 20px 0 10px 10rem;	
	border-bottom: 1px dotted #ccc;
}
.news-list li span {
	width: 10rem;
	position: absolute;
	left: 0;
}
.news-list li a:hover { color: #70adff; }
.news-list li a.icon-pdf:after {
		margin-left: 5px;
		font-family: "Font Awesome 5 Free";
	  font-weight: 900;
		font-size: 1em;
	  content: "\f1c1";
		color: #f08c8c;
	}


/*================= #other */
#other .ttl-sub {
	border-top-color: #63aad2;
	border-bottom-color: #63aad2;
}

.privacy-list dt {
	color: #63aad2;
	font-weight: bold;
	font-size: 1.1rem;
	margin: 20px 0 5px;
}
.privacy-list dd {
	font-size: 1rem;
	line-height: 1.4;
}

.privacy-num  { counter-reset: item; }
.privacy-num li {
	text-indent: -1.6em;
	padding-left: 1.6em;
	font-size: 1rem;
	line-height: 1.4;
}
.privacy-num li:before {
	counter-increment: item;
	content: counter(item) ")";
	margin-right: 0.5rem;
}

.search-area {
	width: 80%;
	margin: 20px auto 0;
}
.search-area dl {
	display: flex;
	align-items: center;
}
.search-area dd {
	width: 24%;
	margin-right: 2%;
	text-align: center;
}
.search-area dd select { width: 100%; }
.search-area dd input {
	width: 80px;
	padding: 5px;
	color: #fff;
	background-color: #64aad2;
	border: none;
}
.search-area dd input:last-of-type { background-color: #999; }

.search-map {
	position: relative;
}

.search-map .poa {
	top: -50px;
	right: 0;
	z-index: -1;
}

.city-list {
	width: 50%;
	margin-top: 20px;
	font-size: 0.9rem;
}
.city-list dt {
	width: 81px;
    margin-top: 10px;
    padding: 5px 9px;
    display: inline-block;
    text-align: center;
    color: #fff;
    float: left;
    clear: left;
    letter-spacing: -1px;
	/*width: 80px;
	margin-top: 10px;
	padding: 5px 10px;
	display: inline-block;
	text-align: center;
	color: #fff;
	float: left;
  clear: left;*/
}
.city-list dt:nth-of-type(1) { background-color: #B7C8E5; color: #000000ab;}
.city-list dt:nth-of-type(2) { background-color: #9BD5F2; color: #000000ab;}
.city-list dt:nth-of-type(3) { background-color: #E8B28D; color: #000000ab;}
/*.city-list dt:nth-of-type(4) { background-color: #B5F8F6; }*/
.city-list dt:nth-of-type(4) { background-color: #72F8B6; color: #000000ab;}
.city-list dt:nth-of-type(5) { background-color: #C5F882; color: #000000ab;}
.city-list dt:nth-of-type(6) { background-color: #DCD72F; color: #000000ab;}
.city-list dt:nth-of-type(7) { background-color: #f0c86f; color: #000000ab;}
.city-list dt:nth-of-type(8) { background-color: #F8BAB0; color: #000000ab;}
.city-list dt:nth-of-type(9) { background-color: #F89698; color: #000000ab;}

.city-list dt:nth-of-type(1):hover { background-color: #005eff; color: #fff;}
.city-list dt:nth-of-type(2):hover { background-color: #00a6f9; color: #fff;}
.city-list dt:nth-of-type(3):hover { background-color: #ef6100; color: #fff;}
/*.city-list dt:nth-of-type(4) { background-color: #B5F8F6; }*/
.city-list dt:nth-of-type(4):hover { background-color: #009c4f; color: #fff;}
.city-list dt:nth-of-type(5):hover { background-color: #33d87e; color: #fff;}
.city-list dt:nth-of-type(6):hover { background-color: #dc982f; color: #fff;}
.city-list dt:nth-of-type(7):hover { background-color: #ffb000; color: #fff;}
.city-list dt:nth-of-type(8):hover { background-color: #bb1a00; color: #fff;}
.city-list dt:nth-of-type(9):hover { background-color: #ff4246; color: #fff;}

.city-list dd {
	width: calc(100% - 100px);
	color:#6666669e;
	display: inline-block;
	float: left;
}

.city-list dd ul li {
	display: inline-block;
	padding: 5px 10px;
	margin-top: 10px;
	border-right: 1px solid;
}



/*================= #service */
#service h2.ttl-main { color: #63aad2; }
#service h2.ttl-main > span::before,
#service h2.ttl-main > span::after,
#service .box-list div:nth-child(2n+1) {
  background-color: #63aad2;
}

#service .ttl-sub {
	border-top-color: #63aad2;
	border-bottom-color: #63aad2;
}

#service .box-list a { padding: 20px 30px 0; }
#service .box-list div h3 {
	font-size: 2.5rem;
	letter-spacing: 0;
}

/* flow */
.flow-box {
	width: 100%;
	margin-top: 50px;
	position: relative;
	display: flex;
  align-content: space-between;
}
.flow-box:first-of-type { margin-top: 20px; }

.flow-box::after {
	width: 52px;
	height: 53px;
	background: url(../img/service/arrow1.png);
	content: "";
	position: absolute;
	bottom: -26px;
	left: 60%;
}
.flow-box:last-of-type::after {
	display: none;
}

.flow-img {
	max-width: 286px;
	width: 24%;
	margin-right: 1%;
}

.flow-img img {
	width: 100%;
	display: block;
}

.flow-inner {
	width: 75%;
	border-bottom: 1px solid #a2cce4;
	align-self: stretch;
	box-sizing: border-box;
}
.flow-box:last-of-type .flow-inner { border-bottom: none; }

.flow-inner h4 {
	line-height: 30px;
	font-size: 1.5rem;
	width: 100%;
	padding: 10px 0;
	font-weight: bold;
	text-align: center;
	position: relative;
}

.flow-inner h4:before,
.flow-inner h4:after{
  content: "";
  position: absolute;
  width: 0;
	height: 0;
}
.flow-inner h4::before {
  right: 0;
  top: 0;
	width: 30%;
	z-index: -3;
  border: 25px solid #c1dded;
  border-left-color: transparent;
	position: absolute;
}
.flow-inner h4::after {
	left: 0;
	top: 0;
	width: 30%;
	z-index: -3;
	border: 25px solid #c1dded;
	border-right-color: transparent;
	position: absolute;
}

.flow-inner h5 {
	padding: 10px 0;
	color: #3e6dac;
	text-align: center;
	font-size: 1rem;
	border-bottom: 1px solid #a2cce4;
}

.flow-inner ul {
	width: 80%;
	margin: 10px auto 0;
}

.flow-inner ul li {
	padding-left: 1.5rem;
	line-height: 1.6;
	font-size: 0.9em;
	position: relative;
	
}
.flow-inner ul li::before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 0.9em;
	content: "\f30b";
	position: absolute;
	top: 0;
	left: 0;
	}

.flow-table {
	width: 100%;
	margin-top: 20px;
	font-size: 0;
	border-top: 1px solid #a2cce4;
	border-bottom: 1px solid #a2cce4;
}

.flow-table dt,
.flow-table dd { 
	line-height: 1.4;
	display: inline-block;
	vertical-align: middle;
	box-sizing: border-box;
}

.flow-table dt {
	width: 28%;
	padding: 0 20px;
	font-size: 0.8rem;
	text-align: left;
}
.flow-table dt span { font-size: 1.2rem; font-weight: bold; }
.flow-table dd {
	padding: 20px;
	height: 100%;
	font-size: 0.9rem;
	border-left: 1px dashed #a2cce4;
	width: 72%;
}
.flow-table dd span { display: inline-block; width: 25em; }


/* general-list */
.general-list {
	margin-top: 20px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.general-list li {
	width: 49%;
	border-top: 1px solid #64aad2;
	align-self: stretch;
}

.general-list li:nth-child(3),
.general-list li:nth-child(4) {
	border-bottom: 1px solid #64aad2;
}

.general-list li h4 {
	font-size: 2rem;
	width: 130px;
	color: #64aad2;
	text-align: center;
	vertical-align: middle;
	display: inline-block;
}
.general-list li p {
	margin: 5px 0;
	padding: 10px 20px;
	width: calc(100% - 130px);
	border-left: 1px solid #64aad2;
	font-size: 0.9rem;
	vertical-align: middle;
	display: inline-block;
	box-sizing: border-box;
}

.list-protection {
	margin-top: 30px;
	text-align: center;
}

.list-protection li {
	margin: 0 10px 20px;
	padding: 10px 20px;
	line-height: 1.6;
	font-size: 20px;
	box-sizing: border-box;
	display: inline-block;
	border: 2px solid #63aad2;
}

.map-area { margin-top: 80px; }

.map-area .list-protection { margin-bottom: 30px; }
.map-area .list-protection li {
	margin: 10px 10px 0 0;
	padding: 5px 30px;
	font-size: 1.2rem;
	font-weight: bold;
}
.map-area .list-protection li:last-of-type { margin-right: 0;}

.map-area > div { position: relative; }
.map-area div .fl { width: 50%; }
.map-area div .fr { width: 50%; text-align: center; }
.map-area .btn-blue { /*margin-top: 20px;*/position: relative;top: 50px; }
@media screen and (max-width:768px) {
	.map-area .btn-blue{
		position:relative;top: 0px;margin-bottom: 15px;}}


.tbl-list i {
	margin-left: 5px;
	color: #9BD5F2;
	font-size: 1.2rem;
}


/*================= #support */
#support h2.ttl-main { color: #aaaae6; }
#support h2.ttl-main > span::before,
#support h2.ttl-main > span::after {
	background-color: #aaaae6;
}

#support .ttl-sub {
	border-top-color: #aaaae6;
	border-bottom-color: #aaaae6;
}
.tar {text-align: right;}

/* box */
.box-support {
	margin-top: 20px;
	font-size: 0;
	text-align: left;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}

.box-support div {
	width: 32%;
	margin: 0 0 20px 2%;
	display: inline-block;
	vertical-align: top;
}
	.box-support div:nth-child(3n+1) { margin-left: 0; }

.box-support div p {
	font-size: 0.9rem;
}

.box-support div img {
	width: 100%;
	height: auto;
	margin-bottom: 15pt;
}

.btn-print {
	margin-top: 30px;
	text-align: center;
}

.btn-print a {
	width: 90%;
	max-width: 400px; 
	padding: 10px;
	box-sizing: border-box;
	color: #64aad2;
	font-weight: bold;
	display: inline-block;
	border: 5px solid #64aad2;
	line-height: 1;
	font-size: 20px;
	position: relative;
}
	.btn-print a::before,
	.btn-print a::after {
			font-family: "Font Awesome 5 Free";
			font-weight: 900;
		}
	.btn-print a::before { content: "\f105\f105\f105"; }
	.btn-print a::after { content: "\f104\f104\f104"; }

.box-pink {
	border-bottom: 20px solid #f08c8c;
}

.box-pink h4 {
	padding: 10px;
	color: #fff;
	text-align: center;
	font-size: 1rem;
	background-color: #f08c8c;
}

.box-pink .ul-circle {
	margin: 10px 0;
}
.box-pink .ul-circle li:before {
	color: #f08c8c;
}


/* ====================#faq */
#faq h2.ttl-main { color: #f0a064; }

#faq h2.ttl-main > span::before,
#faq h2.ttl-main > span::after,
#faq .box-list div:nth-child(2n+1) {
  background-color: #f0a064;
}

#faq .ttl-sub {
	border-top-color: #f0a064;
	border-bottom-color: #f0a064;
}

.faq-tab {
	margin-top: 30px;
	display: flex;
}
.faq-tab li {
	width: 20.6%;
	padding: 15px 0;
	text-align: center;
	cursor: pointer;
	border-bottom: 1px solid #333;
	transition: background 0.5s ease-out;
	-o-transition: background 0.5s ease-out; /* opera */
	-moz-transition: background 0.5s ease-out; /* firefox */
	-webkit-transition: background 0.5s ease-out; /* chrome, safari */
	-ms-transition: background 0.5s ease-out; /* ie */
}

	.faq-tab li:first-child { border-left: none; }
	.faq-tab li.is-active,
	.faq-tab li:hover {
	color: #fff;
	background-color: #f0a064;
}

.slidetoggle_menu {
	margin-top: 30px;
	line-height: 1.6;
	font-size: 0.9rem;
	border-bottom: 1px solid #000;
}
.slidetoggle_menu dt {
	padding: 20px 0 20px 80px;
	border-top: 1px solid #999;
	position: relative;
	cursor: pointer;
}
.slidetoggle_menu dt::before {
	font-weight: 900;
	font-size: 1.5em;
	content: "Q";
	width: 60px;
	height: 100%;
	line-height: 60px;
	text-align: center;
	color: #63aad2;
	background-color: #efeede;
	position: absolute;
	top: 0;
	left: 0;
	}
.slidetoggle_menu dt::after {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 2em;
	line-height: 60px;
	color: #63aad2;
	content: "\f107";
	position: absolute;
	top: 0;
	right: 10px;
}
.slidetoggle_menu dt.active::after { content: "\f106"; }

.slidetoggle_menu dd {
	display: none;
	padding: 20px 10px 20px 80px;
	border-top: 1px solid #999;
	background-color: rgba(100,170,170,0.2);
	position: relative;
}
	.slidetoggle_menu dd::before {
		font-weight: 900;
		font-size: 1.5em;
		content: "A";
		width: 60px;
		height: 100%;
		line-height: 60px;
		text-align: center;
		color: #fff;
		background-color: #63aad2;
		position: absolute;
		top: 0;
		left: 0;
	}

.slidetoggle_menu dd .btn-blue {
	position: absolute;
	right: 15px;
	bottom: 15px;
}
.slidetoggle_menu dd.btn-area { padding-right: 170px; }


/* ====================#recruit */
#recruit h2.ttl-main { color: #67d7dd; }

#recruit h2.ttl-main > span::before,
#recruit h2.ttl-main > span::after,
#recruit .box-list div:nth-child(2n+1) {
  background-color: #67d7dd;
}

#recruit .ttl-sub {
	border-top-color: #67d7dd;
	border-bottom-color: #67d7dd;
}

#recruit #sub-menu ul li:last-of-type {
	color: #fff;
	padding: 0 10px;
	margin-right: 0;
	text-align: center;
	background-color: #f08c8c;
}
	#recruit #sub-menu ul li:last-of-type:after { display: none; }
#recruit em{
	font-weight: bolder;
	color:#ff0000;
}

/*.list-menu*/
.list-menu { margin-top: 50px; }

.list-menu li {
	margin-top: 20px;
  background-color: #67d7dd;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
}
.list-menu li a {
	width: 100%;
	height: 100%;
	max-height: 224px;
	display: block;
	transition: background-color 0.5s ease-out;
	-o-transition: background-color 0.5s ease-out; /* opera */
	-moz-transition: background-color 0.5s ease-out; /* firefox */
	-webkit-transition: background-color 0.5s ease-out; /* chrome, safari */
	-ms-transition: background-color 0.5s ease-out; /* ie */
	z-index: 10;
}

.list-menu li a:hover {
	background-color: rgba( 255, 255, 255, 0.3 );
}
.list-menu li .list-inner {
	width: 315px;
	height: 160px;
	padding: 30px;
	color: #fff;
	box-sizing: border-box;
	display: inline-block;
}
.list-menu li .list-inner h3 {
	font-size: 1.8rem;
	font-weight: bold;
}
.list-menu li .list-inner h3 span {
	margin-top: 5px;
	font-size: 0.7em;
	font-weight: normal;
	display: block;
}
.list-menu li .list-inner p {
	font-size: 1.1rem;
	margin-top: 20px;
}

.list-menu li img {
	max-width: 650px;
	width: calc(100% - 315px);
  width: -webkit-calc(100% - 315px);
	object-fit: cover;
	overflow: hidden;
	min-height: 160px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
  ::i-block-chrome, .list-menu li .list-inner {
    width: 39%;
  }
  ::i-block-chrome, .list-menu li img {
    width: 60%;
  }
}

.list-menu li:nth-child(odd) .list-inner { float: left; }
.list-menu li:nth-child(odd) img { float: right; }
.list-menu li:nth-child(even) img { float: left; }

.btn-entry {
	margin-top: 50px;
	text-align: center;
}

.btn-entry a {
	padding: 20px 20%;
	display: inline-block;
	line-height: 1;
	color: #67d7dd;
	font-size: 2rem;
	font-weight: bold;
	border: 3px solid #67d7dd;
	letter-spacing: 1rem;
	transition: background-color 0.5s ease-out;
	-o-transition: background-color 0.5s ease-out; /* opera */
	-moz-transition: background-color 0.5s ease-out; /* firefox */
	-webkit-transition: background-color 0.5s ease-out; /* chrome, safari */
	-ms-transition: background-color 0.5s ease-out; /* ie */
}
.btn-entry a:hover {
	background-color: #67d7dd;
	color: #fff;
}

/* concept */
.txt-lead2 {
	margin: 20px 0;
	font-size: 26px;
	line-height: 1.4;
	font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;	
	font-weight: bolder;
}
.maxw980{
	max-width: 980px;
	margin: 0 auto;
}
.maxw680{
	max-width: 680px;
	margin: 0 auto;
}
.concept-area {
	display: flex;
}

.concept-img {
	width: 306px;
	margin-left: 20px;
	box-sizing: border-box;
	text-align: center;
}

.concept-area p {
	width: calc(100% - 326px);
	line-height: 1.8;
	font-size: 0.95em;
}
.concept-area p span.txt-lead {
	display: inline-block;
	width: 100%;
	text-align: right;
}
.concept-area span.txt-lead span { font-size: 0.7em; display: block;}


/* company */
.ttl-circle { line-height: 1.4; }

.ttl-circle span {
	margin-right: 15px;
	padding: 5px 20px;
	color: #fff;
	font-size: 1.2em;
	display: inline-block;
	background-color: #64aad2;
	border-radius: 25px;
}

.management-list {
	margin-top: 10px;
	line-height: 1.6;
}

.management-list dt {
	font-size: 24px;
	font-weight: bold;
	color: #3e6dac;
}
.management-list dd {
	margin-bottom: 10px;
	font-size: 0.9rem;
}

/* work */
.video_area {
	text-align: center;
	margin-top: 30px;
}
.video_area img { max-width: 480px; }


.box-work {
	margin-top: 10px;
	font-size: 0;
	text-align: left;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}

.box-work div {
	width: 29.2%;
	margin: 0 0 20px 5%;
	display: inline-block;
	vertical-align: top;
}
	.box-work div:nth-child(3n+1) { margin-left: 0; }

.box-work div p {
	font-size: 0.9rem;
}

.box-work div p.scene_num {
	font-weight: bold;
	font-size: 1.1rem;
	vertical-align: baseline;
}

.box-work div p.scene_num span {
	font-size: 2rem;
}

.box-work div img {
	width: 100%;
	height: auto;
	margin-bottom: 10pt;
}
.box-work div h5 {
	font-size: 1.2rem;
	font-weight: bold;
	margin-bottom: 10pt;
}

/* staff */
.staff-tab {
	margin-top: 10px;
	text-align: center;
}
.staff-tab li {
	margin-left: 10px;
	padding: 10px 20px;
	display: inline-block;
	cursor: pointer;
	font-size: 1.2rem;
	font-weight: bold;
	border-bottom: #3e6dac 1px solid;
}

.staff-tab li.is-active {
	color: #64aad2;
}

/* staff-box */
.staff-box {
	margin-top: 50px;
  background-color: #64aad2;
	font-size: 0;
	text-align: left;
	display: flex;
	flex-wrap: wrap;
}

.staff-box .staff-inner {
	color: #fff;
	/*width: 41%;*/
	width: 48%;
	padding: 30px 30px 0 30px;
	box-sizing: border-box;
	font-size: 1.1rem;
	line-height: 1.4;
	font-weight: bold;
}

.staff-box .staff-inner .staff-name {
	margin-top: 10%;
	font-size: 5rem;
}

.staff-box .staff-inner .staff-name span {
	display: block;
	font-weight: normal;
	font-size: 1rem;
}

.staff-box img {
	max-width: 615px;
	width: 52%;
	object-fit: cover;
	overflow: hidden;
	height: 100%;
	min-height: 160px;
}

.staff-box .order1 { order: 1; }
.staff-box .order2 { order: 2; }


/* education */
.ttl-black {
	font-size: 1.2rem;
	font-weight: bold;
	margin-bottom: 10pt;
}

.box-education {
	margin-top: 10px;
	font-size: 0;
	text-align: left;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}

.box-education div {
	/*width: 48%;*/
	width:29%;
	margin: 0 0 20px 4%;
	display: inline-block;
	vertical-align: top;
}
	.box-education div:nth-child(3n+1) { margin-left: 0; }
.box-education div.w200 { width: 200px; }
.box-education div.w48 { width: 48%; }

.box-education div p {
	font-size: 0.9rem;
}

.box-education div img {
	width: 100%;
	height: auto;
	margin-bottom: 10pt;
}
.box-education div h4 {
	font-size: 1.2rem;
	font-weight: bold;
	margin-bottom: 10pt;
	color: #3e6dac;
}

.btn-blueline {
	margin-top: 30px;
}

.btn-blueline a {
	padding: 20px;
	display: inline-block;
	line-height: 1.4;
	color: #67d7dd;
	font-size: 1rem;
	font-weight: bold;
	border: 3px solid #67d7dd;
	transition: background-color 0.5s ease-out;
	-o-transition: background-color 0.5s ease-out; /* opera */
	-moz-transition: background-color 0.5s ease-out; /* firefox */
	-webkit-transition: background-color 0.5s ease-out; /* chrome, safari */
	-ms-transition: background-color 0.5s ease-out; /* ie */
}
.btn-blueline a:hover {
	background-color: #67d7dd;
	color: #fff;
}

.btnblue-list { font-size: 0; }

.btnblue-list li {
	width: 21%;
	margin: 10px 1% 0 0;
	display: inline-block;
	vertical-align: top;
}
p.btnblue-list {
	display: inline-block;
	font-size: 0.9rem;
}

.btnblue-list a {
	padding: 10px 2rem 10px 10px;
	display: block;
	font-size: 0.9rem;
	line-height: 1;
	position: relative;
	color: #fff;
	background-color: #64aad2;
	transition: opacity 0.5s ease-out;
	-o-transition: opacity 0.5s ease-out; /* opera */
	-moz-transition: opacity 0.5s ease-out; /* firefox */
	-webkit-transition: opacity 0.5s ease-out; /* chrome, safari */
	-ms-transition: opacity 0.5s ease-out; /* ie */
}
.btnblue-list a::after {
		font-family: "Font Awesome 5 Free";
	  font-weight: 900;
	  content: "\f105";
		position: absolute;
		right: 10px;
}

.btnblue-list a:hover {
	color: #fff !important;
	opacity: 0.6;
}

#recruit .tbl-list p { margin-top: 10px; }
	#recruit .tbl-list p:first-of-type { margin-top: 0; }

.ttl-dot.pt30 { margin-top: 20px; }

.btn-recruit {
	font-size: 0;
	margin-top: 80px;
}
.btn-recruit li {
	width: 49%;
	margin-left: 2%;
	font-size: 1.1rem;
	display: inline-block;
	vertical-align: top;
	line-height: 1.4;
}
	.btn-recruit li:first-of-type { margin-left: 0; }
.btn-recruit li a {
	display: block;
	padding: 20px 10px;
	color: #fff;
	text-align: center;
	background-color: #999;
	border: #999 solid 2px; 
}
.btn-recruit li a:hover {
	color: #999;
	background-color: #fff;
	border: #999 solid 2px;
	transition: background-color 0.5s ease-out;
	-o-transition: background-color 0.5s ease-out; /* opera */
	-moz-transition: background-color 0.5s ease-out; /* firefox */
	-webkit-transition: background-color 0.5s ease-out; /* chrome, safari */
	-ms-transition: background-color 0.5s ease-out; /* ie */
}

/* ====================#company */
#company h2.ttl-main { color: #f08c8c; }

#company h2.ttl-main > span::before,
#company h2.ttl-main > span::after,
#company .box-list div:nth-child(2n+1) {
  background-color: #f08c8c;
}

#company .box-list a { padding: 20px 30px 0; }

#company .ttl-sub {
	border-top-color: #f08c8c;
	border-bottom-color: #f08c8c;
}

.msg-img {
	max-width: 400px;
	width: 40%;
	margin: 0 0 30px 50px;
	float: right;
}

.msg-img p { font-size: 18px; }

.csr-img {
	max-width: 230px;
	width: 40%;
	margin-left: 100px;
	float: right;
}

.csr-img2, .csr-img3 {
	width: 100%;
	display: -webkit-flex;
	display: flex;
   -webkit-flex-direction: row;
   flex-direction: row;}

.csr-img2 li, .csr-img3 li {
	margin: 20px 0 0 10px;
}
	.csr-img2 li:first-child, .csr-img2 li:first-child { margin-left: 0; }
.csr-img2 li img { max-width: 100%; }


@media screen and (max-width:768px) {
	.news-list li { padding: 10px 0; }
	.news-list li span { position: relative; display: block; }
	
	.search-area { width: 100%; margin: 20px auto 0; }
	.search-area dl { display: block; }
	.search-area dl dt { display: inline-block; width: 80px; margin-bottom: 10px; }
	.search-area dd { display: inline-block; width:  calc(100% - 90px); margin: 0 0 10px 0; }
	.search-area dd:last-of-type { width: 100%; }
	.search-map .poa { position: relative; width: 100%; top: 0; }
	.city-list { width: 100%; }
	
	#service .box-list a { padding: 20px; }
	#service .box-list div h3 { font-size: 1.5rem; }
	
	.flow-box::after { width: 30px; height: 31px; background-size: 100%; }
	.general-list li { width: 100%; }
	.general-list li:nth-child(3) { border-bottom: none; }	

	.flow-table dt { width: 100%; padding: 10px; }
	.flow-table dd { padding: 10px; width: 100%; border-top: 1px dashed #a2cce4; border-left: none; }
	.flow-table dd span { width: auto; display: block; }
	
	.list-protection { margin: 0 0 20px; }
	.list-protection li { font-size: 0.9rem; width: 100%; margin: 10px 0 0; padding: 5px 0; }

	.map-area { margin-top: 40px; }
	.map-area .list-protection { margin-top: 10px; }
	.map-area .list-protection li { font-size: 0.9rem; width: 100%; margin: 10px 0 0; padding: 5px 0; }
	.map-area div { width: 100%; }
	.map-area div .fl { float: none; width: 100%; font-size: 0.9rem; }
	.map-area div .fl img { margin-top: 50px; }
	.map-area div .fr { float: none; width: 100%; margin: 20px auto 0; }
	
	.list-menu { margin-top: 30px; }
	.list-menu li .list-inner { width: 60%; height: auto; padding: 20px; }
	.list-menu li .list-inner h3 { font-size: 1.5rem; }
	.list-menu li .list-inner p { font-size: 0.9rem; margin-top: 10px; }
	.list-menu li img { width: 40%; min-height: 145px; }	

	.box-support { margin-top: 0s; display: block; }
	.box-support div { width: 100%; margin: 0; }
	.box-support div img { margin: 30px 0 10px; }
	.box-support div.box-pink { margin-top: 30px; }
	.btn-print a { width: 100%;	}
	
	.column-3 { display: block; }
	.column-3 .column-inner { width: 100%; }
	.column-3 .column-inner p.txt-lead { font-size: 1.2rem;}
	
	h4.ttl-circle span { margin-bottom: 10px; }
	
	#company .box-list a { padding: 20px; }
	
	.slidetoggle_menu dt::after { top: auto; }

	.msg-img { max-width: 200px; width: 40%; margin: 0 0 15px 5%; }
	.msg-img p { font-size: 1em; }
	.csr-img { margin: 0 0 20px 20px; }

	.concept-area { display: block; }
	.concept-img { max-width: 306px; width: 80%; margin: 20px auto 0; }
	.concept-area p { width: 100%; }

	.box-work { display: block; }
	.box-work div { width: 47%; margin: 0 0 20px 6%; }
	/*.box-work div {  }*/
	.box-work div:nth-child(3n+1) { margin: 0 0 20px 6%; }
	.box-work div:nth-child(2n+1) { margin-left: 0; }
	
	.staff-box { display: block; margin-top: 30px; }
	.staff-box .staff-inner { width: 100%; text-align: center; }
	.staff-box .staff-inner p { font-size: 1rem; }
	.staff-box .staff-inner .staff-name { margin: 10px 0 20px; font-size: 3rem; }
	.staff-box img { max-width: auto; width: 100%; }
	
	.box-education div,
	.box-education div.w200 { width: 100%; margin: 0 0 20px; }	
	.box-education div.w48 { width: 100%; margin: 0 0 20px; }	
	.btnblue-list li { width: 100%; margin: 5px 0 0; }
	.btnblue-list li a { padding: 10px 1rem 10px 10px; }
	.btnblue-list li a::after { right: 5px; }
	
	.btn-recruit { margin-top: 40px; }
	.btn-recruit li {
		width: 100%;
		margin: 20px 0 0;
		display: block;
		font-size: 1rem;
	}
}


/* ====================#company */
#contact h2.ttl-main { color: #64aad2; }

#contact h2.ttl-main > span::before,
#contact h2.ttl-main > span::after,
#contact .box-list div:nth-child(2n+1) {
  background-color: #64aad2;
}

#contact .box-list a { padding: 50px 30px 0; }
#contact .box-list div:nth-child(2n+1) { padding: 30px 30px 0; box-sizing: border-box; }
#contact .box-list div a:nth-child(2n+1) { padding: 0; display: inline; }
#contact .box-list div li:hover a { display: block; }
#contact .box-list div a::after { display: none; }
#contact .box-list div li:hover {
		background-color: rgba( 255, 255, 255, 0.3 );
}
#contact .box-list div a:hover {
		background: rgba( 0, 0, 0, 0 );
}
/*#contact .box-list div:first-of-type { padding: 30px 30px 0; box-sizing: border-box; }
#contact .box-list div:first-of-type a { padding: 0; display: inline; }
#contact .box-list div:first-of-type li:hover a { display: block; }
#contact .box-list div:first-of-type a::after { display: none; }*/

#contact .box-list div h3 {
	font-size: 2.2rem;
	letter-spacing: 0;
}

#contact .box-list div ul {
	position: relative;
	margin-top: 20px;
	font-size: 1rem;
	line-height: 1.6;
}
#contact .box-list div ul li {
	padding-left: 1.5em;
	box-sizing: border-box;
	position: relative;
	vertical-align: top;
}
	#contact .box-list div ul li:before{
		content: "●";
		position: absolute;
		left: 0;
	}

#contact .ttl-sub {
	border-top-color: #64aad2;
	border-bottom-color: #64aad2;
}


/* mailform  =============================================*/
input, select, textarea {
	padding: 3px;
	line-height: 1.5;
	font-size: 1.1rem;
	box-sizing: border-box;
}

input[type="text"] { ime-mode: active; }

input[type="radio"],
input[type="checkbox"] { display: none; }

label.radio {
  position: relative;
  display: inline-block;
  padding: 3px 3px 3px 20px;
  cursor: pointer;
}
label.radio::before {
  position: absolute;
  content: '';
  top: 50%;
  left: 0;
  width: 14px;
  height: 14px;
  margin-top: -8px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 100%;
}
input[type="radio"]:checked + label.radio::after {
  position: absolute;
  content: '';
  top: 50%;
  left: 4px;
  width: 8px;
  height: 8px;
  margin-top: -4px;
  background: #3498db;
  border-radius: 100%;
}

label.checkbox {
  position: relative;
  display: inline-block;
  padding: 3px 3px 3px 22px;
  cursor: pointer;
	vertical-align: top;
}
label.checkbox::before {
  position: absolute;
  content: '';
  top: 50%;
  left: 0;
  width: 14px;
  height: 14px;
  margin-top: -8px;
  background: #fff;
  border: 1px solid #999;
}
input[type="checkbox"]:checked + label.checkbox::after {
  position: absolute;
  content: '';
  top: 30%;
  left: 3px;
  width: 13px;
  height: 5px;
  border-left: 2px solid #3498db;
  border-bottom: 2px solid #3498db;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

textarea {
	width: 100%;
	height: 8em;
	line-height: 1.5;
	resize: none;
	ime-mode: active;
}

.tbl-list p.mt5 { margin-top: 5px; }
.tbl-list td p span { margin-right: 10px; }

.w50 { width: 50px; }
.w100 { width: 100px; }
.w150 { width: 150px; }
.w300 { width: 300px; }

.btn-recruit li input {
	width: 100%;
	display: block;
	padding: 20px 10px;
	color: #67d7dd;
	font-size: 1em;
	font-weight: bold;
	text-align: center;
	border: 3px solid #67d7dd;
	background-color: #fff;
	cursor: pointer;
}
.btn-recruit li input:hover {
	background-color: #67d7dd;
	color: #fff;
}
.btn-recruit li:last-of-type input {
	color: #fff;
	background-color: #999;
	border: 3px solid #999;
}

.add-form {
	width: 80px;
	display: inline-block;
}
.add-form2 { width: calc(100% - 90px); }


@media screen and (max-width:768px) {
	#contact .box-list div:first-of-type { padding: 20px; }
	#contact .box-list a { padding: 20px; }
	input.w300 { width: 100%; }
	.add-form2 { width: 100%; }
}

/* ============================================== */
.tar { text-align: right; }
.tac { text-align: center; }

.fl	{ float: left; }
.fr	{ float: right; }

.sp { display: none; }
.pc { display: block; }



@media screen and (max-width: 768px) {
.pc{display:none !important;}
}

@media screen and (min-width: 769px) {
.sp{display:none !important;} 
}



.por { position: relative; }
.poa { position: absolute; }

.dib { display: block; }

.mt5	{ margin-top: 5px; }
.mt10	{ margin-top: 10px; }
.mt20	{ margin-top: 20px; }
.mt30	{ margin-top: 30px; }
.mt50	{ margin-top: 50px; }
.mt80	{ margin-top: 80px; }

.mb0 { margin-bottom: 0; }
.mb10	{ margin-bottom: 10px; }
.mb20	{ margin-bottom: 20px; }
.mb40	{ margin-bottom: 40px; }

.ml5	{ margin-left: 5px; }
.ml10 { margin-left: 10px; }
.ml30	{ margin-left: 30px; }

.mr10	{ margin-right: 10px; }
.mr30	{ margin-right: 30px; }

.pt30	{ padding-top: 30px; }
.pt20	{ padding-top: 20px; }
.pt60 { padding-top: 60px; }
.pt100 { padding-top: 100px; }
.pb70	{ padding-bottom: 70px; }
.pl30{padding-left: 30px;}

.w100p { width: 100%; }
.w85p { width: 85%; }

.blue { background: #64aad2; }
.purple { background: #aaaae6; }
.orange { background: #f0a064; }
.green { background: #78be78; }
.pink { background: #f08c8c; }
.red { color: #f00; }

.fz12 { font-size: 12px; }
.fz14 { font-size: 14px; }

.fwb { font-weight: bold; }


@media screen and (max-width:768px) {		
	.sp { display: block !important; }
	.pc { display: none !important; }	
}