@charset "UTF-8";


/*Products 固定nav 3列*/
.nav {
	width: 100%;
	color: #fff;
	background: #000;
	opacity: 0.8;
	z-index: 1;
	position: absolute;
	top: 0px;
	left: 0px;
}
.nav.fixed {
	position: fixed;
	left: 0;
	top: 0;
}
.nav ul {
	width: 1000px;
	margin: 0 auto;
	overflow: hidden;
}
.nav ul li {
	width: 333px;
	/*width: 142px;*/
	/*padding: 10px 0;*/
	text-align: center;
	list-style: none;
	float: left;
	display:block;
	height:66px;
	line-height:66px;
	font-size: 15px;
	font-family: "Open Sans", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
}

.nav ul li a {
	display:block;
	color:#fff;
	text-decoration:none
}

.nav ul li a:hover {
	display:block;
	color:#ccc;
	text-decoration:none
}

/*features*/
.features {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

.features_inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 0;
	 /*border:1px #ccc solid;*/
    width: 50%;
	line-height:160%;
}

.features_inner_pic {
    /*display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;*/
    padding: 0;
    width: 50%;
}

.features_inner_pic .ml_per{
	margin-left:-30%;
	width:120%;
	height:auto;
}

.features_inner_pic .mt-ml_per{
	margin:-15% 0 0 25%;
}

.features_inner_pic .mt_per{
	margin:-15% 0 0 0;
}

.features_inner_pic .mr_per{
	margin:0 0 0 15%;
}

.features_inner_pic .mr_per2{
	margin:0 0 0 30%;
}

.features_inner .txt{
	width: 80%;
	margin: auto 10%;
	text-align: left;
	font-size: 2em;
	line-height: 140%;
}

.features_inner .txt2{
	width: 55%;
	margin: 5% 35% 5% 10%;
	text-align: left;
	font-size: 2em;
	line-height: 140%;
}

.features_inner .txt_s{
	width: 100%;
	margin: 40px 0 0 0;
	text-align: left;
	font-size: 17px;
	line-height: 160%;
}

.features_inner .txt_logo{
	width: 80%;
	margin: 40% 10% 0 0;
	text-align: left;
	font-size: 40px;
	line-height: 140%;
}

.features_inner .txt_m{
	width: 80%;
	margin: 0 10% 25% 10%;
	text-align: left;
	font-size: 2em;
	line-height: 140%;
}

.features_inner .txt_ms{
	width: 100%;
	margin: 60% 0 0 35%;
	text-align: left;
	font-size: 2em;
	line-height: 140%;
}

.features_inner .txt_mt{
	width: 70%;
	margin: 60% 25% 10% 5%;
	text-align: left;
	font-size: 2em;
	line-height: 140%;
}

.features_inner .txt img{
	width: 100%;
	height:auto;
}

.features_inner .txt_logo img{
	width: 100%;
	height:auto;
}

.features_inner .img{
	width: 40%;
	height: auto;
	text-align: center;
	margin: 0 auto;
	float: none;
	}
	
.features_inner .img2{
	width: 55%;
	height: auto;
	text-align: center;
	margin: 0 auto;
	float: none;
	}

.img2{
	width: 70%;
	height: auto;
	text-align: center;
	margin: 0 auto;
	float: none;
	}
	
.img2 img{
	width: 100%;
	height: auto;
	margin: 0 auto;
	}

.features_inner img{
	width: 100%;
	height: auto;
	text-align: center;
	margin: 0 auto;
	float: none;
	}

.features_inner_pic img{
	width:100%;
	height:auto}

/*PC・スマホで表示・非表示にする*/
.pc_display{
}

.sp_display{
	display:none}

/*================================================
 *  タブレット向けデザイン
 ================================================*/
/* スクロールバーを考慮して20px大きいサイズで切り替え */
@media screen and (max-width:1179px) {

}

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

/*1番目非表示*/
.nav {
	width: 100%;
	position:static;
}
.nav.fixed {
	position:static;
}
.nav ul {
	width: 100%;
}
.nav ul li {
	width: 49.8%;
	height: 44px;
	line-height: 44px;
	font-size: 1.3em;
	letter-spacing: 0px;
	border-right: 1px solid #ebebeb;
	border-bottom: 1px solid #ebebeb;
}

.nav ul li:nth-child(2) {
     border-bottom:none;
}

.nav ul li:nth-child(3) {
     border-right:none;
	 border-bottom:none;
}

.nav ul li:first-child {
	display: none;
	font-size: 1.3em;
}

.features_inner {
	font-size:1.8em;
	width:100%;
}

.features_inner .txt{
	width: 90%;
	margin: 5% 5% 10% 5%;
	font-size: 1.2em;
}

.features_inner .txt2{
	width: 90%;
	margin: 5% 5% 10% 5%;
	font-size: 1.2em;
}

.features_inner .txt_logo{
	width: 90%;
	margin: 5% 5% 10% 5%;
}

.features_inner .txt img{
	width: 100%;
	height: auto;

}

.features_inner .txt_m{
	width: 90%;
	margin: 5% 5% 10% 5%;
	font-size: 1.2em;
}

.features_inner .txt_ms{
	width: 90%;
	margin: 5% 5% 10% 5%;
	font-size: 1.2em;
}

.features_inner .txt_mt{
	width: 90%;
	margin: 5% 5% 10% 5%;
	font-size: 1.2em;
}

.features_inner .img{
	width:60%;
	height:auto;
	margin:0 auto}
	
.features_inner .img2{
	width: 80%;
	height: auto;
	margin: 0 auto;
	float: none;
	}

.features_inner .img img{
	width:100%;
	height:auto;
	margin:0 auto}

.features_inner_pic{
		width:100%;
	}
.features_inner_pic img{
	width:100%;
	height:auto}

.features_inner_pic .ml_per{
	margin-left:0;
	width:100%;
	height:auto;
}

.features_inner_pic .mt_per{
	margin:0 0 0 0;
}

.features_inner_pic .mt-ml_per{
	margin:0 0 0 0;
}

.features_inner_pic .mr_per{
	margin:0 0 0 0;
}
.features_inner_pic .mr_per2{
	margin:0 0 0 0;
}

/*PC・スマホで表示・非表示にする*/
.pc_display{
	display:none
}

.sp_display{
	display: block;
}

.order1 {
  order: 1;
}
.order2 {
  order: 2;
}
}