@charset "utf-8";
/* CSS Document */


/*----------------------------------
header
----------------------------------*/
#movie {
  text-align: center;
  width: 100%;
}
video {
  width: 100%;
}

/*----------------------------------
company
----------------------------------*/
.company {
	background: url(images/company/bg_company.jpg) no-repeat center top;
}
.company h2 {
	text-align: center;
}
#company_in {
	width: 940px;
	margin: 0 auto;
	position: relative;
	padding: 35px 0 0;
}
#company_in h3 {
	text-align: right;

}
#company_img {
	position: absolute;
	top:2px;
	left:0;
  z-index: 100;
  overflow: hidden;
}
#comapny_img img#title1 {
    margin-top: -45px;
    margin-left: -140px;
    top: 50%;
    left: 50%;
    width: 280px;
    height: 90px;
    position: absolute;
    visibility: hidden;
}
#company_txt {
	padding: 40px 0 45px 540px;
	text-align: right;
	font-weight: bold;
	line-height: 1.7;
}
#greeting {
	background: url(images/company/bg_greeting.png) no-repeat center top;
	background-size: contain;
	width: 338px;
	height: 278px;
	float: right;
	padding: 35px 0;
	margin: 0 15px -20px 0;
}
#greeting h4 {
	text-align: center;
}
#greeting p {
	padding: 10px 30px 0;
	font-weight: bold;
}
#greeting p span {
	display: block;
	padding: 10px 0 0;
}
.company table {
	clear: both;
	margin: 0 0 0 35px;
}
.company table th {
	font-weight: bold;
	text-align: left;
	font-size: 18px;
	padding: 0 0 20px 40px;
	vertical-align: top;
}
.company table td {
	padding: 0 0 20px 35px;
	font-size: 18px;
	vertical-align: top;
}

/*----------------------------------
price_plan
----------------------------------*/
#price_plan {
  background: url(images/flow/bg_price_plan.png) no-repeat center top;
  width: 980px;
  height: 286px;
  margin: 80px auto 50px;
}
#price_plan h3 {
  padding: 36px 0 0 50px;
}
#price_plan .price {
  float: left;
  width: 490px;
  height: 286px;
}
#price_plan .plan {
  float: right;
  width: 490px;
  height: 286px;
}
#price_plan .price_p, #price_plan .plan_p {
  padding: 25px 0 0 50px;
  font-weight: bold;
  color: #333;
  line-height: 1.5;
}
.price_btn, .plan_btn {
  height: 43px;
  padding: 45px 0 0;
  width: 382px;
  margin: 0 auto;
}
.price_btn a {
  background: #e46350 url(images/common/arrow01.png) no-repeat 115px 10px;
	padding: 11px 130px 11px 154px;
	color: #fff;
	font-weight: bold;
}
.price_btn .button {
  border-radius:1px;
}
.plan_btn a {
  background: #404040 url(images/common/arrow01.png) no-repeat 115px 10px;
	padding: 11px 113px 11px 147px;
	color: #fff;
	font-weight: bold;
}
.plan_btn .button {
  border-radius:1px;
}

/*----------------------------------
ipad縦
----------------------------------*/
@media screen and (max-width:960px){
	.company h2 {
		width: 100%;
		height: 242px;
		display: table-cell;
		vertical-align: middle;
	}
	.company h2 img {
		width: 100%;
		height: auto;
	}
	#company_in {
		width: 92%;
		padding: 30px 3% 0;
	}
	#company_in h3 {
		text-align: center;
	}
	#company_img {
		position: static;
		width: 46%;
		float: left;
	}
	#company_img img {
		width: 100%;
		height: auto;
	}
	#company_txt {
    padding:  20px 0 40px 0;

	}
	#greeting {
		margin-bottom: 15px;
	}
	.company table {
		margin: 0 auto;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
	}
	.company table th {
		width: 18%;
		padding: 8px;
	}
	.company table td {
		padding: 8px;
	}
	#price_plan {
		background: #f2f2f2 url(images/common/bg_price_plan_s.png) no-repeat 0 70%;
		background-size: contain;
		border: #e6e6e6 5px solid;
		width: 96%;
	}
	#price_plan .price {
	  width: 50%;
	}
	#price_plan .plan {
	  width: 50%;
	}
	.price_btn, .plan_btn {
	  width: 248px;
	  margin: 0 0 0 10%;
	}
	.price_btn a {
	  background: #e46350 url(images/common/arrow01.png) no-repeat 25px 10px;
	  padding: 11px 70px 11px 80px;
	}
	.plan_btn a {
	  background: #404040 url(images/common/arrow01.png) no-repeat 25px 10px;
	  padding: 11px 63px 11px 73px;
	}

}

/*----------------------------------
smartphone
----------------------------------*/
@media screen and (max-width:667px){
	#company_in h3 img,
	#greeting h4 img,
	#price_plan h3 img {
		width: 100%;
		height: auto;
	}
	/*company*/
	.company {
		background: none;
	}
	.company h2 {
		display: block;
		height: auto;
	}
	#company_in {
		padding: 20px 0;
	}
	#company_in h3 {
		width: 70%;
		margin: 0 auto;
	}
	#company_img {
		float: none;
		width: 60%;
		margin: 5px auto;
	}
	#company_txt {
		padding: 10px 0 20px;
		text-align: center;
		font-size: 12px;
	}
	#greeting {
		background: none;
		border: 3px solid #9f0450;
		float: none;
		width: 96%;
		margin: 0 auto;
		padding: 0;
		height: auto;
	}
	#greeting h4 {
		width: 70%;
		margin: 10px auto;
	}
	#greeting p {
		padding: 0 10px 10px;
		font-size: 12px;
	}
	/*company_table*/
	.company table {
		width: 100%;
		margin: 20px 0 0;
	}
	.company table th, .company table td {
		width: 100%;
		font-size: 12px;
		display:block;
	}
	.company table td {
		padding: 0 8px 12px;
	}
	/*price_plan*/
	#price_plan {
		height: auto;
		overflow: hidden;
		padding: 0 0 15px;
		margin-top: 30px;
	}
	#price_plan h3 {
		padding: 10px 5px;
		width: 80%;
	}
	#price_plan .price, #price_plan .plan {
		height: auto;
	}
	#price_plan .price_p, #price_plan .plan_p {
		padding: 10px 5px;
		font-size: 10px;
	}
	.price_btn, .plan_btn {
		width: 150px;
		height: auto;
		margin: 0 auto;
		padding: 10px 0 0;
	}
	.price_btn a, .plan_btn a {
		padding: 5px 20px;
		font-size: 12px;
		background: #e46350;
	}
	.plan_btn a {
		background: #404040;
	}
}