body , h2 , h3 {
	font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}
.container {
	width: 980px;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
}
.row {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px;
}
.col-12{
	webkit-box-flex: 0;
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%;
	padding-right: 15px;
	padding-left: 15px;
}
.col-7{
	webkit-box-flex: 0;
	-ms-flex: 0 0 55.333%;
	flex: 0 0 55.333%;
	max-width: 55.333%;
	padding-right: 15px;
	padding-left: 15px;
}
.col-6{
	webkit-box-flex: 0;
	-ms-flex: 0 0 50%;
	flex: 0 0 50%;
	max-width: 50%;
	padding-right: 15px;
	padding-left: 15px;
}
.col-5{
	webkit-box-flex: 0;
	-ms-flex: 0 0 44.667%;
	flex: 0 0 44.667%;
	max-width: 44.667%;
	padding-right: 15px;
	padding-left: 15px;
}
.col-4{
	webkit-box-flex: 0;
	-ms-flex: 0 0 33.33333%;
	flex: 0 0 33.33333%;
	max-width: 33.33333%;
	padding-right: 10px;
	padding-left: 10px;
}
/*既存CSSをリセット*/
.mailhostingWrap h2,.mailhostingWrap h3,.mailhostingWrap h4{
	margin:0;
	padding:0;
}
sup{
	font-size:60%;
}
.mailhostingWrap a:link{
	color:#BF0000;
}
@media (max-width: 768px) {
	img{
		width:100%;
	}
	.container{
		width:540px;
	}
	.col-7,.col-6,.col-5,.col-4{
		webkit-box-flex: 0;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
		padding-right: 15px;
		padding-left: 15px;
	}
	.d-none {
		display: none !important;
	}
}
@media (max-width: 540px) {
	.container{
		width:100%;
	}
}
/* 一番上
---------------------------------------- */
.promotion.home{
	background:#d7e4bd;
	padding:25px 0;
}
.promotion.home .leftArea{
	padding-top:25px;
}
.promotion{
	background:#e0ffa3;
	padding:50px 0;
}
.promotion h1{
	margin:0;
	text-align:left;
	margin-bottom:20px;
}
.promotion p{
	margin-bottom:20px;
}
.promotion .read{
	font-size:24px;
	margin-bottom:10px;
	font-weight:bold;
}
.promotion .note{
	font-size:12px;
}
.promotion .btn a{
	cursor: pointer;
	font-size: 18pt;
	padding: 15px 20px;
	border-radius: 10px;
	display: inline-block;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	background:#008000;
	font-weight:bold;
	border-radius:10px;
}
.promotion .btn a{
	color:#fff;
}
.promotion .btn a:hover{
	background:#009f00;
}
@media (max-width: 768px) {
	.promotion .btn{
		text-align:center;
	}
}
@media (max-width: 540px) {
	.promotion .read{
		font-size:18px;
	}
	.promotion .btn a{
		font-size:14px;
	}

}
/* リード文
---------------------------------------- */
.readArea{
	padding:30px 0;
	text-align:center;
	font-size:24px;
	background:#fff;
}
.readArea .large{
	font-size:30px;
	font-weight:bold;
	margin-top:15px;
	color:#008000;
}

@media (max-width: 540px) {
	.readArea{
		font-size:18px;
	}
	.readArea .large{
		font-size:20px;
	}
}
/* メールホスティング説明
---------------------------------------- */
.hostingDesc{
	background:#ebf1de;
	padding:50px 0;
	text-align:center;
}
.hostingDesc h2{
	margin-bottom:30px;
}
.hostingDesc h3{
	font-weight:bold;
	margin-bottom:20px;
}
.hostingDesc ul{
	text-align:left;
	width:260px;
	margin:30px auto 0;
}
@media (max-width: 540px) {
	.hostingDesc{
		padding:50px 0 30px;
	}
	.hostingDesc .row{
		margin-top:30px;
	}
	.hostingDesc .row img{
		width:60%;
	}
	.hostingDesc ul{
		margin:30px auto 50px;
	}
}
/* 3つの特徴
---------------------------------------- */
.threeReasons01{
	background:#008000;
	padding:50px 0;
	text-align:center;
	color:#fff;
}
.threeReasons01 h2{
	margin-bottom:30px;
	color:#fff;
	font-weight:bold;
	font-size:28px;
	line-height:1.5;
}
.threeReasons01 h3{
	font-size:28px;
	text-decoration:underline;
	color:#fff;
	margin-bottom:50px;
}
.threeReasons01 .reasonsBox{
	background:#fff;
	border-radius:10px;
	padding:30px 15px;
	color:#000;
}
.threeReasons01 .reasonsBox h4{
	font-size:24px;
	font-weight:bold;
	margin-bottom:20px;
	line-height:1.5;
}
.threeReasons01 .reasonsBox p{
	text-align:left;
	margin-top:20px;
}
@media (max-width: 540px) {
	.threeReasons01{
		padding:50px 0 30px;
	}
	.threeReasons01 h2,
	.threeReasons01 h3{
		font-size:1.4rem;
	}
	.threeReasons01 .reasonsBox{
		margin-bottom:20px;
	}
}

.threeReasons02{
	background:#ebf1de;
	padding:50px 0;
	text-align:center;
}

.threeReasons02 h3{
	font-size:28px;
	text-decoration:underline;
	color:#008000;
	margin-bottom:50px;
}
.threeReasons02 .row{
	margin-bottom:30px;
}
.threeReasons02 h4{
	font-size:24px;
	font-weight:bold;
	margin-top:20px;
	line-height:1.5;
}
.threeReasons02 ul{
	text-align:left;
	width:250px;
	margin:20px auto 0;
}
.threeReasons02 ul li span{
	position: relative;
}
.threeReasons02 ul .ninki:after{
	content: url(/content/dam/nttcom/hq/jp/business/lp/s1/images/mailhosting/icon_ninki.png);
	position: absolute;
	top: 0;
	right:-55px;
	padding: 0;
	line-height: 1;
}
@media (max-width: 540px) {
	.threeReasons02{
		padding:50px 0 30px;
	}
	.threeReasons02 h3{
		font-size:1.4rem;
	}
	.threeReasons02 img{
		width:40%;
	}
	.threeReasons02 ul{
		margin-bottom:30px;
	}
}

.threeReasons03{
	background:#008000;
	padding:50px 0;
	text-align:center;
}

.threeReasons03 h3{
	font-size:28px;
	text-decoration:underline;
	color:#fff;
	margin-bottom:50px;
}
.threeReasons03 .reasonsBox{
	background:#fff;
	border-radius:10px;
	padding:50px;
}
.threeReasons03 .reasonsBox p{
	font-size:20px;
	text-align:left;
	margin-top:20px;
}
@media (max-width: 540px) {
	.threeReasons03{
		padding:50px 0 30px;
	}
	.threeReasons03 h3{
		font-size:1.4rem;
	}

}


/* 基本機能
---------------------------------------- */
.basicFunction{
	background:#fff;
	padding:50px 0;
	text-align:center;
}
.basicFunction h2{
	font-size:30px;
	color:#008000;
	font-weight:bold;
	line-height:1.5;
	margin-bottom:30px;
}
.basicFunction h3{
	font-size:30px;
	line-height:1.5;
	margin-bottom:30px;
}
.basicFunction table{
	width:48%;
}
.basicFunction table th{
	vertical-align:middle;
	width:25%;
	background:#008000;
	color:#fff;
	font-weight:bold;
	line-height:1.5;
}
.basicFunction .leftList{
	float:left;
}
.basicFunction .rightList{
	float:right;
}
@media (max-width: 540px) {
	.basicFunction h2,.basicFunction h3{
		font-size:1.4rem;
	}
	.basicFunction table{
		width:100%;
	}
	.basicFunction .leftList{
		float:none;
	}
	.basicFunction .rightList{
		float:none;
	}
	.basicFunction table th{
		width:40%;
	}
}
/* 料金
---------------------------------------- */
.price{
	background: #f5f5f5;
	padding: 50px 0;
	text-align:center;
}
.price h2{
	font-size:30px;
	color:#008000;
	font-weight:bold;
	line-height:1.5;
	margin-bottom:30px;
}
.price h3{
	font-size:30px;
	line-height:1.5;
	margin-bottom:10px;
}
.price .priceRead{
	font-size:20px;
}
.price h4{
	font-size:24px;
	margin-top:45px;
	margin-bottom:25px;
	text-align:left;
	font-weight:bold;
}
.price table{
	width:100%;
	margin-bottom:10px;
}
.price table th{
	vertical-align:middle;
	background:#008000;
	color:#fff;
	font-weight:bold;
	line-height:1.5;
	text-align:center;
}
.price table td{
	vertical-align:middle;
	background:#fff;
	text-align:center;
}
.price table td ul{
	list-style:none;
	text-align:left;
	margin:0;
	padding:0;
}
.price table td ul li{
	text-indent:-1em;
	padding-left:1em;
}
.price .per30{
	width:33%;
}
@media (max-width: 540px) {
	.price h2{
		font-size:1.4rem;
	}
	.price h3,.price h4{
		font-size:1.3rem;
	}
	.priceRead{
		font-size:1.2rem;
	}
	.price .scrollOuter {
		position: relative;
		height: 165px;
	}

	.price .scrollOuter.option {
		height: 370px;
	}
	.price .scrollInner {
		left: 0;
		height: 100%;
		overflow-x: auto;
		overflow-y: hidden;
		position: absolute;
		top: 0;
		width: 100%;
	}

	.price .scrollInner .listWrap {
		width: 800px;
		transform-origin: left top;
		transform: scale(1);
	}
}
/* description
---------------------------------------- */
.description{
	padding: 50px 0 20px;
	background:#f5f5f5;
	text-align:center;
}
.description h2{
	margin-bottom:30px;
}
.description h3{
	font-weight:bold;
	font-size:30px;
	margin-bottom:20px;
}
.description p{
	font-size:20px;
	width:874px;
	margin:0 auto 30px;
	text-align:left;
}
@media (max-width: 768px) {
	.description{
		width:100%;
	}
	.description h3{
		font-size:24px;
	text-align:left;
	}
	.description p{
		width:100%;
		font-size:18px;
	}
}
/* closing
---------------------------------------- */
.closing{
	padding: 50px 0 20px;
}
.closing p{
	font-size:12px;
	margin-bottom:130px;
}
@media (max-width: 768px) {
	.closing p{
		margin-bottom:50px;
	}
}