@charset "utf-8";
/*-----------------------------------------------
top common
-----------------------------------------------*/
body{
	width: 100%;
	color: #3d3d3d;
	font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-weight: 500;
	font-size: 16px;
	min-width:1100px;	
}

.minchoFontFamily{
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: 500;
}

/*-----------------------------------------------
#mainVisual
-----------------------------------------------*/
#mainVisual{
	width: 100%;
	min-width: 1100px;
	background: #e9ecf1 url(../img/images/mainVisual_img_201907.jpg) no-repeat;
	background-position: center 1px;
	background-size: cover;
	height: 0;
	 /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
	padding-bottom: 39.1%;
	position: relative;
	font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

#mainVisual .h2box{
	width: 600px;
	position: absolute;
    left: 100px;
	top: 100px;
}
/* adobe fonts*/
#mainVisual .h2box{
font-family: tbnpmincho-std, serif;
    font-weight: 300;
    font-style: normal;
}

#mainVisual h2{
	font-size: 34px;
	line-height: 1.4;
	color: #fff;
}

#mainVisual h2 span.b{
	font-size: 42px;
}

#mainVisual .h2box_p{
	padding-top: 40px;
	font-size: 14px;
	line-height: 1.2;
	color: #fff;
}

#mainVisual .cclicence{
	position: absolute;
    right: 50px;
	bottom: 2px;
}

#mainVisual .cclicence a{
	color: #fff;
	font-size: 10px;
	text-decoration: none;
}
#mainVisual .cclicence a:after{
	color: #fff;
}

@media screen and (min-width:1700px) {
/*　画面サイズが1700pxからはここを読み込む　*/
	#mainVisual .h2box{
	left: 150px;
	top: 150px;
}
#mainVisual h2{
	font-size: 42px;
}
#mainVisual .h2box_p{
	font-size: 16px;
	padding-top: 60px;
}
		}


/*---------------------------------------
#epkitContents
-----------------------------------------------*/
#epkitContents{
	background: #e9ecf1;
	width: 100%;
	padding-bottom: 100px;
	min-width:1100px;	
}
#epkitContents a.black{color: #333;}
#epkitContents h2{
	font-size: 26px;
	text-align: center;
	padding: 61px 0;
}
.epkitContentsWrap{
	width: 1100px;
	margin:0 auto;
	overflow:hidden;
}

/* ----- .epkitBasic ----- */
.epkitBasic{
	background: url(../img/epkit-basic.png) no-repeat 0 25px;
	position: relative;
	width: 900px;
	height: 600px;
	float: left;
	margin-bottom:70px;
}
.epkitBasic h3{
	font-weight: bold;
	font-size: 16px;
	padding-left: 40px;
}
.epkitBasic p{
	font-size: 12px;
}
.epkitBasic p span{
	font-size: 10px;
}
.epkitBasic01{
	background: url(../img/epkit-basic-01.gif) no-repeat;
	position: absolute;
	top: 5px;
	left: 80px;
}
.epkitBasic01 + p{
	width: 305px;
	position: absolute;
	top: 30px;
	left: 80px;
}
.epkitBasic02{
	background: url(../img/epkit-basic-02.gif) no-repeat;
	position: absolute;
	top: 145px;
	left: 620px;
}
.epkitBasic02 + p{
	width: 285px;
	position: absolute;
	top: 175px;
	left: 610px;
}
.epkitBasic02Img{
	width: 121px;
	position: absolute;
	top: 263px;
	left: 775px;
}
.epkitBasic03{
	background: url(../img/epkit-basic-03.gif) no-repeat;
	position: absolute;
	top: 380px;
	left: 5px;
}
.epkitBasic03 + p{
	width: 300px;
	position: absolute;
	top: 410px;
	left: 5px;
}
.epkitBasicName2{
	position: absolute;
	top: 380px;
	left: 353px;
    font-weight: bold;
}
.epkitBasicSetList{
	font-size: 11px;
	background-color: #d7dadf;
	width: 280px;
	position: absolute;
	right: 0;
    bottom: 0;
	padding:15px;
}
.epkitBasicSetList dt{
	font-size: 12px;
	font-weight: bold;
	line-height: 1.8;
	margin-bottom:10px;
}
.epkitBasicSetList dd{
	line-height: 1.5;
}

/* ----- .epkitSeries ----- */
.epkitSeries{
	float: left;
	width:150px;
    text-align: center;
	margin:0 0 0 30px;
}
.epkitSeriesTitle{
	font-weight: bold;
	font-size: 13px;
	margin:10px 0;	
}
.epkitSeriesLead{
	font-size: 11px;
	width: 125px;
	line-height: 1.5;
	margin:0 auto;
	text-align:left;
}
.epkitSeries img{
	display: block;
	margin: 25px auto;
}

/* ----- .btn ----- */
.btn div{
	width: 550px;
	float: left;
	text-align: center;
}
.btnTitle{
	font-weight: bold;
	font-size: 16px;
}

.btnLead{
	font-size: 12px;
}
.btn a{
	display: block;
	text-decoration: none;
	color: #101f37;
	font-weight: bold;
	width: 356px;
	margin: 0 auto;
	border: solid 3px #101f37;
	background: url(../img/btn-arrow.png) no-repeat 20px 26px;
	text-align: center;
}
.btn a:hover{
	color: #ffffff;
	background: #101f37 url(../img/btn-arrow-hover.png) no-repeat 20px 26px;
}
.btn a:active{
	color: #ffffff;
	background: #101f37 url(../img/btn-arrow-hover.png) no-repeat 20px 26px;
}
.subText{
	font-size: 11px;
	margin-bottom: 1px;
}
.replaceBtn{
	padding-top: 12px;
	height: 53px;
}
.epkitBtn{
	padding-top: 28px;
	height: 38px;
}

/*-----------------------------------------------
#replaceContents
-----------------------------------------------*/
#replaceContents{
	background: url(../img/replace-unit-bgimg.jpg) no-repeat bottom right;
	width: 100%;
	padding-bottom: 70px;
	min-width:1100px;
}
#replaceContents h2{
	font-size: 26px;
	text-align: center;
	padding: 61px 0;
}
.replaceContentsWrap{
	width: 1100px;
	margin: 0 auto;
	overflow:hidden;
}
.epkitLogo{
	text-align: center;
	margin: 28px 0 47px 0;
}

.replaceDiscription{
	width: 800px;
	margin: 0 auto 70px auto;
}

/*-----------------------------------------------
#information
-----------------------------------------------*/
#information{
	width: 1100px;
	margin: 50px auto 30px auto;
	background: url(../img/information.gif) no-repeat top center;
	padding-top: 60px;
	font-size: 14px;
	overflow:hidden;
}
#information dl{
	width: 980px;
	margin: 0 auto;
	padding-left:50px;
	line-height: 1.8;
}
#information dt{
	width: 100px;
	float: left;
    clear: left;
	font-weight: bold;
	margin-bottom:20px;
}
#information dd{
	width: 880px;
	float: left;
	margin-bottom:20px;
}

/*-----------------------------------------------
#csr
-----------------------------------------------*/
#csr{
	height: 415px;
	background: url(../img/csr-bgimg.jpg) no-repeat 50% 50%;
	background-size: cover;
	min-width:1100px;
}
.csrBg{
    background-color:rgba(0,0,0,0.65);
	width: 100%;
	height: 100%;
	min-width:1100px;
}
.csrWrap{
	width: 1100px;
	margin: 0 auto;
}
/* ----- .csrLeft ----- */
.csrLeft{
	width: 500px;
	float: left;
	padding: 60px 20px 0 20px;
	}
.csrLeftP{
	color: #fff;
	font-size: 12px;
	letter-spacing: 2px;
	padding-left: 23px;
	background: url(../img/csr-arrow.png) no-repeat 0 2px;
	margin-top: 10px;
}
.csrLeft a{
	font-weight: bold;
	background-color:rgba(255,255,255,0.5);
}
.csrLeft a:hover{
	background-color:rgba(0,102,204,0.8);
	text-decoration: none;
	color: #fff;
}
/* ----- .csrRight ----- */
.csrRight{
	width:  500px;
	float: right;
	padding-top: 100px;
	color: #fff;
	text-align: center;
}
.csrBtnTitle{
	letter-spacing: 2px;
	font-size: 20px;
	font-weight: bold;
}
.contactBtnBox {
    padding-top: 22px;
    height: 44px;
    font-size: 24px;
    letter-spacing: 3px;
}
.csrRight a{
	display: block;
	text-decoration: none;
	color: #101f37;
	font-weight: bold;
	width: 356px;
	margin: 20px auto 0 auto;
	border: solid 3px #101f37;
	background: #ffffff url(../img/btn-arrow.png) no-repeat 20px 26px;
	text-align: center;
}
.csrRight a:hover{
	color: #ffffff;
	background: #101f37 url(../img/btn-arrow-hover.png) no-repeat 20px 26px;
}
.csrRight a:active{
	color: #ffffff;
	background: #101f37 url(../img/btn-arrow-hover.png) no-repeat 20px 26px;
}

/*-----------------------------------------------
#corporate
-----------------------------------------------*/
#corporate{
	overflow:hidden;
	min-width: 1100px;
}
/* ----- .ggmap ----- */
.ggmap{
	width: 50%;
	float: left;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
	width: 100%;
}
.ggmap iframe{
	border: 0;
}
/* ----- corporateInfo ----- */
.corporateInfo{
	width: 50%;
	float: left;
}
.corporateInfoBox{
	padding: 100px 0 0 50px;
}
.corporateInfoBox h2{
	font-size: 17px;
	font-weight: bold;
	text-align:left;
	padding: 0;
}
.corporateInfoBox p{
	font-size: 14px;
}
.corporateInfoBox dl{
	width:550px;
	margin: 50px 0 0 0;
	font-size: 13px;
	line-height: 1.5;
}
.corporateInfoBox dt{
	float: left;
  	clear: left;
  	width: 180px;
  	padding-bottom: 20px;
}		
.corporateInfoBox dd{
	float: left;
	width: 370px;
	padding-bottom: 20px;
}
.sns{
	width:550px;
	overflow: hidden;
    position: relative;
    zoom:1;
}
.sns li{
	float:left;
	padding-right:50px;
}

.csrLeftP {
.csrLeftP {
	
}