@charset "utf-8";
/* -------index-Last UpDate : 2018/12/21------ */
/* .リセット */
/* .共通 */
/* .ヘッダー */
/* .お問い合わせ */
/* .フッター */
/*--------------------------------------------------------------------*/
/*                     .リセット                                      */
/*--------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, textarea {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	-webkit-box-sizing:border-box;
	        box-sizing:border-box;
}
html {
	font-size: 62.5%;/* 16px x 0.625 = 10px(=1rem) */
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
    list-style-position: inside;
}
ul li{
	word-break: break-all;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	word-break: break-all;
}
@media screen and (min-width: 980px) {
	a[href^="tel:"] { cursor: default; }
	a[href^="tel:"]:hover { opacity:1; }
}

/*--------フォームのリセット---------------------*/

input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}
/*--------------------------------------------------------------------*/
/*                     .共通                                      */
/*--------------------------------------------------------------------*/
.fixed {
    overflow: auto;
    height: 100%;
}
body {
    font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, Verdana , "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    font-weight:normal;
	font-size: 1.6rem;/* 16px */
	line-height:1.5;
	-webkit-text-size-adjust: 100%;
}
_:lang(x)::-ms-backdrop, body {
    font-family: "メイリオ", Meiryo, sans-serif;
} 
a{
	color:#005DB8;
	text-decoration: none;
	outline:none;
}
a:hover{
	cursor: pointer;
}
a:hover img{
	opacity:0.8;
}
a[href^="tel:"] {
	cursor: default;
}
.wrapper{
	overflow: hidden;
}
.content{
	margin:0 auto;
	padding-top:140px;
}
.inner{
	width:100%;
	max-width:1200px;
	margin:0 auto;
}
#index h2,
.contact h2{
	color:#005DB8;
	text-align: center;
	font-size:3.4rem;
	font-weight: bold;
	letter-spacing: 2px;
	margin-bottom:40px;
}
#index h2 span,
.contact h2 span,
h1 span{
	font-size:1.4rem;
	display: block;
	color:#aaa;
    font-weight:normal;
}
.btn-area{
	text-align: center;
}
.btn-area a{
	display: inline-block;
	border:solid 1px #005DB8;
	padding:15px 0;
}
/*--------------------------------------------------------------------*/
/*                     .ヘッダー                                      */
/*--------------------------------------------------------------------*/
.header{
	position:fixed;
	background-color:#fff;
	width:100%;
	height:84px;
	z-index:10;
}
.header .inner{
	max-width:1200px;
	margin:0 auto;
	position:relative;
	padding: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
-webkit-box-flex:1;
        -ms-flex:1;
            flex:1;

}
.header .logo{
	padding:12px 0 0;
}
.header .logo a{
	font-size:2.1rem;
	color:#333;
	font-weight: bold;
	white-space: nowrap;
}
.header .logo p{
	font-weight: normal;
	font-size:1.1rem;
	margin-bottom:7px;
}
.header .logo img{
	max-height:26px;
	width:auto;
	vertical-align: middle;
	margin-right:7px;
}
.navi{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
    flex-wrap:wrap;
    justify-content: space-between;
    padding:0 20px;
    width:100%;
    max-width:460px;
}
@media all and (-ms-high-contrast: none)  /* IE10以上 */
{
  .navi 
  {
    width:auto\9;  /* IE10以下 => 結果的にIE10のみ */
  }
}

.navi li{
	width:20%;
	text-align: center;
}
.navi li a{
	color:#333;
	font-weight: bold;
	font-size:1.5rem;
	width:100%;
	height:100%;
	text-align: center;
    display:-webkit-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-moz-flex;
    display:flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	position: relative;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
	line-height: 40px;
    padding:0;
    white-space:nowrap;
}
.navi li a::after {
  position: absolute;
  bottom: 10px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #005db8;
  -webkit-transform: scale(0, 1);
      -ms-transform: scale(0, 1);
          transform: scale(0, 1);
  -webkit-transform-origin: right top;
      -ms-transform-origin: right top;
          transform-origin: right top;
  -webkit-transition: -webkit-transform .3s;
  transition: -webkit-transform .3s;
  -o-transition: transform .3s;
  transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
}
.navi li a:hover::after {
  -webkit-transform-origin: left top;
      -ms-transform-origin: left top;
          transform-origin: left top;
  -webkit-transform: scale(1, 1);
      -ms-transform: scale(1, 1);
          transform: scale(1, 1);
}
body#products .navi li:nth-child(1) a::after,
body#company .navi li:nth-child(2) a::after,
body#recruit .navi li:nth-child(3) a::after,
body#partner .navi li:nth-child(4) a::after{
  -webkit-transform: scale(1, 1);
      -ms-transform: scale(1, 1);
          transform: scale(1, 1);
}
.header .fl-r{
	height:85px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: right;
	    -ms-flex-pack: right;
	        justify-content: right;
}
_:-ms-lang(x)::-ms-backdrop, .header .fl-r {
  min-width:320px;
}

.header .fl-r .phone{
	margin-top:14px;
	padding-right:15px;
}
.header .fl-r .phone a{
	font-size:2.2rem;
	font-weight:bold;
	display: inline-block;
	padding-left:22px;
	background:url("../img/common/icon_phone.png") no-repeat 0 center;
	background-size:22px 22px;
	white-space:nowrap;
}
.header .fl-r .phone span{
	display: block;
	text-align: right;
}
.header .fl-r .web a{
	height:100%;
	vertical-align: middle;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	color:#fff;
	text-align:center;
	font-size:1.4rem;
	background-color:#005DB8;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
    padding:0 15px;
    min-width:100px;
    white-space: nowrap;
}
.header .fl-r .web a:hover{
    background-color:#1F7BD5;
}
.btn-area a{
	display: inline-block;
	border:solid 1px #005DB8;
	padding:15px 0;
	text-align:center;
    position:relative;
}
.btn-area a:after{
    content: "";
    position: absolute;
    top: 40%;
    right: 10%;
    width: 10px;
    height: 10px;
    border-top: 1px solid #005DB8;
    border-right: 1px solid #005DB8;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
.btn-area a:hover{
    background-color:#E9E9E9;
}
.btn-area a:hover:after{
    right:8%;
}

/*--------------------------------------------------------------------*/
/*                     .お問い合わせ                                  */
/*--------------------------------------------------------------------*/
.contact{
	padding:60px 0;
	text-align: center;
	background-color:#f1f1f1;
}
.contact strong{
	font-weight: bold;
    display: inline-block;
    margin-bottom:10px;
}
.inquiry{
	max-width:750px;
	margin:0 auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	padding:40px 0;
	text-align: center;	
}
.inquiry div{
	width:340px;
	height:100px;
}
.inquiry div.phone{
	background-color:#fff;
}
.inquiry div.phone a{
    padding:20px;
    color:#333;
    display: inline-block;
    width: 100%;
}
.inquiry div.phone span{
	padding-left:40px;
	position:relative;
	font-size:2.6rem;
	font-weight: bold;
    letter-spacing: 3px;
}
.inquiry div.phone span:before{
	position:absolute;
	top:5px;
	left:0;
	content:"";
	width:24px;
	height:24px;
	background:url("../img/common/icon_phone.png") no-repeat 0 center;
	background-size:cover;
}

.inquiry div.web a{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	color:#fff;
	background-color:#005DB8;
	height:100%;
	font-size:2.0rem;
}
.inquiry div.web a span{
	position:relative;
	padding-left:40px;
}
.inquiry div.web a span:before{
	position:absolute;
	top:11%;
	left:0;
	content:"";
	width:24px;
	height:24px;
	background:url("../img/common/icon_mail-w.png") no-repeat 0 center;
	background-size:26px 18px;
}
.inquiry div.web a:hover{
    background-color:#1F7BD5;
}

/*--------------------------------------------------------------------*/
/*                     .フッター                                      */
/*--------------------------------------------------------------------*/
.return-top{
	display: block;
	width:56px;
	height:56px;
	position:fixed;
	right:0;
	bottom:0px;
	background:rgba( 0, 0, 0, 0.7 );
	z-index:3;
	text-align:center;
	line-height:50px;	
}
.return-top:hover:before{
	top:20px;
	-webkit-transition:all 0.3s;
	-o-transition:all 0.3s;
	transition:all 0.3s;
}
.return-top:before{
	position:absolute;
	margin: auto;
	content: "";
	top:24px;
    left: 20px;
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
}
.footer{
	background-color:#fff;
}
.footer .inner{
	padding:15px 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
}
.footer ul{
	width:68%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
}
.footer ul li{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-flex:auto;
	    -ms-flex-positive:auto;
	        flex-grow:auto;
}
.footer ul li a{
	display: block;
	font-size:1.4rem;
	line-height:40px;
	width:100%;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
.footer ul li a:hover{
	text-decoration: underline;
}

.footer .fl-r{
	width:28%;
}
.footer .fl-r p.logo{
    position:relative;
}
.footer .fl-r p.logo span{
	font-size:1.8rem;
    position:relative;
	padding-left:60px;
    white-space: nowrap;
}
.footer .fl-r p.logo span:before{
    content:"";
    position:absolute;
    top:0px;
    left:0;
    width:54px;
    height:20px;
    background:url("../img/common/img_logo.png") no-repeat 0 0;
    background-size:cover;
}
.footer .fl-r p{
	font-size:1.4rem;
}
.footer .fl-r p span{
	font-size:1.2rem;
}
.footer p.copy{
	text-align: center;
	line-height:40px;
	font-size:1rem;
	border-top:solid 1px #ccc;
}

/*--------------------------------------------------------------------*/
/*                     .幅960px以下                                      */
/*--------------------------------------------------------------------*/
@media screen and (max-width: 960px) {
	.inner{
		padding:0 15px;
	}
	.header{
		height:70px;
	}
    .header .logo {
        padding: 5px 0 0 5px;
    }
    .header .logo p{
        margin-bottom:2px;
    }
	.header .fl-r .web a span{
		display: none;
	}
	.header .fl-r{
		margin-right:80px;
        min-width:auto;
	}
	.header .fl-r .phone {
    	margin-top: 10px;
		padding-right:5px;
	}
	.header .fl-r .phone a{
		text-indent:-9999px;
		border:solid 1px #ccc;
		border-radius: 100%;
		width:50px;
		height:50px;
		background-position:center center;
	}
	.header .fl-r .phone span{
		display: none;
	}
	.header .fl-r .web{
		padding-top:10px;
		width:auto;
	}
	.header .fl-r .web a{
		border-radius: 100%;
        min-width:auto;
		width:50px;
		height:50px;
		border:solid 1px #ccc;
		background:url("../img/common/icon_mail.png") no-repeat center center;
		background-color:#fff;
		background-size:50% auto;
        padding:0;
	}
    .header .fl-r .phone a:hover,
    .header .fl-r .web a:hover{
        background-color: #DCDCDC;
    }
    .footer ul{
        display: none;
    }
    .footer .fl-r{
        width:100%;
        text-align: center;
    }
    .contact{
	    padding:60px 0 0 0;
    }
	.inquiry{
		display: block;
	}
	.inquiry>div{
		width:100%;
		margin-bottom:30px;
	}
    .inquiry div.phone a:hover{
        background-color:#f9f9f9;
    }
    .inquiry div.phone a:hover{
        color:#005DB8;
    }
}
/*--------------------------------------------------------------------*/
/*                     .幅860px以下                                      */
/*--------------------------------------------------------------------*/
@media screen and (max-width: 860px) {

	.navi{
		display: none;
	}
}
/*--------------------------------------------------------------------*/
/*                     .幅768px以下                                      */
/*--------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
    .btn-area a:after,
    .btn-area a:hover:after{
        right:5%!important;
    }
    	.header .logo a{
		font-size:3.2vw;
	}

}
/*--------------------------------------------------------------------*/
/*                     .幅480px以下                                      */
/*--------------------------------------------------------------------*/
@media screen and (max-width: 480px) {
	a[href^="tel:"] {
		cursor: pointer;
	}
	.header{
		height:50px;
	}
	.header .logo p{
		font-size:2vw;
	}
	.header .logo img {
        max-height: 20px;
    }
	.header .fl-r {
		width:auto;
	    margin-right: 60px;
	}
	.header .fl-r .phone {
    	margin-top: 5px;
    	padding-right: 5px;
	}
    .header .fl-r .phone a {
        width: 42px;
        height: 42px;
    }
	.header .fl-r .web {
	    padding-top: 5px;
	}
    .header .fl-r .web a {
        width: 42px;
        height: 42px;
    }
    .content{
        padding-top:90px;
    }
    .contact strong,
    .inquiry .phone p{
        font-size: 4.4vw;
    }
    .return-top:hover:before{
	    top:24px;
    }
    .inquiry div.phone span{
		font-size:7.4vw;
		letter-spacing:0;
	}
}
/*--------------------------------------------------------------------*/
/*                     .幅375px以下                                      */
/*--------------------------------------------------------------------*/
@media screen and (max-width: 375px) {
	.header .logo img {
        max-height: 16px;
    }
    .btn-area a::after {
        right: 3%;
    }
    
}